CSCI 446 Unit #7

Programming Assignment - Where the rubber meets the road...

For this assignment you will walk through chapter 3 of the textbook and set up your development environment. The author provides a github repository with the code. I strongly suggest that you walk through the example and actually type the text from the book, then use the repo only if you run into issues. I found that debugging small typos I made during this process helped my understanding and confidence. You might think copy-and-paste is quicker (it is), but you are more likely to have issues when you write your own code later. It's also important to pay attention to the concepts presented in this chapter. You won't need to do much original coding, so you should have plenty of time to focus on the provided example.

As part of this lab, you will:

• need to use a command line tool. The git materials provide a brief intro, in case you've only worked within an IDE.
• install node
• install express
• install git (if not already installed)
• deploy your app on Heroku (note: if you prefer a different provider, that's fine as long as you can provide a url for the grader to review your work).
• choose an editor (highly recommended). The MVC architecture spreads the web application code across multiple files, so it's good to have an editor that's well-suited to this purpose. I installed and liked Atom, but then my malware program deleted it (not sure if there was really an issue). So I moved to WebStorm. You can contact them for a free student license. Other options: https://www.slant.co/topics/46/~best-ides-for-node-js. If you find one you really like, post on piazza!

The only programming requirement is to change the message displayed from "Welcome to Express" to "Welcome to Express ... by [your name]" e.g., mine would be "Welcome to Express ... by Cyndi Rader".

Reflection notes. Because there are many concepts and not much original programming to help with understanding, you will also create a "reflection page" - a bulleted list of the main ideas you learned in chapters 1-3. The size of the list will vary by person (e.g., some of you already know HTTP, for some it's a new topic), but I would be disappointed if any list contained less that 5 bullets. Your reflection list should contain enough detail to be useful to you. For some people just listing terms is enough of a reminder (e.g., multi- vs single-threaded web server). Other people may prefer to write brief descriptions. This is really for your benefit, so please do not just list all the concepts I've highlighted in bold.

Chapter 3 Concepts (in bold) and Notes

As with the prior chapters, there are a few concepts that you should be sure to understand. This section also includes some Text revision and Suggestion notes.

• What is the purpose of package.json? General concept: software tools evolve rapidly. Most web applications will have some way to specify a configuration of specific tools, including version numbers, so that a stable application can be deployed on a server.
• Related concept: semantic versioning. There are many resources that describe semver, here's one (if you find others you like, post on piazza): https://www.jvandemo.com/a-simple-guide-to-semantic-versioning/
• Text revision. Jade is now called Pug: https://www.npmjs.com/package/pug. There are a few differences, mainly due to release of version 2, but I had relatively few issues using the template examples in the book. If you want to ensure your project is using pug, type: express --view=pug
• Middleware is an important concept. A complete understanding is beyond our scope, but do take a minute to review figure 3.4.
• Be sure to use nodemon so changes you make are immediately available to the browser.
• Model-View-Controller (MVC) is probably the most widely used web architecture (at least at the moment). Be sure to look at figure 3.5. MVC will become more familiar as we work through the chapters.
• Routing, or mapping urls to pages, is another very important concept shared by most web frameworks. It can also be a source of frustration in many frameworks! As with MVC, we'll work with routes throughout most of the chapters.
• Text revision. On page 66 (section 3.3.3), I had to change var index rather than var routes.
• Text revision. Please be sure to use foreman to verify your Heroku setup before pushing to Heroku. I needed to modify the book syntax to:

npm install -g foreman
nf start


Also notice that you then run the app as localhost:5000.
• Suggestion about Heroku. Walk through this section carefully (if possible, work with a teammate who can look at your process in case of any issues). Be sure to write down the name that Heroku assigns to you. I have a .txt file where I keep that name as well as commands that I need to remember, such as how to push onto Heroku. Then I can copy-and-paste from my .txt file to the command line. Has definitely save me some time!