Things I have done:
- I created an API using Express using this article to create some bears - http://scotch.io/tutorials/javascript/build-a-restful-api-using-node-and-express-4)
- I added a favicon using this - https://github.com/expressjs/serve-favicon
- I pondered Jade as my view engine and then quickly decided that Handlebars would be much easier as I was already very familiar - https://github.com/ericf/express-handlebars
As you can see progress is good.
Unfortunately, next came the bit I always dread, trying to set out an effective design for the website. I struggle as a designer. At university I got familiar Photoshop and Illustrator, and while I really liked doing it at the time, sadly I have not kept up with the evolution of the software since. Luckily I can just prototype and see where it...
...Mild panic began to build.... oh god what about phones and tablets! As if deciding on a design isn't hard enough, I have to think responsive! Anyway - thank god for the kind people/companies of open source. Luckily we have Zurb Foundation and Bootstrap. Zurb Foundation is fantastic, but as I am already familiar with Zurb I thought I would use Bootstrap.
I am not going to bore you with all the details but provide you with my gotcha's list:
- By default Node does not permit the public directory to be accessed. I wanted to do this so I could access the bootstrap files which were stored in public/libs. If you would like to store your bower packages in a custom directory rather than the default like me, create a .bowerrc file in your route directory with no file name, if unsure check this. Then add the following:
{
"directory": "public/libs"
} - To access the public directory for styles and scripts:app.use(express.static(__dirname + '/public'));
- To use in your views:<script src="libs/bootstrap/dist/js/bootstrap.min.js"></script>
- Use navbar-static-top rather than navbar-fixed-top. This is a new class as of Bootstrap 3.0, it addresses the problem wherein the navbar sits over the content of the page.
No comments:
Post a Comment