a simple, temporary, reusable reverse proxy, with benefits. designed for prototyping js apps by serving static files, live code reloads, and CORS bypassing
Decors is a simple, temporary, reusable reverse proxy, with benefits.
These are a few ways I've found this software to be useful. See the usage for more technical explanations of features.
--watch flag, it can inject LiveReload middleware into each page, initiating a reload on all browsers (even mobile) when a source file changes or a CSS injection when stylesheets are updated.
Decors, by default, will serve static files using the working directory (or specified directory) as a root directory. Having Decors serve static assets, in my experience, is quicker than having the application server, such as Tomcat, serve them (and probably better reflects a production environment where something like NginX or Varnish will be serving static assets, though Decors intentionally does not cache files).
--backend <baseurl> flag, Decors can make a static file server, as described above, look like it has the API to your back-end service available. The back-end flag is intended to allow quick front-end prototyping by allowing a separate front-end app make calls to your API as if they were on the same server/port (thereby bypassing any sort of CORS restrictions). This lets developers create front-end web apps separate from the main back-end service and be able to merge the front- and back-end codebases without configuration changes.
npm install -g decors
Suppose you have a web service that looks like this
==> GET /post/:id==> POST /post/add==> DELETE /post/:id/remove
…and you want to build a super cool front-end app for it.
So locally you set up this app structure:
You then install decors globally and run
decors ~/Sites -w -b http://www.example.com.
Now, you can develop your app as if your remote back-end API is available locally:
/ [index.html] # static files served and reloaded from ~/Sites/js/app.js/favicon.ico==> GET /post/:id # remote API routed through decors and available CORS-free==> POST /post/add==> DELETE /post/:id/remove
If you were running jQuery, doing something like this in
localhost:9000 would be totally valid:
$ajax'/post/1'doneconsole.logdata; // logs the output of;
In the background, decors tries to act as a proxy, making the response from
http://www.example.com/post/1 available through
decors [path] [options]
path is the relative or absolute path to the web app directory and
options are as below:
-w, --watch reload app and inject css on file save-b, --backend <baseurl> have decors make backend requests to eliminate CORS issues-p, --port <port> set a custom port (default 9000)
- decors serves static files via Connect's static middleware (and will display
index.htmlwhen requested a directory)
- decors tries to serve static files before making remote calls. If you want to mock out responses from your back-end you can create files in the corresponding path to their remote API calls.
- decors LiveReload middleware does not work well with the LiveReload browser plugin, so you may need to disable any plugins before using successfully.
- decors will try its best to avoid infinite loops, but if any are encountered, too bad.
- Although decors is primarily meant to act as a proxy for RESTful APIs, I've added in support for images and theoretically other filetypes, but I'd recommend sticking with JSON (and maybe images), as responses are stored in memory before sent to the client.
- Watching very large hierarchies of files can be very CPU intensive, so be mindful with the