Single Page Apps

with

Node + Express + React

Node

Node JS Allows you to run JavaScript outside of the browser

console.log('Hello world!')
$ node index.js
Hello world!

Express

Express is a bare-bones web application framework

var express = require('express')
var app = express()

app.get('/', function (req, res) {
    res.send('Wazzup?')
})

app.listen(3000, function () {
    console.log('Example app listening on port 3000!')
})
$ node .
Example app listening on port 3000!

Express allows you to set routes

app.get('/hey', function (req, res) {
    res.send('Hey Yourself!')
})

You can also use postman to test routes

getpostman.com

Express can also receive information

var body_parser = require('body-parser')

app.use(body_parser.urlencoded({extended: false}))
app.use(body_parser.json())
app.post('/send-info', function (req, res) {
    res.json({
        message: req.body.info ? `info was ${req.body.info}` : 'No info!'
    })
})

JSON

JSON is a data format based on JavaScript objects

{
    "Key": "value",
    "another_key": "Another value",
    "numbers": [1, 2, 3, 4],
    "collection": [
        {
            "key": "value",
            "some_other_key": "some other value"
        },
        {
            "key": "potatoes",
            "some_other_key": "bananas"
        }
    ]
}

MongoDB

User accounts

with

JSON web tokens

Browserify + Babelify

React

SPA's with Node + Express + React

By Steve Smith

SPA's with Node + Express + React

Learn how to build full-stack JavaScript single-page-applications with Node, Express, and React

  • 515