Here we're going to focus on a few things:
- Good folder structure
- Reusable code
- A suite of useful packages
server.js- our main server application`package.json- includes saved node modules for portability of code.gitignore- includesnode_modulesso that we don't send that folder to github when we sync up
public- where we keep static files for our served pages.
a.imagesormedia- for static pictures, audio, video, etc b.scripts- for static client-side javascript files c.stylesheets- for static stylesheets d.fonts- if you're storing fonts locallycontrollers- this is where you put amodelNamePlural.jsfile which is responsible for all routes for that modelName. They will be included inserver.jsand namespaced accordingly.views- this stores all of your templated views a. this is where you put a subfolder calledmodelNamePlural, and include yourtemplateEngine(e.g.ejs) files for that model. For example, you might haveviews/userswithnew.ejs,index.ejs,show.ejs, andedit.ejsinside of them. b. you also will want to include inside/viewstop level sitewide files, things like yourlayout.ejs, whatever you might use for your root, and files likefooterandheader.models- here is where your mongoose code lives, inmodelNameSingular.jsnode_modules- this is the folder for all saved packages
Ideally this is all about things like:
-
Use a frakkin layout. If you use the package
express-ejs-layouts, then you can have alayout.ejsin yourviewsfolder, and render will always use that. Then, it will add whatever you pass into the render function to fill in the<%- body %>tag. -
Rather than
console.logthe everything sometimes it's useful to make that the default. Use a logger likemorganto log every incoming request. You'll be happy that you did. -
Keep as much logic out of your views as possible, and use view partials when necessary. Suppose you have this in your view:
<% if (myModel.age > 21 && myModel.isNotMormon) { %>
<div class="drinks-are-on-me">
<% } else { %>
<div class="no-thanks-brah">
<% } %>It would be better to either give myModel a drinksClass method which would then be used like this:
<div class="<%= myModel.drinksClass() %>">Or to create a method in your controller which gets passed into the view:
Inside the myModels.js controller file:
router.get('/:id', function (req, res) {
// code and then...
res.render("myModel/show", {
myModel: someModelFromCodeAbove,
drinksClass: function (m) { // this will be available in .ejs
if (m.age > 21 && m.isNotMormon) {
return "drinks-are-on-me";
} else {
return "no-thanks-brah";
};
}
});
})And then in myModel/show.ejs:
<div class="<%= drinksClass(myModel) %>">Either is fine.
You should be using as many packages as it takes to make your life better. The sample code has many, but we'll also be using:
-
express-session which allows us to link an end user's browser to the connection they are making locally, which then gives us persistance for a user.
-
bcrypt which allows us to encrypt data, and check that new data is the same as our encrypted data.
-
passport and passport-local which allows us to authenticate users easily.