🌏 🌎 Web Development Course Resources List 🌏 🌏

Section 1: Front-End Web Development

1. Download the Course Syllabus
2. App Brewery Cornell Notes Template Submarine Cable Map
3. Google Chrome Browser (recommended) Atom Text Editor (recommended)
4. List of Atom Plugins
5. VS Code Text Editor (good alternative)
6. VS Code Extensions

Section 2: Introduction to HTML

1. HTML Cheatsheet by Stanford University
2. Experiment with HTML code on codepen.io
3. The Adventures of Sherlock Holmes on Gutenberg.org
4. MDN documentation on headings
5. W3Schools documentation on headings
6. Alternative reference devdocs.io
7. Use the Wayback Machine to find out what websites used to look like in the olden days
8. Professor Thomas H. Cormen's Personal Site (co-author of Introduction to Algorithms)
9. Professor John Kleinberg's Personal Site (developed the HITS algorithm for web search)
10. Professor Emeritus Donald Knuth's Personal Site (author of the Art of Computer Programming)
11. Useful Atom keyboard shortcuts
12. See what the emmet package can do on their cheat sheet
13. List of UTF-8 characters
14. See encoding differences on Windows symbol charts (e.g., Greek vs Arabic)
15. See all unicode characters with a map on unicode-table.com
16. Joel Spolsky on the absolute minimum any developer needs to know about unicode
17. Difference between the HTML5 emphasis vs italicise tags Hyperlinks and the Wikigame
18. Stanford HTML Cheatsheet
19. A beautiful example of an online CV by Pascal Van Gemert

Section 3: Intermediate HTML

1. Pascal Van Gemert's Online CV
2. MDN Table Documentation
3. MDN Form Documentation

Common Form Inputs: React.js

4. MDN Input Documentation
5. Publish your website using Github Pages

Section 4: Introduction to CSS

1. Stanford CSS Cheatsheet
2. Toasty Technology classic 90s Style Website
3. Sean Halpin's beautiful personal website
4. MDN documentation on background colour
5. Curated colour palettes on colorhunt.co
6. Colour palette used in lectures
7. Table of named colours on MDN
8. Overview of default CSS applied by the browser
9. MDN documentation on border-styles
10. devdocs.io on CSS height
11. W3Schools documentation on CSS Text
12. Download the Debugging Problem Starting Files
13. Download the Bacon Fan Site Starting Files
14. MDN CSS Reference
15. Emojipedia broccoli emoji
16. CSS Properties and Pseudoclasses Reference (MDN)
17. MDN :hover Documentation

Section 5: Intermediate CSS

1. Sean Halpin's beautiful personal website
2. Create a Favicon with favicon.cc
3. My colours from colorhunt
4. Markus Vogl Interactive Box Model Demo
5. Download the CSS-My Site Images
6. Is the img element block level or inline level?
7. MDN margin documentation
8. W3Schools documentation on Web Safe Fonts
9. cssfontstack.com
10. Google Fonts
11. Download the StubCode.html file
12. Lorem Ipsum Generator
13. flaticon.com
14. giphy.com
15. MDN CSS color property documentation
16. MDN font-weight documentation css3buttongenerator.com
17. Completed Personal Site Project

Section 6: Introduction to Bootstrap 4

Codeply: Use Bootstrap in an Online Editor Bootstrap Homepage

Boostrap Examples

How to Install Bootstrap

Submarine Cable Map

Websites featured on awwwards.com Design patterns on ui-patterns.com Websites on dribbble.com

Templates on sneakpeekit.com Wireframing with balsamiq

Bootstrap Navbar

Bootstrap Colour names

Bootstrap NavBar Codeply

Bootstrap Grid Codeply TinDog Starting Files Bootstrap Layout Grids Google Fonts: Montserrat Google Fonts: Ubuntu Bootstrap Containers Bootstrap Buttons

Apple Icon on Font Awesome

Hint: CSS Transform Function

Need sample text? Use a lorem ipsum generator: loremipsum.io

Section 7: Intermediate Bootstrap

Bootstrap Carousel

Bootstrap Card

Cards Pricing Example Bootsnipp.com Examples

Download Stacking Order Flowchart Z-Index Codeply Example

Mobile Friendly Test

TinDog Completed Website Files

Section 8: Web Design School - Create a Website that People Love

Penny Juice's Website

Penny Juice Rebranded

Curated colour palettes on Color Hunt

Adobe Color Wheel

Design Challenges on Daily UI Page inspirations on Collect UI Build a design using canva.com

