This tutorial takes you through the first steps of installing node.js and getting a simple web application up and running. In this 15-step tutorial, we’ll cover the technologies of node.js, jade, npm, and twitter bootstrap.
With the background complete, let’s begin the tutorial!
Download and install node.js.
Download the Node.js Bootstrap Starter Template project. Here is a demo of the initial template running. In the next steps, we’ll modify the template to add a textbox and a button, allowing a user to enter their name and click submit.
Extract the project files to your desktop.
Open a Windows command prompt and navigate to the project folder from step 3 above.
At the command prompt, type: npm install
At the command prompt, type: node app
Navigate to http://localhost:3000 to view the example node.js project running. Exciting!
In the example project, open the /views folder and open the file index.jade in a text editor.
Add the following markup to the bottom of the file. Note, Jade uses tabs to indicate code blocks. After copying the below code, be sure to replace spaces with tabs and verify tab alignment is correct:
In the example project, open the /routes folder and open the file index.js in a text editor.
Edit the line of code res.render(…), to include “name: null”, so it appears as follows:
Add the following code to the top of the file:
In the example project, open the file package.json and add “easypost”: “*” to dependencies. Save the file.
At the command prompt, hit CTRL-C to kill the app , then type: npm install
At the command prompt, restart the app by typing: node app. Refresh the web page and submit. You’ll notice that we need to add a POST handler.
In the example project, open the file app.js and add the following code, towards the bottom of the file, after the line app.get(‘/‘, routes.index):
Restart the app and refresh the web page. You should now be able to type in your name and submit the form successfully.
Now that you’ve created a node.js web application, learn how to host your site on Heroku and publish your results live.
This article was written by Kory Becker, software developer and architect, skilled in a range of technologies, including web application development, machine learning, artificial intelligence, and data science.