Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Intro to Node Web Apps

Intro to Node Web Apps

An introduction to building Web Applications in Node.js

Thanos Polychronakis

June 12, 2014

More Decks by Thanos Polychronakis

Other Decks in Programming


  1. #SKGNode Why Node? • Asynchronous • Robust • Blazingly FAST

    • Javascript / Browserify • Largest growth year over year • Largest frontend tool belt
  2. #SKGNode Quick Start var express = require('express'); var app =

    express(); app.get('/', function(req, res){ res.send('Hello World'); }); app.listen(3000);
  3. #SKGNode The Request Object • Instantiates per request • Carries

    all request information ◦ Headers ▪ Cookies ◦ Request route ◦ Parameters (/user/:id), Body, Query • Propagates Information (i.e. session, auth)
  4. #SKGNode The Response Object • Instantiates per request • Carries

    all respond methods • Can be build iteratively (CORS, HTTP Code) • Can terminate a Request ◦ .render(), .send(), .end() ◦ No ‘next()’ invocation is required
  5. #SKGNode The Flow Control next() • Express depends on Middleware

    arity • If omitted the middleware is Synchronous • If truthy value is passed fails the request ◦ next(‘no go’); • Invoke once -and only once- to go to next • If middleware is Terminal do not include it (i.e. final controller call that renders)
  6. #SKGNode The final route will never be reached! app.use(express.static(__dirname +

    '/public')); app.use(logger()); app.use(function(req, res){ res.send('Hello'); }); app.get(‘/’, function(req, res){ res.send('World'); }); Sequence MATTERS Static assets will get served without generating a Log
  7. #SKGNode Augmenting the Request app.use(function(req, res, next) { redis.get(req.cookies.id, function(err,

    result) { if (err) { // bail out next(err); return; } req.user = result; // augmentation next(); }); });
  8. #SKGNode // Protect an auth only route app.get(‘/profile’, function(req, res,

    next) { if (!req.user) { res.status(401).send(‘No go dude’); return; // .send() is a terminal action // no need to call next }); next(); // Client is authed, go on... }); Leveraging Augmentation
  9. #SKGNode Express maintained Middleware • body-parser • compression • cookie-parser

    • csurf (CSRF) • errorhandler • express-session https://github.com/senchalabs/connect#middleware
  10. #SKGNode HTTP Verbs • app.use(fn) Catches all! • app.all(route, fn)

    Catches all! • app.get(route, fn) • app.put(route, fn) • app.post(route, fn) • app.delete(route, fn) • app.head(route, fn)
  11. #SKGNode Routing Options RegEx /^\/commits\/ (\w+)/ “/commits/sdjeo34” → req.params[0] ===

    ‘sdjeo34’ Plain String ‘/’ Triggers on “/”, “/?id=12”, etc Parametric String ‘/user/:id’ Triggers on “/user/thanpolas” → req.params.id === ‘thanpolas’ Multi Parametric String ‘/user/:network/:id’ Triggers on “/user/skgNode/thanpolas” → req.params.network Catch All ‘/api/*’ Catches all routes under “/api/”
  12. #SKGNode Routing Best Practices • Routing is where the buck

    stops at • Decouple your routes from your core app • Study the app.route() pattern • At the end, there can only be a 404
  13. #SKGNode Defining Paths & Engine app.set('views', path.join(__dirname, 'views')); app.set('view engine',

    'jade'); Check out all available template engines: https://github.com/visionmedia/express/wiki#template-engines
  14. #SKGNode Rendering a View /* GET home page. */ router.get('/',

    function(req, res) { // no next required res.render('index', { title: ‘SKGNode’ }); }); extends layout block content h1= title p Welcome to #{title}