Section 9: Javascript

The History of Internet Explorer Comic Strip

Writing Good Javascript Guidelines Karel Online IDE

Section 10: Intermediate Javascript Randomness -video by Khan Academy

Why can't programmers program? A blog past from Coding Horror Now that's what I call a Hacker. The legendary story retold in English. The original story from above link in Russian.

Fibonacci challenge Flow Chart

Section 11: The Document Object Model (DOM)

HTML Tree Generator

Download the Starting Files to the DOM Challenge

Section 12: Boss Level Challenge 1 - The Dicee Game

Download the Starting Files to the Dicee Challenge Download the completed Dicee Challenge

DOM Style Javascript property names

Section 13: Advanced Javascript and DOM Manipulation

Download the Starting Files to the Drum Kit

Download the Completed Files to the Drum Kit

Section 16: The Unix Command Line

Download Hyper Terminal

For Windows Users: Download Git

For Windows Users: Hyper Configurations Learn enough command line to be dangerous

Section 18: Node.js

Download Node.js

Node API Documentation

Node Documentation on Exports & the Module Object MDN Docs on Javascript Objects

Katacoda NodeJS Playground

Section 19: Express.js with Node.js

Express Documentation List of HTTP Status Codes

Section 20: APIs - Application Programming Interfaces

UK Police API Documentation

murdermap.co.uk uses the Police API to plot crime The Kanye Rest API Endpoint

Parameters and Paths on the SV443 Joke API Postman API Tool

OpenWeatherMap API

W3Schools JSON vs. XML

The Rise and Rise of JSON

Chrome Browser Add-on Json Viewer Pro (Awesome was sold to another owner)

Node HTTPS Module Docs HTTP Status Codes

HTTP Status Dogs

Criptii Hexcadecimal Converter Bootstrap Sign In Example

Get the Bootstrap CDN Mailchimp Getting Started Mailchimp API Reference Mailchimp List Documentation The Boostrap Jumptron Deploy to Heroku

Heroku Node.js Documentation

Sign up to our Newsletter (if you like)

Section 21: Git, Github and Version Control

Download Git for Windows and Mac

Download the Git Cheatsheet

Download the Git Quick Reference

Gitignore and the absence of NPM Modules on GitHub Projects

Section 22: EJS

app.js Starting File

EJS documentation (e.g., on tags) Documentation on var Documentation on let

Documentation on const

Download styles.css for Todolist v1 App

Section 23: Boss Level Challenge 3 - Blog Website

Starting files for the challenge Completed Website Final Code

Section 24: Databases

Kristof Kovacs' database comparison

A bit of context: Internet Live Stats

Section 25: SQL

W3Schools on SQL

SQL Playground on sqliteonline.com Data Types in SQL

Primary Keys in SQL

Foreign Keys in SQL

Inner Joins

Completed SQL demo project

Section 26: MongoDB

How to install MongoDB on Mac

How to install MongoDB on Windows

MongoDB installation documentation for MacOS MongoDB Docs on CRUD operations

MongoDB Query Operators

MongoDB Update Operations

MongoDB NodeJS Driver

Section 27: Mongoose

Mongoose: an alternative to the native MongoDB driver Mongoose documentation on the Model

Mongoose documentation on data validation

Section 28: Putting Everything Together

Todolist v2 starting files

Mongoose findByIdAndRemove() method

MDN on inputs of type "hidden"

Removing items from an array withthe MongoDB $pull operator How to capitalise Strings using Lodash

Todolist v2 completed web app

Section 29: Deploying Your Web Application Sign up and deploy a free cluster with MongoDB Atlas

Heroku documentation on getting started with NodeJS Deploying an existing application on Heroku

Section 30: Boss Level Challenge 4 - Blog Website Upgrade

Download the starting files Download the Completed Project

Section 31: Build Your Own RESTful API from Scratch

ExpressJS Route Parameters

Lodash Utility Library

Chained Route Handlers Challenge Solution

Download the Completed Project

Section 32: Authentication & Security

Download the Starting Files

cryptii.com

Numberphile Video on Enigma Part 1 and Part 2

What are Rainbow Tables

How do Rainbow Tables Work?

Bad Things Happen When You Don't Secure Your API Keys Developer AWS gets used by Litecoin miners

gitignore and directories

MDN Array forEach() loop

Check if your password is compromised

Plaintext Offenders

Password Strength Checker

Hacker Typer

Install NVM

Passport

Google Developers

Section 33: React.js