Project Settings

These are the steps for any server-side project with :

  • NodeJS
  • Express JS
  • Knex
  • EJS

Table Of Contents

Git and Github

In the case where you've forked a repo, all you have to do is clone it somewhere

	$ git clone [repo_url]
	$ cd [repo_name]
	

In the event of forking/cloning a repo that has some dependencies, you need to run npm install to have those dependencies up and running on your copy of that repo.

In the case where you're creating a new project

  • Make a new directory, duh!

     $ mkdir [new_project_name]
     $ cd  [new_project_name]
    
  • If you're using oh my zsh then you can both create and cd into your new directory in one command:

     $ take [new_project_name]
    

Great now, you have a new folder and you're set for life, you can find a job, start a family ..

wait .. What?

  • Create a repo

     $ git init
    
  • Create a markdown readme file and add a nice description of what that repo is all about. Don't complain, and don't say 'nah, later ..'.

They're MY instructions, do as I say. >:-|

```
$ touch readme.md
```
  • Link your remote

     $ git remote add origin [repo_url]
     $ git remote -v
    

Now


![commit all things](http://i.imgur.com/dGidez2.jpg)
$ git status
$ git add readme.md
$ git commit -m "initial commit"
$ git push origin master

I know, I know .. Me too.

MVC and Folder Structure

  • Create models, views, controllers folders
  • Create assets folder, with css, images and javascript subfolders.
  • Create server.js
  • Cd into controllers folder and create router.js
  • Create db folder with knex.js file inside it
  • Your project after a tree command would look like this:
	$ tree
	├── assets
   │   ├── css
   │   ├── images
   │   └── javascript
   ├── controllers
   │   └── router.js
   ├── db
   │   └── knex.js
   ├── models
   ├── readme.md
   ├── server.js
   └── views



NPM

  • To create your package.json file, which will hold a reference to your project dependencies, use this command:
	$ npm init

A package.json file should be added to your project directory.

  • Install and save all the modules that you need to use in your project.

     $ npm install --save express ejs pg knex body-parser method-override morgan locus
    


    What do these modules do? ..

    • express If you're still wondering what this does, it's time for another career choice, bro. For the layman, it is essentially a fancy minimalist NodeJS framework that spares the need to repeat sever code for web services.

    • [ejs] (https://www.npmjs.com/package/ejs) is a view engine that can be used with express.js, it stands for 'embedded javascript', which means that you can embed your javascript code with your html. Their are many options out in the wild, you can use Jade in place of ejs.

    • knex is a SQL schema and query builder with a javascript syntax. I'd like to imagine it as a fancy wrapper around SQL.

    • body-parser basically parses the form input fields for their values and places them into an object that you can be accessed with a server request.

      • For example, if I were to need the value of a text input, body-parser would place that text into an object that is held as the value of the body key that I could then access via a request:

         req.body
        
    • method-override to your own dismay and mine, HTML forms don't support request verbs PUT and DELETE, so we need the method-override module to give us that flexibility.

    • morgan logs into your terminal console every request that takes place. Good for debugging.

    • locus opens a REPL during your program execution, allowing access to all variables. Again, amazing for debugging.


  • After the npm install command, a node_modules directory containing all these modules and any others you've installed, will be added to your project.

KNEX

Now that you've just installed the knex module, what do we do with it?


![take over the world](http://s2.quickmeme.com/img/ca/ca1e82814fbabf4703590d43509c7f4c2c1ce2403a1e634162043cef0a894c7f.jpg)
  • No, you can't do that; but here is what you can do with it:
$ knex init
  • After you enter the above command, a file called knexfile.js will be created. This file will contain all the database configuration settings.

  • Since we're still in the development environment open the knexfile.js file and head to the development object.

  • Before we adjust anything in this file, we need to go back to the terminal and create a database:

     $ createdb [database-name]
    
  • Now, let's head back to our knexfile.js file and take a look at that development object:

    • Change your client from sqlite3 to postgresql
    • Change the connection 'filename', to 'database'
    • Make the [database-name] that you just created the value of the 'database' key for the connection object.
    • Add a key called debug and set its value to true.
    • Your development object should look like this:
     development: {
     	client: 'postgresql',
     	connection: {
       		database: '[database-name]'
     	},
     	debug: true
     }
    
  • Wait, what about that knex.js file? What am I going to use that for? Well kids, you're going to use that to tell your knex model what environment you're actually in right now. We've set the development object in the knexfile.js file, but we haven't told knex that we're actually in development mode yet.. duh!

  • So, how do we tell the knex module what environment we're using? Here is how:

    • open knex.js.
    • add this code:
     var env = process.env.NODE_ENV || 'development';
     var config = require('../knexfile')[env];
    
     module.exports = require('knex')(config);
    

Migrations

For every table, you need a migration. In addition to this, if you're adding a new column to your table you will also need to make a new migration.

How do we make a new migration for table?

$ knex migrate:make [migration name]

A new directory called migrations should be created in your project directory. cd and tree into the folder and check the file that has been created inside that migration ...wait, what's that weird number filled name?... It's the exact date and time the migration had been created and the name is the migration name you've entered above. Open the file ..

Hmmm

Me neither.

  • Assuming that this migration is for the author's table for the knex Library assignment, the code should look like this:
exports.up = function(knex, Promise) {
 	return knex.schema.createTable('authors', 		function(table){
   		table.increments(); // id serial primary key
   		table.string('name');
   });
};
exports.down = function(knex, Promise) {
   return knex.schema.dropTable('authors');
};

  • One more thing ... you need to run the migration by entering:
knex migrate:latest
  • This command must be run after you makea migration i.e.. after you're done with creating all your migrations up to a certain point.

EJS

For all those times when plain old html and javascript are just too easy.

Embedded javascript allows you to process your data server-side, and then send it to your ejs template to render in html. In your routes.js file, process all of the data you want to show in html into an object and render it. Your server-side code should look something like this:

res.render('index', {someData: data});

Where index is your index.ejs page and {someData: data} is the object you are rendering.

Now for the fun part! ejs moves over to your index.ejs page, and looks for anything inside the ejs tags that matches someData.

  • <% %> for regular javascript
  • <%= %> for where code is being turned into html

The equivalent ejs code should look something like this:

<% someData.forEach(function(data) { %> 
    <%= data.whatever %>     
<% }); %>

Gitignore

We need to ignore some files because they're annoying. First make sure you have a gitignore, if you don't, then touch .gitignore. Files that are within node_modules and any .DS_Store file ought to be added to the .gitignore file. How do we do that?

  • In your terminal :

     $ echo node_modules > .gitignore
     $ echo .DS_Store >> .gitignore
    
    • > adds a new text to file
    • >> appends a new text to file

###PSQL

Some useful commands that helps you debug your database.

  • In the event of forgetting what is the name of your database:

    • You enter your PSQL repl using this command:

       $ \psql
      
    • HalahAlShaikhly=# this tells you, yep dude, you're in the zone. (It could be your name, not mine).

    • Back to checking how do I figure out what's the name of my database? Now that you're in the zone, you can insert the following command, which displays all your databases:

       \list 
      
    • There is another version of that command and it this : \l

    • What if you want to check your tables? Now that you know what the name of your database is, let's assume that I named mine banana, I need to connect to that database first, then check what the tables that I could possibly have. How do we connect to database? Just like that:

       \connect banana
       // now you're connect to your banana database,
       banana#
      
    • There is another version of that command which is \c banana

    • Great now, you're connected. Use the following command to check your tables:

       \dt