Vous êtes sur la page 1sur 115

Enroll Tutorials Courses Forums  More 

HTML/CSS JavaScript Angular React Node PHP Laravel
HTML/CSS JavaScript Angular React Node PHP Laravel

Login / Reg

The Scotch.


Scotch.io


School

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com

kylo-ren@hoth-topic.com
expressJS javascript node.js
Get Scotch in y

Getting Started with Node,
Express and Postgres Using  

Sequelize
Twitter Facebook


Using a relational database with Node is easy when RSS
using
Sequelize.

Dec 06, 2016 Tutorials 16 Comments 10,730 

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com

MEAN
FREE COURSE Machine
BUILD YOUR FIRST NODE.JS WEBSITE

Node is a powerful tool to get JavaScript on the server.
Use Node to build a great website.

Get Started
Scotch
Box

Update (January 03, 2017): This post has been updated to fix an oversight when
querying the database for todo-items to either update or delete in
server/controllers/todoitems.js . Formerly, we were only using the particular
Panels
todoitem's id , instead of both it's own id and the id of it's parent todo. In the
comments, some avid readers have pointed out the err in that logic and this update
aims to fix that.

The Pub


open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com

Pretty much like Michael Herman's. I've decided to write a blog post about getting started with these technologies.com . It wasn't an  easy journey as I could not find any decent beginner materials on this topic. needed to learn how to write JavaScript web applications using Express. update and delete them from a database. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. a few months ago. By the end of this tutorial. Write for Us I ended up settling on Michael Herman's blog post on this topic and Sequelize docs. we will have created an API for a todo list application that will enable us to create multiple todos. NodeJS and PostgreSQL as my database.  Advertise I remember when I. in that we're going to be using PostgreSQL and Sequelize as the ORM of choice to write a minimalistic Todo list application. update the list items and delete them. By working through an application in which we implement functionality to add things. add list items to those todos. So. this tutorial will serve as an introduction to writing more advanced CRUD applications.

# Before we begin. that we're going to be building our Todo list application on. so that we'll have access to most of the new features introduced in ES6.As per their website.com .0 at the time of writing. minimalist web framework for Node. Express .We're going to use this to run JavaScript code on the server. I've decided to use the latest version of Node.. unopinionated.. Unfortunately. Express is a "Fast. Let's take a moment to review the tools we're going to be using: NodeJS . details on how to install and configure PostgreSQL on your particular system fall beyond the scope open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.3.js". PostgreSQL .This is a powerful open-source database that we're going to use to store our Todos. v6.

