Wed. Dec 4th, 2019

Host your Website

Read and learn

FatCow Web Hosting $1.00/mo* Trust your web hosting to the #1 web host provider, GoDaddy!

Build a Full Stack JavaScript CRUD App with Node/Express/Handlebars/Bootstrap/Postgres/Knex

1 min read



*WARNING* – this video is unedited and contains some profanity

# Build a Full Stack CRUD App: todos

We’ll be using:
* postgres for our database
* knex.js for our database migrations, seeds and queries.
* express.js for our routes and rendering
* handlebars.js for our server side view templates
* boostrap for our UI

The code is here on the part-1-rendered branch: https://github.com/w3cj/Full-Stack-JavaScript-CRUD/tree/part-1-rendered

## Full Stack Check List
* 0:33 Generate Express App
* 1:44 Create database/table
* 7:39 Seed table with sample data
* 10:13 List all records with GET /todo
* 19:40 Add Bootstrap
* 22:22 Show new form with /todo/new
* 29:28 Create a record with POST /todo
* 41:00 Show one record with GET /todo/:id
* 47:45 Show an edit form with GET /todo/:id/edit
* 59:41 Update a record with PUT /todo/:id
* 1:09:33 Delete a record with DELETE /todo/:id
* 1:14:44 Redirect on create / update / delete
Search for more Coding Garden videos here: https://cg-videos.now.sh
View the Coding Garden FAQ here: https://github.com/CodingGardenCommunity/app-wiki/wiki/Frequently-Asked-Questions

22 thoughts on “Build a Full Stack JavaScript CRUD App with Node/Express/Handlebars/Bootstrap/Postgres/Knex

  1. you sound like a really cool guy to hang out with lol. Anyways, thanks so much for the help on the video, I am currently on month 6 of my JavaScript diploma course and am already needing to build a pretty complicated CRUD app using MySql this helps a lot, I thank you for ur help! 🙂

  2. My brother, while other's praising you here, I found it quite out of pedagogy and it's purely bully and probably a show off video not intended to teach…. sorry but i am just thinking loud.

  3. From this example you send a data taken from a form with just key:value pairs. What do you to if you want to send an post request including an array. Like an object looking like { id: 50, damage_type: ["missing", "broken", "light"]}?

  4. in todo.js
    router.get('/', function(req, res, next) {
    knex('todo')
    .select()
    .then(todos => {
    res.render('all', {todos : todos});
    });

    });
    I get confuse the table name todo…where is property todos …we have only title property in array…

  5. Hi Reynolds,

    really man u r so fantastic. I like the way u taught & free fun 😉 … still I haven't complete the CRUD project it yet but i am on… I have a question that if I want to customize css for <all.hbs>, and then if i tried to change in <public/stylesheets/style.css> , it didn't work. but if i change css in <all.hbs> file then get effects, e.g: font color blue. So is it possible to get effect css for all files from the public css file or…?

    Cheers 🙂

  6. I'm trying to replicate on my windows machine, but I get lost on the createdb command, I'm using windows 8 and use cygdrive for commands. Installed postgresql but not sure how to get that createdb command to work as the video…

  7. NOTE: You need to have 'express generator' (npm install -g express-generator) & 'yarn' (npm install -g yarn) installed in order to use the command line like he does (express –git –hbs .)

Comments are closed.

Copyright © All rights reserved. | Newsphere by AF themes.