Fall Session Slides

Couldn't attend Hack School in the fall? No worries! Here are the slides for you to learn all the materials we covered.


Last quarter, we learned the fundamentals of the web, the language behind it (JavaScript), and tools like Node.js, Express, and Web Sockets. By the end of the journey, we built Bruin Messenger, a real-time web chat app that employed all the knowledge we'd accumulated through our 8-week-long program.

Session 1 – The Face of the Web

In our first session, we introduced our hackers to the basics of two front-end languages: HTML and CSS. They determine a website's appearance.

Find the slides here:
Session 1 - Introduction to HTML and CSS

Session 2 – The Language of the Web

In our second session, we learned how to program using JavaScript, the language that websites speak. The programs we wrote are super beginner-friendly!

Find the slides here:
Session 2 - Introduction to JavaScript

Session 3 – Powering the Web

Buckle up! In Session 3, things became a little bit more theoretical and abstract, as we moved on to the back-end of the web.

Find the slides here:
Session 3 - CLI, HTTP, Node.js

Session 4 – Serving Up the Web

In Session 4, we boldly ventured into Express.js and basic routing. We built a Hack School Library as a warm up, and the skills you learned in this exercise would also be used in Bruin Messenger.

Find the slides here:
Session 4 - JavaScript & Express

Session 5 – Express.js Continued

Session 5 was a continuation and review of Session 4. Midterms hit the hackers around this time, so we gave extra time to reviewing the specifics of the Express.js framework.

Find the slides here:
Session 5 - More Node & Express

Session 6 – Web Sockets

In Session 6, we added chatrooms to Bruin Messenger using Web Sockets, a tool to let us communicate between inter-connected devices. Pay special attention here, because this is what made our chats fully functional in no time!

Find the slides here:
Session 6 - Sockets

Session 7 – Deploying Your App

In Session 7, we did a memory jog of how Web Sockets works, and officially served up Bruin Messenger locally. Follow the link inside the slide to get a copy of the skeleton code for Bruin Messenger if you are lost!

Find the slides here:
Session 7 - Review & Deploy

Session 8 – Build Your Own Web

And finally, in Session 8, we introduced our hackers to Heroku, one of the cloud platform services that takes care of deployment for you. We used it to serve up Bruin Messenger on the web to anyone.

Find the slides here:
Session 8 - Deploy with Heroku

Final words...

We hope with all the knowledge at your disposal, you now feel confident diving into the world of web development and explore more on the topics that you find intriguing! Best of luck from me and the Hack Team, and happy hacking <3!