Started guide

expressjs · Jul 13, 2010 · 9e3a0c6 · 9e3a0c6
1 parent 2fda5c7
commit 9e3a0c6
Show file tree

Hide file tree

Showing 7 changed files with 396 additions and 6 deletions.
diff --git a/Makefile b/Makefile
@@ -4,6 +4,7 @@ LIB_PREFIX = ~/.node_libraries
 
 DOCS = docs/index.md \
 	   docs/executable.md \
+	   docs/guide.md \
 	   docs/migrate.md
 
 MANPAGES =$(DOCS:.md=.1)

diff --git a/docs/guide.1 b/docs/guide.1
@@ -0,0 +1,100 @@
+.\" generated with Ronn/v0.6.6
+.\" http://github.com/rtomayko/ronn/
+.
+.TH "GUIDE" "" "July 2010" "" ""
+.
+.SS "Routing"
+Express utilizes the HTTP verbs to provide a meaningful, expressive routing API\. For example we may want to render a user\'s account for the path \fI/user/12\fR, this can be done by defining the route below\.
+.
+.IP "" 4
+.
+.nf
+
+app\.get(\'/user/:id\', function(req, res, params){
+    res\.send(\'user \' + params\.id);
+});
+.
+.fi
+.
+.IP "" 0
+.
+.P
+Alternatively we may want to create, or \fBPOST\fR a user:
+.
+.IP "" 4
+.
+.nf
+
+app\.post(\'/user\', function(){
+    // \.\.\. logic
+});
+.
+.fi
+.
+.IP "" 0
+.
+.P
+A route is simple a string which is compiled to a \fIRegExp\fR internally\. For example when \fI/user/:id\fR is compiled, a simplified version of the regexp may look similar to:
+.
+.IP "" 4
+.
+.nf
+
+\\/user\\/([^\\/]+)\\/?
+.
+.fi
+.
+.IP "" 0
+.
+.P
+Literal regular expressions may also be passed for complex uses:
+.
+.IP "" 4
+.
+.nf
+
+app\.get(/^\\/foo(bar)?$/, function(){});
+.
+.fi
+.
+.IP "" 0
+.
+.P
+Below are some route examples, and the associated paths that they may consume:
+.
+.IP "" 4
+.
+.nf
+
+ \"/user/:id\"
+ /user/12
+
+ \"/users/:id?\"
+ /users/5
+ /users
+
+ \"/files/*\"
+ /files/jquery\.js
+ /files/javascripts/jquery\.js
+
+ \"/file/*\.*\"
+ /files/jquery\.js
+ /files/javascripts/jquery\.js
+
+ \"/user/:id/:operation?\"
+ /user/1
+ /user/1/edit
+
+ \"/products\.:format\"
+ /products\.json
+ /products\.xml
+
+ \"/products\.:format?\"
+ /products\.json
+ /products\.xml
+ /products
+.
+.fi
+.
+.IP "" 0
+
diff --git a/docs/guide.html b/docs/guide.html
@@ -0,0 +1,229 @@
+<html>
+	<head>
+		<title>Express - node web framework</title>
+		<style>
+		    #header {
+				position: absolute;
+				top: 10px;
+				left: 0;
+		        padding: 12px 0;
+				text-indent: 40px;
+				width: 100%;
+		        border-top: 1px solid rgba(0,0,0,0.7);
+		        border-bottom: 1px solid rgba(0,0,0,0.7);
+		        background: rgba(255,255,255,0.1) url(http://www.sencha.com/favicon.ico) no-repeat 15px 50%;
+				text-align: left;
+				color: #fff;
+		    }
+			#tagline {
+			  margin-left: 75px;
+			  margin-bottom: 30px;
+			  color: rgba(255,255,255,0.7); }
+			html {
+			  background: #1c1c1c url(images/bg.tile.jpg); }
+
+			body {
+			  margin: 0;
+			  padding-bottom: 30px;
+			  font: 14px/1.4 "Helvetica Neue", "Lucida Grande", "Arial";
+			  font-size: 14px;
+			  line-height: 1.5;
+			  -webkit-text-stroke: 1px rgba(0, 0, 0, 0.1);
+			  -moz-text-stroke: 1px rgba(0, 0, 0, 0.1);
+			  background: url(images/bg.jpg) 50% 0 no-repeat;
+			  color: #8b8b8b; }
+
+			* {
+			  outline: none; }
+
+			em {
+			  color: white; }
+
+			a img {
+			  border: none !important; }
+
+			a {
+			  font-weight: bold;
+			  color: white;
+			  -webkit-transition-property: opacity, -webkit-transform, color, background-color, padding, -webkit-box-shadow;
+			  -webkit-transition-duration: 0.15s;
+			  -webkit-transition-timing-function: ease-out; }
+			  a:hover {
+			    opacity: 0.8; }
+
+			h1, h2, h3 {
+			  margin: 45px 0 0 0;
+			  color: white;
+			  text-shadow: 1px 2px 2px rgba(0,0,0,0.6); }
+
+			h3 {
+			  margin-left: 20px;
+			  font-size: 18px; }
+
+			pre {
+			  margin: 20px 10px;
+			  padding: 25px 20px;
+			  background: rgba(0,0,0,0.5);
+			  border: 1px solid #323232;
+			  -webkit-box-shadow: 1px 2px 2px rgba(0,0,0,0.6);
+			  -moz-box-shadow: 1px 2px 2px rgba(0,0,0,0.6);
+			  -webkit-border-radius: 5px;
+			  -moz-border-radius: 5px; }
+
+			code {
+			  font-family: "Helvetica Neue", "Lucida Grande", "Arial"; }
+
+			ul {
+			  margin: 15px 0;
+			  padding: 0 0 0 35px; }
+			  ul li {
+			    margin: 0;
+			    padding: 2px 0;
+			    list-style: square; }
+
+			.sect {
+			  margin-left: 40px; }
+
+			#logo {
+			  display: block;
+			  margin-left: 30%;
+			  margin-bottom: 30px;
+			  width: 194px;
+			  height: 51px;
+			  background: url(images/logo.png) 0 0 no-repeat;
+			  text-indent: -99999px; }
+			  #logo:hover {
+			    opacity: 0.7; }
+			  #logo:active {
+			    opacity: 0.3; }
+
+			#ribbon {
+			  position: fixed;
+			  top: 0;
+			  right: 0;
+			  z-index: 2; }
+
+			#wrapper {
+			  width: 100%;
+			  min-height: 800px;
+			  background: url(images/top.png) 0 0 repeat-x; }
+
+			#container {
+			  margin: 0 auto;
+			  padding-top: 110px;
+			  width: 550px; }
+
+			#menu {
+			  margin-left: 130px;
+			  padding: 0;
+			  padding-bottom: 30px; }
+			  #menu li {
+			    display: inline;
+			    list-style: none; }
+			    #menu li a {
+			      display: block;
+			      float: left;
+			      margin: 0 2px;
+			      padding: 3px 15px;
+			      background: rgba(0,0,0,0.2);
+			      -webkit-border-radius: 8px;
+			      -moz-border-radius: 8px;
+			      -webkit-box-shadow: 1px 2px 2px rgba(0,0,0,0.6);
+			      -moz-box-shadow: 1px 2px 2px rgba(0,0,0,0.6);
+			      -webkit-transition-property: opacity, -webkit-transform, color, background-color, padding, -webkit-box-shadow;
+			      -webkit-transition-duration: 0.15s;
+			      -webkit-transition-timing-function: ease-out; }
+			      #menu li a:hover,
+			      #menu li a.active {
+			        padding: 3px 20px;
+			        background: rgba(0,0,0,0.5); }
+			      #menu li a:active {
+			        background: rgba(0,0,0,0.1);
+			        -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.4);
+			        -moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.4); }
+		</style>
+	</head>
+	<body>
+		<a href='http://github.com/visionmedia/express'> 
+		  <img alt='Fork me on GitHub' id='ribbon' src='http://s3.amazonaws.com/github/ribbons/forkme_right_white_ffffff.png' /> 
+		</a>
+		<div id="header"><strong>Sencha</strong> labs</div>
+		<div id="wrapper">
+			<div id="container">
+				<a href='http://github.com/visionmedia/express' id='logo'>Express</a> 
+				<p id="tagline">
+				   High performance, high class web development for
+				  <a href="http://nodejs.org">Node.js</a>
+				</p>
+				<ul id="menu">
+					<li><a href="index.html">Home</a></li>
+					<li><a href="guide.html">Guide</a></li>
+					<li><a href="migrate.html">1.x Migration</a></li>
+				</ul>
+<div class='mp'>
+<h3 id="Routing">Routing</h3>
+
+<p>Express utilizes the HTTP verbs to provide a meaningful, expressive routing API.
+For example we may want to render a user's account for the path <em>/user/12</em>, this
+can be done by defining the route below.</p>
+
+<pre><code>app.get('/user/:id', function(req, res, params){
+    res.send('user ' + params.id);
+});
+</code></pre>
+
+<p>Alternatively we may want to create, or <strong>POST</strong> a user:</p>
+
+<pre><code>app.post('/user', function(){
+    // ... logic
+});
+</code></pre>
+
+<p>A route is simple a string which is compiled to a <em>RegExp</em> internally. For example
+when <em>/user/:id</em> is compiled, a simplified version of the regexp may look similar to:</p>
+
+<pre><code>\/user\/([^\/]+)\/?
+</code></pre>
+
+<p>Literal regular expressions may also be passed for complex uses:</p>
+
+<pre><code>app.get(/^\/foo(bar)?$/, function(){});
+</code></pre>
+
+<p>Below are some route examples, and the associated paths that they
+may consume:</p>
+
+<pre><code> "/user/:id"
+ /user/12
+
+ "/users/:id?"
+ /users/5
+ /users
+
+ "/files/*"
+ /files/jquery.js
+ /files/javascripts/jquery.js
+
+ "/file/*.*"
+ /files/jquery.js
+ /files/javascripts/jquery.js
+
+ "/user/:id/:operation?"
+ /user/1
+ /user/1/edit
+
+ "/products.:format"
+ /products.json
+ /products.xml
+
+ "/products.:format?"
+ /products.json
+ /products.xml
+ /products
+</code></pre>
+
+</div>
+			</div>
+		</div>
+	</body>
+</html>
diff --git a/docs/guide.md b/docs/guide.md
@@ -0,0 +1,56 @@
+
+### Routing
+
+Express utilizes the HTTP verbs to provide a meaningful, expressive routing API.
+For example we may want to render a user's account for the path _/user/12_, this
+can be done by defining the route below. 
+
+    app.get('/user/:id', function(req, res, params){
+		res.send('user ' + params.id);
+	});
+
+Alternatively we may want to create, or **POST** a user:
+
+	app.post('/user', function(){
+		// ... logic
+	});
+
+A route is simple a string which is compiled to a _RegExp_ internally. For example
+when _/user/:id_ is compiled, a simplified version of the regexp may look similar to:
+
+    \/user\/([^\/]+)\/?
+
+Literal regular expressions may also be passed for complex uses:
+
+	app.get(/^\/foo(bar)?$/, function(){});
+
+Below are some route examples, and the associated paths that they
+may consume:
+
+     "/user/:id"
+     /user/12
+
+     "/users/:id?"
+     /users/5
+     /users
+
+     "/files/*"
+     /files/jquery.js
+     /files/javascripts/jquery.js
+
+     "/file/*.*"
+	 /files/jquery.js
+	 /files/javascripts/jquery.js
+
+	 "/user/:id/:operation?"
+	 /user/1
+	 /user/1/edit
+
+	 "/products.:format"
+	 /products.json
+	 /products.xml
+
+	 "/products.:format?"
+	 /products.json
+	 /products.xml
+	 /products