NodeJS Express Programming

Posted by On 6月 10, 2014 0 Comment

Basic

app.js

app.js is a main code of express.
setting, middleware, route, server, error handling etc…

Start server

Please add following server start code before module

app.listen(app.get('port'), function(){   // app.get('port') : port
  console.log('Express server listening on port ' + app.get('port'));
});

Start node

node app.js

Basic Route

app.js

var express = require('express')
  , routes = require('./routes')
  , user = require('./routes/user');

routes : index.js, user.js

app.get('/', routes.index);
app.get('/users', user.list);

index.js

exports.index = function(req, res){
  res.render('index', { title: 'Express' });
}

exports.index -> ‘/’
And layout is index.jade, pass title parameter as Express

EJS

If you want to use ejs, use following command.

express -e myapp # Use -e option

EJS is HTML like layout. All parameters or codes are between >

Example

<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" />
    <link rel='stylesheet' href='/stylesheets/style.css' />
    <script src="javascripts/jquery/jquery.min.js"></script>
    <script src="javascripts/index.js"></script>
  </head>
  <body>
  <% include header %>
  <div class="container">
  <h3>Hello world!</h3>
  </div>
 <% include footer %>
  </body>
</html>

Form

This is an example of form.

EJS

index.ejs

<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" />
    <link rel='stylesheet' href='/stylesheets/style.css' />
    <script src="javascripts/jquery/jquery.min.js"></script>
  </head>
  <body>
  <div class="container">
      <div class="panel panel-primary pull-right login">
          <div class="panel-heading">
              <h1 class="panel-title">Form Example</h1>
          </div>
          <div class="panel-body">
              <form action="/login" method="post">
                  <input type="text" class="form-control" name="name" placeholder="name"/><br/>
                  <div class="form-group">
                      <input id="submit" type="submit" value="Submit" class="btn btn-primary pull-right"/>
                  </div>
              </form>
          </div>
      </div>
  </div>
  <% include footer %>
  </body>
</html>

Server side get and post

index.js

var express = require('express');

var routes = express.Router();

routes.get('/', function(req, res, next) {
    res.render('index', {title: 'Hello Top'}); // index.ejs
});

routes.post('/', function(req, res, next){
    var name = req.params.name;
    // Do something
});

module.exports = routes;

Parameters

Query style

index?id=12345

req.query.id id query string key

exports.index = function(req, res){
  
  var id = req.query.id;
  var name = req.query.name;
  var msg = 'Hello!';
  if ( id != undefined ) {
	  msg += 'ID=' + id;
  }
  if ( name != undefined ) {
	  msg += ':' + name;
  }
  
  res.render('index', { title: 'Express',
	  		msg: msg});
};

req.query.xxx; Test : http://localhost:3000?id=123&name=taeyeon

URL style

http://localhost:3000/index/1/taro

app.js

app.get('/', routes.index);
app.get('/index', routes.index);
app.get('/index/:id', routes.index); 
app.get('/index/:id/:name', routes.index);

Retrieve parameters

var id = req.params.id;
var name = req.params.name;

http://localhost:3000/index/12345/tayeon

Form

You can use name attr in form
In serverside, you can get paramter as body
In detail, you can see Form

TOPICS