docs.. examples

9 years ago · a5a1b6f9ec
10 changed files with 83 additions and 13 deletions
--- a/README.md
+++ b/README.md
@ -10,13 +10,31 @@ A simple web-server for productive front-end development.
 **Requires node v4.0.0 or higher**.

 ## Synopsis
+Some typical use cases..

-Serve a directory on the default port:
+### Static site
+Fire up your site on the default port:
 ```sh
+$ tree
+.
+├── css
+│   └── style.css
+└── index.html
+
 $ ws
 serving at http://localhost:8000
 ```

+### Single Page Application
+
+Mark `index.html` as an SPA with client-side routing.
+```sh
+$ ws --spa index.html
+```
+
+With this option, routes with existing files (e.g. `/css/style.css`) will be served normally as static assets. Routes without an existing file (e.g. `/user/1`, `/login` etc.) are passed directly to your SPA. Without this option they would 404.
+
+
 Blacklist certain paths, for example config files:
 ```sh
 $ ws --forbid .json .yml
@ -28,11 +46,17 @@ Reduce bandwidth with gzip compression:
 $ ws --compress
 ```

-Specify a Single Page Application:
+When urls don't map to your directory structure, rewrite:
 ```sh
-$ ws --spa index.html
+$ ws --rewrite /css=>/build/css
+```
+
+Rewrite to remote servers:
+```sh
+$ ws --rewrite /api=>http://api.example.com/api /npm=>http://registry.npmjs.com
 ```

+
 ## Install
 Ensure [node.js](http://nodejs.org) is installed first. Linux/Mac users may need to run the following commands with `sudo`.

@ -116,6 +140,9 @@ You can set additional mime-type/extension mappings, or override the defaults by
 }
 ```

+## Use with Google DevTools Workspaces
+
+
 ## Log Visualisation
 Instructions for how to visualise log output using goaccess, logstalgia or gltail [here](https://github.com/75lb/local-web-server/wiki/Log-visualisation).

--- a/example/simple/css/style.css
+++ b/example/simple/css/style.css
@ -0,0 +1,7 @@
+body {
+  background-color: #AA3939;
+  color: #FFE2E2
+}
+svg {
+  fill: #000
+}
--- a/example/simple/index.html
+++ b/example/simple/index.html
@ -0,0 +1,10 @@
+<head>
+  <link rel="stylesheet" href="css/style.css">
+</head>
+<h1>Amazing Page</h1>
+<p>
+  With a freaky triangle..
+</p>
+<svg width="500" height="500">
+  <polygon points="250,0 0,500 500,500"></polygon>
+</svg>
--- a/example/spa/.local-web-server.json
+++ b/example/spa/.local-web-server.json
@ -0,0 +1,3 @@
+{
+    "spa": "index.html"
+}
--- a/test/fixture/spa/css/style.css
+++ b/test/fixture/spa/css/style.css
--- a/test/fixture/spa/spa.html
+++ b/test/fixture/spa/spa.html
@ -1,5 +1,5 @@
 <head>
-  <link rel="stylesheet" href="css/style.css">
+  <link rel="stylesheet" href="/css/style.css">
 </head>
 <h1>Single Page App</h1>
 <h2>Location: <span></span></h2>
--- a/jsdoc2md/README.hbs
+++ b/jsdoc2md/README.hbs
@ -10,13 +10,31 @@ A simple web-server for productive front-end development.
 **Requires node v4.0.0 or higher**.

 ## Synopsis
+Some typical use cases..

-Serve a directory on the default port:
+### Static site
+Fire up your site on the default port:
 ```sh
+$ tree
+.
+├── css
+│   └── style.css
+└── index.html
+
 $ ws
 serving at http://localhost:8000
 ```

+### Single Page Application
+
+Mark `index.html` as an SPA with client-side routing.
+```sh
+$ ws --spa index.html
+```
+
+With this option, routes with existing files (e.g. `/css/style.css`) will be served normally as static assets. Routes without an existing file (e.g. `/user/1`, `/login` etc.) are passed directly to your SPA. Without this option they would 404.
+
+
 Blacklist certain paths, for example config files:
 ```sh
 $ ws --forbid .json .yml
@ -28,11 +46,17 @@ Reduce bandwidth with gzip compression:
 $ ws --compress
 ```

-Specify a Single Page Application:
+When urls don't map to your directory structure, rewrite:
 ```sh
-$ ws --spa index.html
+$ ws --rewrite /css=>/build/css
+```
+
+Rewrite to remote servers:
+```sh
+$ ws --rewrite /api=>http://api.example.com/api /npm=>http://registry.npmjs.com
 ```

+
 ## Install
 Ensure [node.js](http://nodejs.org) is installed first. Linux/Mac users may need to run the following commands with `sudo`.

@ -116,6 +140,9 @@ You can set additional mime-type/extension mappings, or override the defaults by
 }
 ```

+## Use with Google DevTools Workspaces
+
+
 ## Log Visualisation
 Instructions for how to visualise log output using goaccess, logstalgia or gltail [here](https://github.com/75lb/local-web-server/wiki/Log-visualisation).

--- a/test/fixture/spa/.local-web-server.json
+++ b/test/fixture/spa/.local-web-server.json
@ -1,3 +0,0 @@
-{
-    "spa": "spa.html"
-}
--- a/test/fixture/spa/one.html
+++ b/test/fixture/spa/one.html
@ -1 +0,0 @@
-<h1>one</h1>
--- a/test/test.js
+++ b/test/test.js
@ -101,12 +101,12 @@ test('mime', function(t){
  }})
 })

-test('blacklist', function (t) {
+test('forbid', function (t) {
  t.plan(2)
  const app = localWebServer({
    log: { format: 'none' },
    static: { root: __dirname + '/fixture' },
-    blacklist: [ /php$/, /html$/ ]
+    forbid: [ /php$/, /html$/ ]
  })
  const server = launchServer(app, { leaveOpen: true })
  request('http://localhost:8100/something.php')