Logo

Video: ExpressJS (Bulgarian)

  • December 05, 2023
  • Nikolay Kostov (Nikolay.IT)

In my lecture on creating web applications with ExpressJS, I began by exploring Connect for NodeJS, emphasizing its role as the backbone for middleware in web applications. We then dove into ExpressJS, covering its architecture, routing, and integration with NodeJS modules, complemented by practical demonstrations. The session progressed to discussing views and layouts, where I showcased how to use template engines for dynamic content rendering. A significant focus was on 'Working with Data', where I demonstrated handling different data forms and performing CRUD operations. The lecture concluded by addressing common and advanced scenarios in ExpressJS, including cookies, sessions and authentication, ensuring the attendees gained a comprehensive understanding of ExpressJS in practical web application development.

Topics covered:

  • Connect for NodeJS
  • ExpressJS
  • Views and layout
  • Working with Data
  • Common and Advanced Scenarios

Video (in Bulgarian)

Presentation Content

node.js

  • Event-Driven, Asynchronous IO, Server-Side JavaScript library in C
  • Open Source
  • Available on
    • Windows
      • Service
      • Under IIS (iisnode)
    • *nix systems
  • As a service
    • Azure
    • Heroku

NodeJS Web Server

  • Basic server implementation
var http = require('http');

http.createServer(function(req, res) {
    res.writeHead(200, {
        'Content-Type': 'text/plain'
    }); //return success header

    res.write('My server is running! ^_^'); //response
    res.end(); //finish processing current request
}).listen(1234);

Connect for NodeJS

$ npm install connect

var connect = require('connect');

var app = connect()
  .use(connect.logger('dev'))
  .use(connect.static('public'))
  .use(function(req, res){
    res.end('hello world\n');
  })

http.createServer(app).listen(3000);

Connect for NodeJS – Example

  • Custom middleware function for connect
var connect = require('connect'),
    util = require('util');

var interceptorFunction = function(request, response, next) {
    console.log(util.format('Request for %s with method %s', request.url, request.method));
    next();
};

var app = connect()
    // .use('/log', interceptorFunction)
    .use(interceptorFunction)
    .use(function onRequest(request, response) {
        response.end('Hello from Connect!');
    }).listen(3001);

Express.js

  • Built on top of Connect Middleware
  • Adds functionality to Connect
    • Request / Response enhancements
    • Routing
    • View Support
    • HTML Helpers
    • Content Negotiation
  • Exposes Connect Middleware

First Express App

var express = require('express');

var app = express();

app.get('/', function (request, response) {
    response.send('Welcome to Express!');
});

app.get('/customer/:id', function (req, res) {    res.send('Customer requested is ' + req.params['id']);
});

app.listen(3000);

Demo: Creating Express Applications

  • Simple ExpressJS application and “nodemon”
  • Create routes and require() them
  • Pass parameters
  • Configure and middleware

Views in ExpressJS

  • User Interface
  • Based on Templates
  • Support for multiple View Engines
    • Jade, EJS, JSHtml, . . .
  • Default is Jade 
app.get('/', function (req, res) {
    res.render('index');
});

Views in ExpressJS – Example

var express = require('express'),
    path = require('path');
var app = express();
app.configure(function () {
    app.set('views', __dirname + '/views');
    app.set('view engine', 'jade');
    app.use(express.static(path.join(__dirname, 'public')));
});
app.get('/', function (req, res) {
    res.render('empty');
});
app.listen(3000);

doctype
html(lang="en")
  head
    title Welcome to this emtpy page
  body

Demo: Views in ExpressJS

  • Show simple views in ExpressJS
  • Jade syntax examples
  • Layouts and blocks
  • Stylus

Working with Data

  • Pass data to the views 
    res.render('index', { title: 'Customer List' });
  • Read data from the views (bodyParser) 
    res.render('index', { title: 'Customer List' });
  • Read and send files 
    var filePath = req.files.picture.path;
// ...
res.download(filePath);
res.sendfile(filePath);
  • Data for all views 
    app.locals.clock = { datetime: new Date().toUTCString()};

Demo: Working with data

  • Pass data to views (customer.index)
  • Submit data from views (customer.create)
  • Content negotiation (customer.details)
  • Upload files (customer.create)
  • Helpers (app.locals)

Demo: Advanced Scenarios

  • Cookies
  • Sessions
  • Custom middleware
  • Authentication and authorization

Next Steps

  • Express.js Samples
  • Database Support
    • MS SQL
    • CouchDB
    • PostgreSQL
    • Redis
  • Socket.io
    • Real-time support
  • Search on npm.org before you re-invent the wheel
  • Express is Lightweight Framework and Fast to work with
  • Testing is not optional
    • Mocha
  • JavaScript can get messy

Share