However. which is a database ORM that will interface with the Postgres database for us.In addition.io ( Part I .t. this should be more than enough. This tutorial assumes at least some prior knowledge of the JavaScript language. changing directories. I found it's pretty easy to get started with. Postman . we're going to use Sequelize. We're also assuming that you're at least comfortable working on the command line (creating folders. files. you can opt for a version of PostgreSQL hosted online. Part III ) to familiarize yourself with the new ES6 syntax.A Chrome app that we'll use to practically test our API. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. However. configure PostgreSQL on your particular system fall beyond the scope of this tutorial. we're going to be leveraging some of the latest JavaScript features and it's recommended that you go through these tutorials from scotch. the free version will only give you a 20MB allowance. Sequelize .c). In addition.com . e. Taking into consideration the pretty small size of the application we're building. or you don't want to dive into installing it. I recommend ElephantSQL. if you face issues while installing PostgreSQL. Part II .

log('Hello world!').com . } } while shell commands will look like this: open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. Code blocks will look like this: JAVASCRIPT function helloWorld(name) { if (name) { console.log(`Hello ${name}. and welcome to the world of co } else { console.

BASH $ echo "This is awesome!" When you encounter shell commands. what you'll be expected to type in will be everything except the leading $ ... Alright. This leading $ is called a shell prompt. it means that's a code snippet which should be taken into context with the surrounding code in that file. When you encounter any piece of code wrapped with ellipses ( . let's get to it! :) open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com . This is used to save on space and reduce redundancy. ). and may be different depending on the terminal you're working in.

com . we're going to be creating one from scratch. While we could use express-generator to scaffold the project structure for us.server} open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. Run the following commands. BASH $ mkdir -p postgres-express-react-node-tutorial/{bin.  # Project Setup Let's begin by setting up our workspace.

with the help of npm . That done. All of the code necessary to create our server-side application will go into the server folder. Run: BASH open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. which should have come bundled with your NodeJS install. we're going to initialize a NodeJS application.com . All subsequent commands will assume that you're in the top-level postgres-express- react-node-tutorial folder. $ cd postgres-express-react-node-tutorial We're leveraging shell expansion to create three directories. a top level postgres- express-react-node-tutorial directory containing bin and server .

Omit the -y if you want more control over this config. Your project structure should now look like: BASH postgres-express-react-node-tutorial ├── bin ├── package.com .json └── server open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. $ npm init -y This will create a package.json file with some sensible default config.

 # Express Setup Install Express and a few of it's dependencies. BASH $ npm install --save express body-parser morgan open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com .

Create a file in the root folder and call it app.json file.com . The --save flag will save these packages to the dependencies section of your package. You could save some typing by running the above command as BASH $ npm i -S express body-parser morgan i is an alias for install while -S is an alias for --save . BASH open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.js .

const bodyParser = require('body-parser'). open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. const logger = require('morgan').com . let's create our Express application. // Set up the express app const app = express().js In this file. JAVASCRIPT const express = require('express'). $ touch app.

Inside the bin folder. // Setup a default catch-all route that sends back a welcome messa app. app. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. app. create a file and call it www . // Parse incoming requests data (https://github.get('*'. (req.use(bodyParser.json()).com/expressjs/body app.'.use(logger('dev')). res) => res.exports = app.use(bodyParser.urlencoded({ extended: false })).status(200). })).send({ message: 'Welcome to the beginning of nothingness. // Log requests to the console.com . module.

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. const app = require('.env../app').com . BASH $ touch bin/www Put the following code inside bin/www JAVASCRIPT // This will be our application entry. 10) || 8000.PORT. We'll setup our server here const http = require('http'). // The express app we just created const port = parseInt(process.

listen(port). we'll need a way to restart the server every time we change something in our code. BASH $ npm i -D nodemon open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.set('port'.createServer(app). With that in place. For that.com . server. we'll use the excellent nodemon npm package. port). app. const server = http.

/bin/www". Then. Now try running the application by executing open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. Edit your package.com . That command will be created under the scripts section.. open up your package... "test": "echo \"Error: no test specified\" && exit 1" }.. .json in the scripts section as follows: JSON .json file and create a command to run the server. "scripts": { "start:dev": "nodemon .

com . You should see {"message":"Welcome to the beginning of nothingness. your project structure should look like: BASH open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd."} At this point in time. BASH $ npm run start:dev and visiting http://localhost:8000 .

js ├── bin │ └── www ├── package. # Sequelize Setup For this part.json └── server For comparison. postgres-express-react-node-tutorial ├── app.com . you can find the code for this section here. we are going to require a working PostgreSQL installation. There are open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

com . This is an ORM that will interface with the Postgres database for us. we are going to require Sequelize. Let's begin by installing Sequelize CLI package. Next. It will also help us generate database migrations. lots of resources on the web on how to install and configure Postgres. BASH $ npm install -g sequelize-cli open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. We are going to be making use of the Sequelize CLI package to bootstrap the project for us. so I will not concentrate on that. Feel free to go through it's documentation to get a feel of it.

You can install the sequelize-cli package in your project locally by using -D

(equivalent to using --save-dev ) instead of the -g ( --global ) flag. The downside
of doing this will be that you'll need to prefix every call to the sequelize command
with ./node_modules/.bin .

Next, we need to configure Sequelize for our project. For that, we will create a
.sequelizerc file in our project's root folder. In this file, we are going to be
specifying the paths to files required by Sequelize. Put the following content into this
file:

JAVASCRIPT

const path = require('path');

module.exports = {
"config": path.resolve('./server/config', 'config.json'),
open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com

"models-path": path.resolve('./server/models'),
"seeders-path": path.resolve('./server/seeders'),
"migrations-path": path.resolve('./server/migrations')
};

The config.json file contain our application configuration settings, such as database
authentication configuration. migrations folder will hold our application's migrations,
while the models folder will hold the application models. Seed data is initial data
provided with a system for testing, training or templating purposes. The seeders

folder typically holds seed data, but we're not going to be using that in this tutorial.

At this point, we are going to need to install the actual Sequelize package, alongside
its dependencies.

BASH
open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com

$ npm install --save sequelize pg pg-hstore

pg will be responsible for creating the database connection while pg-hstore is a
module for serializing and deserializing JSON data into the Postgres hstore format.

Now, with the paths defined, we will need to run the init command in order to
create the specified folders and generate boilerplate code.

BASH

$ sequelize init

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com

com .json open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.js ├── bin │ └── www ├── package. you will realize that the above command just created the directories and generated the boilerplate code.json └── server ├── config │ └── config. If you inspect your directory right now. Your directory structure should now look like this. BASH postgres-express-react-node-tutorial ├── app.

js file that was autogenerated.js └── seeders Let's consider. var fs = require('fs').com . the server/models/index. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. for example. JAVASCRIPT 'use strict'. var path = require('path'). ├── migrations ├── models │ └── index.

json')[env var db = {}. var env = process. var config = require(__dirname + '/.filename)..readdirSync(__dirname) .com ./config/config.filter(function(file) { return (file. file)).env. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. if (config. } fs . var basename = path.use_env_variable) { var sequelize = new Sequelize(process.indexOf('.join(__dirname.NODE_ENV || 'development'.username. config.forEach(function(file) { var model = sequelize['import'](path.basename(module.database.env[config.') !== 0) && (file !== basename) && (fi }) .use_env_variabl } else { var sequelize = new Sequelize(config. var Sequelize = require('sequelize').

Sequelize = Sequelize.forEach(function(modelName) { if (db[modelName].associate(db). } }). }). we're reading the configuration specific to our current Node environment. Then. If we don't have a Node open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. db.exports = db.com .name] = model. we are requiring the modules we're going to be using.sequelize = sequelize. module. db.associate) { db[modelName].keys(db). In this file. db[model. Object.

you can learn more about it from this awesome Scotch. Then. JAVASCRIPT const fs = require('fs').JS Since the generated server/models/index.com . adding them to the db object and applying relationships between the models.js file is in ES5 syntax. we're defaulting to development . REFACTORING SERVER/MODELS/INDEX. after which we read our models folder. Part II . Part III . const path = require('path'). we are going to refactor it to ES6 syntax. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. If you are not familiar with ES6 syntax. we are establishing a connection with our database. if such relationships exist. environment defined. discovering and importing any and all the models in it.io tutorial series: Part I .

readdirSync(__dirname) . const Sequelize = require('sequelize'). let sequelize.database.indexOf('.') !== 0) && open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd..env.NODE_ENV || 'development'.filename).password.use_env_variable]) } else { sequelize = new Sequelize( config.use_env_variable) { sequelize = new Sequelize(process.json`)[env] const db = {}. const basename = path. config.com . const env = process.filter(file => (file. const config = require(`${__dirname}/. } fs . if (config.basename(module.username./config/config. config ). config.env[config.

forEach(file => { const model = sequelize. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. module.exports = db.sequelize = sequelize. Object.join(__dirname.Sequelize = Sequelize. db[model.name] = model. file)).forEach(modelName => { if (db[modelName].associate) { db[modelName]. db.associate(db).slice(-3) === '.com . }).keys(db). } }).js')) . (file !== basename) && (file.import(path. db.

BASH $ createdb todos-dev createdb command will be available to us after installing PostgreSQL.json file to reflect our various environments settings. With the application bootstrapped. First. we need to create a development database. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. the only thing that we still have to do is creating our database then updating the config.com .

so I'm just going to leave that field null . we need to update our config to use the db we just created. Then. Assuming we're using ElephantSQL. A QUICK NOTE If we opted to use a Postgres database hosted online. We are going to need this URL in the configuration below. We then copy the URL provided in the details.com . we replace username with our username and password with our database's password. In my case. Remember to change the dialect to postgres . notice I didn't create any password for my db. we'll need to go to the ElephantSQL dashboard and click on details to view the details of our free database instance. we will need the database url provided to us by the database host we chose. If we're using a local database. JSON open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

"host": "127. "password": null.1".0. "dialect": "postgres" } } open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.1". "host": "127. "password": null.0.0.0. "dialect": "postgres" }. { "development": { "username": "waiyaki".com . "port": 5432. "database": "todos-test". "port": 5432. "test": { "username": "waiyaki". "database": "todos-dev".

Since we're only concerned about the development environment because it's all we're going to use. If we're using an online database. Our config will now look like: JSON { "development": { "use_env_variable": "DATABASE_URL" }. "test": { open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. We are going to be exporting the URL we copied earlier into our development environment as DATABASE_URL . we will need to replace the development environment database configuration settings with our database URL. that's what we'll replace.com .

"username": "waiyaki",
"password": null,
"database": "todos-test",
"host": "127.0.0.1",
"port": 5432,
"dialect": "postgres"
}
}

This signals Sequelize to look inside our environment and extract the key whose
name is DATABASE_URL and use that to connect to our DB. The specific logic that
does that is in server/models/index.js , as shown in this snippet:

JAVASCRIPT

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com

...
let sequelize;
if (config.use_env_variable) {
// From the environment, extract the key with the name provided
// and use that to establish a connection to our database.
sequelize = new Sequelize(process.env[config.use_env_variable])
} else {
sequelize = new Sequelize(
config.database, config.username, config.password, config
);
}
...

Finally, we'll need to actually export our database URL into our environment. In our
terminal, let's issue the following command:

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com

BASH

$ export DATABASE_URL=our-database-url

where our-database-url is the URL we copied from ElephantSQL. Every time we
need to run this application, we will need to export the DATABASE_URL first.
Fortunately, there exists dotenv, an npm package that makes automatically exporting
values into our app environment a breeze. It reads key-value pairs stored in a config
file, typically named .env and exports them into our environment. We won't use it in
this application but I recommend you check it out.

We are not actually going to use the test environment in this tutorial. However, I'm
including it here for didactic purposes to show that we can have different databases

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com

such that a Todo can have many TodoItems while a TodoItem can only belong to one Todo . open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. The relationship between a Todo and it's TodoItems is going to be one-to-many. Todo and TodoItem . For purposes of comparison. you can find the code to this section here. Run the following command. for different environments. which is what we'd actually want in a real-world application. we are now ready to generate models. # Generating Models With our configuration in place.com . We are going to have two models.

<date> will be the date the model was generated.js migration file in the server/migrations folder.com . open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. The generated Todo model code is: JAVASCRIPT 'use strict'. BASH $ sequelize model:create --name Todo --attributes title:string This will generate a todo.js file in the server/models folder as well as a <date>- create-todo.

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. DataTypes) { var Todo = sequelize. title . that is a String. return Todo. { classMethods: { associate: function(models) { // associations can be defined here } } }). }. In this file. we are defining our Todo model.STRING }. { title: DataTypes.com .exports = function(sequelize. module.define('Todo'. It's going to have a single attribute.

We are also going to be defining the relationships between our models in the classMethods section of the generated model code. After refactoring. we're going to be editing the generated model fields a little bit to better suit our needs. If you inspect the two generated files.com . editing the model fields and defining the relationships between our models. we arrive at: open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. let's generate our TodoItem model. Before we do that. We're going to refactor them into ES6. BASH $ sequelize model:create --name TodoItem --attributes content:stri In addition to refactoring. you'll realize that they are in ES5. for consistency with the rest of our project.

as: 'todoItems'. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.js JAVASCRIPT module. { title: { type: DataTypes. allowNull: false. server/models/todo. }.define('Todo'.exports = (sequelize.TodoItem. DataTypes) => { const Todo = sequelize. { foreignKey: 'todoId'.hasMany(models. { classMethods: { associate: (models) => { Todo.com .STRING. }.

}).associate method. }. return Todo. Personally. }. }. Notice that we edited the title field and added a not-null constraint. We also defined the relationship between a Todo and it's TodoItems in the classMethods. This means that the database will not allow us to write to it if we don't provide a value for the title field.com . We're going to see how to make that inclusion a little later. I think it looks better this way. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. The as: 'todoItems means that every time we query for a todo and include it's todo items. they'll be included under the key todoItems instead of TodoItems (Sequelize defaults to using the model name). }).

{ classMethods: { open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. }. server/models/todoitem.js JAVASCRIPT module. defaultValue: false.BOOLEAN. allowNull: false. DataTypes) => { const TodoItem = sequelize.com . }.STRING. complete: { type: DataTypes. { content: { type: DataTypes. }.exports = (sequelize.define('TodoItem'.

having a default value means that if we don't provide a value for that field when creating it. }).Todo. Notice that we've edited both the content and complete fields. { foreignKey: 'todoId'. the database is going to use the provided default value for that field.belongsTo(models. We've added a not- null constraint in the content field and a default value for the complete field. }. }. return TodoItem. }. associate: (models) => { TodoItem. onDelete: 'CASCADE'. In addition to that. In general. }).com . we've also defined the relationship between the TodoItems and open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

For consistency.exports = { up: (queryInterface.js JAVASCRIPT module. primaryKey: true. { id: { allowNull: false. the Todo objects. Sequelize) => queryInterface. The onDelete: CASCADE tells Postgres that if we delete a todo. it's associated todo items should be deleted as well (cascade the delete action). we're also refactoring our migration files to ES6 and ending up with: server/migrations/<date>-create-todo. autoIncrement: true. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.createTable('Todos'.com .

}.INTEGER. createdAt: { allowNull: false.DATE. }. updatedAt: { allowNull: false.DATE. type: Sequelize. allowNull: false. }. down: (queryInterface /* . type: Sequelize. title: { type: Sequelize.dropT }.com . }).STRING. type: Sequelize. }. Sequelize */) => queryInterface. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

createTable('TodoItems'. autoIncrement: true.INTEGER. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. type: Sequelize.exports = { up: (queryInterface.js JAVASCRIPT module. Sequelize) => queryInterface.STRING. primaryKey: true. { id: { allowNull: false.com . }. server/migrations/<date>-create-todo-item. content: { type: Sequelize.

allowNull: false. updatedAt: { allowNull: false. type: Sequelize.DATE. onDelete: 'CASCADE'.INTEGER. }. }. defaultValue: false. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. }. complete: { type: Sequelize. references: { model: 'Todos'.com .DATE.BOOLEAN. type: Sequelize. }. todoId: { type: Sequelize. createdAt: { allowNull: false.

Sequelize */) => queryInterface.com .dropTable('TodoItems'). key: 'id'. thus returning the our database to the same state it was in before we performed the migration. If. }. for whatever reason. as: 'todoId'. }. It will take care of creating the table and it's associated columns for us. we needed to rollback (undo) the migration. }. These migrations are a representation of how we want our models to look like in the open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. When we run these migrations. the down function would be executed and it would undo whatever the up function did. }). down: (queryInterface /* . the up function will be executed.

js migration file as well. In addition to that.com . Notice we define the relationship between our models in the create-todo- item. the updatedAt field is automatically updated to reflect the new update time. With the models and migrations in place. we're now ready to persist the models to the database by running the migrations. Sequelize automatically generates the id . To do this. database. The todoId field was not automatically generated and we've had to manually define it. createdAt and updatedAt fields for you. any time a model is saved. If you try open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. we run the following command: BASH $ sequelize db:migrate This will discover the migrations in our migrations folder and execute them.

The todosController will be responsible for creating. it would not execute any migrations since it's clever enough to know that all of the current migrations have been executed. updating and deleting todos. todosController and todoItemsController . We're going to have two controllers. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. you can find the code to this section here. let's move on to creating the controllers. # Creating Controllers and Routing With our models in place. listing. running the same command again. updating and deleting todo items. while the todoItemsController will be responsible for creating.com . For purposes of comparison.

res) { open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.. Inside this file.js file inside server/controllers/ . module. # Creating Todos Create a todo.js JAVASCRIPT const Todo = require('.exports = { create(req.com .Todo. let's add the functionality to create todos./models'). server/controllers/todos.

create({ title: req. for the sake of simplicity. }) . it returns that error instead.status(201). it returns it. The above code snippet creates a new todo and if successful. }. this isn't the best way to handle these errors.)) This create function is designed to be a route handler for whichever Express route we'll choose to attach it to.send(error)).send(todo)) . If it encounters an error. but we'll go with it for now.com . (Granted. }. The res parameter is the response we're preparing to eventually send back to open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.title.then(todo => res.body.catch(error => res. .status(400). return Todo . The req parameter is the incoming request from the client.

We can have a third parameter.com . the client in response to their request :)./todos'). server/controllers/index. where we're going to be exporting our controllers from. conventionally named next . open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. All Express route handlers follow this method signature. which is a function that passes the request on to the next route handler (meaning that a route can be handled by multiple route handlers. We are.js JAVASCRIPT const todos = require('. I find this helpful since it helps me consolidate my imports (require statements) from once central place. in which case it's piped or passed along all of those route handlers). not going to see a use case for that in this application :(. however. Next. we create an index.js file inside server/controllers .

js . add the following code: JAVASCRIPT open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. you might want to split up your routes and place then in different folders.js file. Create a routes folder inside the server folder.com . Next. We are going to place all our routes in this index. }. Inside server/routes/index. in a real- world application. Inside the new routes folder. we need to add an API route that maps to this functionality. create an index.exports = { todos.js file. However. module.

todos. const todosController = require('.com . todosController./controllers').send({ message: 'Welcome to the Todos API!'.get('/api'.create). a welcome route at /api and a route to create todos at /api/todos . we are telling our application to run the todosController. res) => res. (req.status(200). })).post('/api/todos'. }. app. module. If we post some data to /api/todos . extract the posted data and create a todo open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.. When we hit /api . we are instructing our application to send back a JSON object welcoming the user to our life-changing Todos API.create function.exports = (app) => { app. which will take the request object. This will add two new routes.

Open up your app.js JAVASCRIPT const express = require('express'). const app = express().create function is the POST route handler for the /api/todos endpoint. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. const bodyParser = require('body-parser'). Next. In this case. We're going to be adding a require statement right before the route we'd earlier created.js .com . from it.js file now looks like: app. such that our app. we say that the todosController. const logger = require('morgan'). we need to make the application aware that we just added the routes.

get('*'.use(logger('dev')).) catch-all route we'd added earlier.. (req. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.exports = app.'. app.send({ message: 'Welcome to the beginning of nothingness. those other routes will never be hit. res) => res. // Require our routes into the application.json()).status(200). Note that we have to require our routes before the app.urlencoded({ extended: false })). }))./server/routes')(app). app.get('*'.use(bodyParser.. app. This is because the catch-all route will match any route and serve the welcome message. hence if we require our other routes after it.use(bodyParser. app. require('. module. .com .

Next. we open up Postman and issue a POST request to create a new todo item as in the image below.com . open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

you should see the welcome message we specified in our routes." message. Yay! If you make a GET request to /api using either Postman or your browser.com . If you visit any other route that we've not explicitly handled in our routes. Feel free to create a few more todos. you should still see the default "Welcome to the beginning of nothingness. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

status(200). res) { return Todo .all() .js JAVASCRIPT . # Listing todos Next. list(req. server/controllers/todos..com .then(todos => res.send(todos)) open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. we're going to add functionality to list all todos. Add the following code snippet to your todosController after the create method..

we're fetching all todos from our database and sending them back to the user as an array in the response. .catch(error => res.. Next. open up server/routes/index.js JAVASCRIPT open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. .com . }. we send that error object instead. server/routes/index. If we encounter an error while fetching the todos from the database.status(400).js and create a new url that maps a todos GET request to the list method right below the POST route we'd added earlier..send(error)). In this code snippet.

.. app. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. app.create). todosController..com . .. .post('/api/todos'. Open up Postman and try out this new route.list). todosController.get('/api/todos'.

Let's add functionality to create todoitems next. you'll realise that our listed todos do not have any todoitems .com . # Creating todo Items open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. If you inspect the output. after which we'll modify our list method to return todos together with their todoitems .

content.js file inside your controllers directory.com . In this file. res) { return TodoItem .params.todoId. }) . let's add functionality to create a todoitem ./models').exports = { create(req. server/controllers/todoitems.create({ content: req.TodoItem. module.send(todoItem)) open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.. todoId: req.body. Create a todoitems.status(201).js JAVASCRIPT const TodoItem = require('.then(todoItem => res.

/todoitems'). open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.send(error)). }.catch(error => res.com .js JAVASCRIPT const todos = require('. const todoItems = require('. . todoItems.exports = { todos. }./todos').status(400). server/controllers/index. module.

com .js JAVASCRIPT open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. In the above code snippet. we're creating a todoitem and associating it with a particular todo . We are grabbing the id of that particular todo from the request params. We are also adding the todoItems controller to our default exports. Let's set up the route for creating a new todoitem and see how the todoId is specified. }.exports . Notice that we're using the ES6 object shorthand notation to add the methods to module. Open up your routes file and add the following route: server/routes/index.

params object as todoId and is the same one we're accessing in our controller. Do not forget to require todoItems controller as todoItemsController at the top of your routes file..com . todoItemsController. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. app.. we can go ahead and try it out in Postman.post('/api/todos/:todoId/items'..create). With this new route in place. . .. The :todoId in the route is made available to us by Express in the request.

com .open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

com .list code so that it returns a todo together with it's associated items. list(req.. # Listing todo-items inside todos Now that we can create todo items. let's modify our todosController. res) { return Todo .. server/controllers/todos.js JAVASCRIPT .findAll({ open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

as we did when defining the relationship in the Todo model. Remember to require the TodoItem model at the top of your server/controllers/todos. In the above code snippet.com .send(todos)) .. we find all todos and include all associated todoitems from the TodoItem model. as: 'todoItems'.js file. }.status(400). .then(todos => res.send(error)). We include them as todoItems .catch(error => res.status(200). }) . include: [{ model: TodoItem. }].. We can view the results by making a GET request to /api/todos in Postman: open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

com .open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

# Retrieving a single todo Next.com .js server/controllers/todos. Let's add the following code inside server/controllers/todos.js JAVASCRIPT open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. we're going to add functionality to retrieve one todo based on it's id.

res) { return Todo .status(200). retrieve(req. .send({ message: 'Todo Not Found'.. }) .params. }].todoId.findById(req. { include: [{ model: TodoItem.send(todo).then(todo => { if (!todo) { return res. as: 'todoItems'.com .status(404). }).. }) open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. } return res.

. If it doesn't. we're finding the todo whose id matches the todoId we get from the request parameters and we're also including it's associated todo items. we're sending back an error message letting the user know we didn't find the specified todo.com . . If we encounter an error when processing this request. If such a todo exists.js open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.. we're sending back the error object. we're sending it back in the response.. Then add a new route that maps to the retrieve view: server/routes/index.status(400). In the code snippet above.catch(error => res.send(error)). }.

If you make a GET request to /api/todos/1 using Postman.. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.. JAVASCRIPT . you should see the todo with id 1. with it's todo-items included in an array as well. . app.get('/api/todos/:todoId'.retrieve).com . todosController...

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com .

com . open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. res) { return Todo . as: 'todoItems'..params.todoId. { include: [{ model: TodoItem.findById(req. update(req..js JAVASCRIPT . # Updating a single todo Let's now add functionality to update a single todo: server/controllers/todos.

title || todo.then(todo => { if (!todo) { return res.status(404).send(todo)) // Send back the .. }) .status(400). }). }]. }. }) .send(error)).update({ title: req. .catch((error) => res. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.title..send(error)).status(200).com .catch((error) => res. } return todo .send({ message: 'Todo Not Found'.body.then(() => res. }) .status(400).

todosController.put('/api/todos/:todoId'.. If no title was provided. .js JAVASCRIPT .update). We also need to add a new route that maps to the update method: server/routes/index... we're finding the todo whose id matches the todoId supplied in the request params. We are then updating it's title. In the code snippet above. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. app.com . we're defaulting to the title the todo already had..

You can issue a PUT request using Postman to practically test this route: open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com .

com .js open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. # Deleting todos Finally. let's add functionality to delete todos: server/controllers/todos.

} return todo .params.then(todo => { if (!todo) { return res.. JAVASCRIPT . destroy(req.send()) .catch(error => res.send({ message: 'Todo Not Found'.destroy() .then(() => res.send(error)).status(400). }).todoId) ..status(204).com .findById(req. res) { return Todo . }) open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.status(400).

com . This is because we specified the onDelete action as CASCADE when we were setting up our models. except we're not including the todo items. This code is almost the same as the one we had for updating a todo. .send(error)).status(400).. Remember that when you delete a todo. .js JAVASCRIPT open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.catch(error => res. }.. Then add the corresponding route: server/routes/index. it's corresponding todo items are deleted as well.

. return todo ..destroy). If you try this out in Postman.com .. ..destroy() open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. you might be surprised that you don't get any data back.delete('/api/todos/:todoId'.. app. .. You can modify the delete code to return a 200 status code and a delete successful message as shown in the code snippet below: JAVASCRIPT . todosController.

.status(200). # Updating and Deleting Todo Items Having gone through updating and deleting todos. . we're going to do it all in one go.catch(error => res.status(400). open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd..send(error))..then(() => res. I prefer returning 204 No Content . it'll be a breeze going through updating and deleting todo items since the code is very similar.com . As such. Personally.send({ message: 'Todo deleted succ .

Add the following code to your todoItemsController .js JAVASCRIPT . todoId: req.todoId.params..com .. update(req. res) { return TodoItem .todoItemId. }) . server/controllers/todoitems.find({ where: { id: req.then(todoItem => { if (!todoItem) { open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. }.params.

}) . }) .content.catch(error => res.send(error)).content || todoItem.com .status(400).status(400).catch(error => res.complete.then(updatedTodoItem => res.body. if (!todoItem) { return res.status(200).update({ content: req. }. }).send(updatedTodoI . complete: req. } return todoItem .status(404).complete || todoItem. res) { return TodoItem open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.send(error)).body. destroy(req.send({ message: 'TodoItem Not Found'.

send()) .catch(error => res.status(404).find({ where: { id: req.then(todoItem => { if (!todoItem) { return res.status(400).send(error)).params. }. }) .status(204). .then(() => res. }) .catch(error => res.todoId. } return todoItem .todoItemId. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.destroy() .send({ message: 'TodoItem Not Found'.send(error)). }). todoId: req.status(400).com .params.

com . If we don't find it. we are grabbing the provided todoItemId from the request. which we're obtaining from the params object as todoId . In the update method. Let us.. you'll notice that we're finding the todo item to either update or delete by two criteria: it's own id which we're grabbing from the params as todoItemId and the id of it's parent todo. We are then finding the todo item with that id and in readiness to update it. we had this statement: open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. Earlier on. . when we were updating the todo title. for a moment. Edit: As pointed out by good people in the comments. }. we return early and send and error message to the user.. focus on the update method.

com .title. . }) ... To recap. JAVASCRIPT .update({ title: req. we said that we either use the new title or default to the old one if a title was not provided..body.title || todo. You will notice the same pattern when we're updating the todo item in this statement: JAVASCRIPT open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd..

com .. it wouldn't scale very well if you had to update a model with many fields.complete || todoItem. }) . we change change our ..content || todoItem.body. . since we have a small number of fields. you might want to use another approach where you give the Sequelize model update function the data and then specify the fields it should update.body. Using this approach.update({ content: req. complete: req. As such.complete. While this approach works for our application.content.update statement to: JAVASCRIPT open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd... .

. we extract the keys from the update object and tell the TodoItem Sequelize model to only update the fields that are present in the update data object. the update operation will leave that field untouched.body) }) . open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.. If we have a field in our model that's missing from the update object.keys function. { fields: Object. You can read more about updating models in these Sequelize docs.. we pass the whole update object we get from the request ( req..body.body ) to the update function. Using ES6's Object.keys(req.com .update(req. This saves us the trouble of having to define defaults using the || operator. . To recap. The destroy method finds a todo item with the stipulated id and deletes it. using this approach. .

module.. })).status(200).exports = (app) => { app.post('/api/todos'. Finally. app.get('/api/todos'. const todoItemsController = require('.js JAVASCRIPT const todosController = require('./controllers').get('/api'. todosController. res) => res. right below the route to create todo items.send({ message: 'Welcome to the Todos API!'. open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. Our complete routes file now looks like: server/routes/index. app. we will add the two new routes in our routes file. (req../controllers').list).create). todosController.todos.com .todoItems.

app. todoItemsControl app.com . todoItemsController. (req. app.put('/api/todos/:todoId'. // For any other request method on todo items.create app.retrieve). open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. app.list).delete('/api/todos/:todoId'.delete( '/api/todos/:todoId/items/:todoItemId'. todosController. we're going to re app.update). app.get('/api/todos/:todoId'. todoItemsController.put('/api/todos/:todoId/items/:todoItemId'.destroy).send({ message: 'Method Not Allowed'. }.get('/api/todos'.status(405).post('/api/todos/:todoId/items'. res) => res. todosController. todosController. app.de ). })). todosController.all('/api/todos/:todoId/items'.

You can find the complete code in this GitHub repo. We currently have no front-facing input fields validation. Currently. One way of performing this validation would be by intercepting the request in a middleware and validating that it contains the required fields. for example: Better error handling. we're assuming that all errors are due to the data the user has provided. it's imperative that you validate user input before it hits the database. This was a long post but yay! We're done! Well. :) open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. Express and Postgres. I hope this helped you to get up and running with Node. We're also sending back the whole error object. Our current validation (not null constraint) occurs at the database level. Form fields validation.com . Whenever you're building a web application. almost. That could be a security issue since you might leak information about your architecture to the end user. :) There are some improvements you could decide to make.

js Subscribe & get our FREE eBook Build Your First Node.js App Email Address Free Node Book open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. expressJS javascript node.com .

com .open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

Stalk Us     Monthly Best open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com .

com . Best Courses open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com .

js App open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. Subscribe & get our FREE eBook Build Your First Node.com . H IR E D  I want to get hired.

com . Email Address Free Node Book open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

My Scotch Posts  Next Up open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com .

com .. Implement Smooth Video Buffering for Better Viewing Experience with Cloudinary In the early days of the web. the only thing that mattered was getting that content out to users.. javascript open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

MEAN. MEAN App with Angular 2 and the Angular CLI One of the most common stacks that accompany Angular as a web framework is the MEAN stack.com ... angular2 javascript MEAN 16 Comments Scotch  Recommend ⤤ Share open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

Join the discussion… Ruben Sahagun • 8 days ago I have done the tutorial an it is wanderful.com . I have a question.js with an "s"? △ ▽ • Reply • Share › Mokatte • 14 days ago Great work! I've been struggling with Postgres/Sequelize + Node for past 2 days and this article was an eye o for me. what do you have to do? Thank you. △ ▽ • Reply • Share › Will • 11 days ago Loving this!!! I'm working my way through it but curious about something. if you want or you need to debug it.js file inside server/controllers/. Thank you! △ ▽ • Reply • Share › David Waterson • 19 days ago This is awesome stuff. Did you mean todos. Inside this file. In teh section where you say: Create todo. One question I have: When attempting to retrieve via findAll all todos and associated open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. Thank you. let's add the functionality to create todos.

}). res.get('env') === 'development' ? err : { message: 'Internal Server Error' }. I can't see where the issue is and am wondering if anyone running into this. I receive a 200 response but no output. △ ▽ • Reply • Share › Ievgen Samoilenko • a month ago Very good totorial. thanx for your work! To simplify error handling and make controllers code less verbose I su to add simple error handler at the end of app.then(todo => res. todoItems.app.body. something like this: // error handler app. req. // send error json res.com .create({ title: req.json({ err: err }).use(function(err. }) .js. res. next) { Todo . next) { // providing real error only in development err = req. than error handling in controllers might look like this (create method from todos controller): create(req.json(todo)) open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.title.

com . △ ▽ • Reply • Share › open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. thanks! But. when you update and delete a todoItemId.js ? △ ▽ • Reply • Share › James Muturi > Nikolay Digaev • a month ago Great catch. △ ▽ • Reply • Share › Alejandro Corredor > Nikolay Digaev • a month ago same doubt here. maybe I missed something. } △ ▽ • Reply • Share › James Muturi > Ievgen Samoilenko • a month ago Thanks for the suggestion. This method will come in handy! △ ▽ • Reply • Share › Nikolay Digaev • 2 months ago Very helpful tutorial. Levgen. Nikolay! Thank you! I've updated the post. In a subsequent piece. For example. don't you also need the todo which it belongs? △ ▽ • Reply • Share › Tim Arsenault • 2 months ago Great Tutorial! I'd love to see a part 2 to this where you integrate a front-end framework like Angular. I'm planning on showcasing centralized err handling.catch(next). . shouldn't we use todoId along with todoItemId wh querying database in server/controllers/todoitems.

I’m sure many beginners will find it useful! △ ▽ • Reply • Share › Caio Ribeiro Pereira > James Muturi • 2 months ago Cool! I hope you enjoy my book! Please..com/br/book/. The difficulty I face motivated this post. Stay tuned! :) △ ▽ • Reply • Share › FNGR • 2 months ago Great! Just read the first paragraphs but looks cool. could you share it in your social medias? Thanks! open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd. :) △ ▽ • Reply • Share › James Muturi > Caio Ribeiro Pereira • 2 months ago You’re writing a book for beginners on how to work with Node and Postgres! That’s awesome! I had a hard time starting out and from it's description.. I could have used a book like yours.apress. James Muturi > Tim Arsenault • 2 months ago A front-end with React is in the pipeline.com . Will read it later :) △ ▽ • Reply • Share › James Muturi > FNGR • 2 months ago Thank you! △ ▽ • Reply • Share › Caio Ribeiro Pereira • 2 months ago Cool! Very useful post! This post is very similar to the content of this book: http://www.

△ ▽ • Reply • Share › ✉ Subscribe d Add Disqus to your site Privacy open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com .

Subscribe to get our free eBook BUILD YOUR FIRST NODE.com .JS APP Subscribe to the Scotch Newsletter Get the Free eBook The Team The Pub Our Stuff About Us @sevilayha Write a Post MEAN Machine Scotch School @whatnicktweets Community Posts SpudPress Scotch Digital @hollylawly Scotch Box Scotch Store Scotch Panels Scotch Slack open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.

io. LLC.13378133781337 / Advertise / Contact / License / Affiliates © 2017 Scotch. Proudly hosted by Digital Ocean  open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com . All Rights Super Duper Reserved.      SSBsb3ZlIHNjb3RjaC4gU2NvdGNoeSBzY290Y2ggc2NvdGNoLg== v40.