nawafi / hw-w05d04-express-structure

HW W05D04 Express Structure

Today we are going to be thinking about our applications and their structure. To do so, we are going to scaffold an application where a user can make color palettes. We are going to create markdown files for each of our app's files and outline what each file does.

Application Flow / Moc

Here is the spec of the application. Take a close look at it and what each of the pages show. Each of the requests are marked with the route in black, the model middleware in red and the controller middleware in blue.

ASSIGNMENT

Go through every page and take detailed notes about what should be in each file. There are some examples in:

• Palettes Controller
• Colors Model
• Each of the palette views: index, show, new, edit

Take careful note on how we relate the palettes to the colors.

Make sure to go through every page!

Submission

Submit the homework by midnight tonight.

---

Below this line is other useful information about express applications. Feel free to add any general info you want.

File Tree

.
├── controllers
│   ├── colorsController.js
│   └── palettesController.js
├── db
│   ├── config.js
│   └── seeds.sql
├── index.js
├── models
│   ├── color.js
│   └── palette.js
├── node_modules
├── package-lock.json
├── package.json
├── public
│   └── styles
│       └── style.css
└── views
    ├── colors
    │   ├── edit.html
    │   ├── new.html
    │   └── show.html
    ├── index.html
    └── palettes
        ├── edit.html
        ├── index.html
        ├── new.html
        └── show.html

Set up

Steps we need to set up our application:

• Initiate npm in our application directory

npm init

• Install the packages we need for our application:
  • express (the base of our server, to set up routes)
  • mustache-express (to render views with data from our server)
  • body-parser (so we can get data from forms)
  • pg-promise (to make queries to our database)
  • method-override (so we can use PUT and DELETE requests)
  • morgan (to log our requests)

npm install --save express mustache-express body-parser pg-promise method-override morgan