HTML, CSS and JavaScript tutorials

README.md

HTML, CSS and JavaScript tutorials

Here's a collection of guidebooks and tutorials that give the basics of HTML, CSS and JavaScript – three languages that form the basis for the modern web. The Mozilla links are documents that you can read through. The CodeCademy and other sites are interactive tutorials to get used to writing code.

For future projects, install Visual Studio Code, which is a handy text editor, useful for more than just web development (you can take interview notes in it, for example). Also, you'll want to install XCode on your mac, which you can access via the App Store on your computer. It's a big download (around 3gb) so it takes a while.

HTML - Creating elements and text (the structure of a page)

• Mozilla – HTML Basics
• CodeCademy – Learn HTML

Pay particular attention to list elements such as <ul> and <li> tags, which stand for "unordered list" and "list item," respectively.

CSS – Styling elements and controlling layout

• Mozilla – CSS Basics
• CodeCademy – Learn CSS

We'll be using a lot of classes and IDs so make sure to note how those are used and the differing syntax for each:

• Classes are written in HTML like <div class="my-fun-class"></div> and are referenced from CSS with a . before the name like this .my-fun-class.
• IDs show up in HTML like <div id="my-fun-id"></div> and are referenced from CSS with a # before the name like this .my-fun-id.

JavaScript – Manipulating the page, extracting information, organizing data

• Mozilla - JavaScript Basics
• CodeCademy – Introduction to JavaScript
• Learn JavaScript Online

We won't be using much JavaScript but it's good to understand the basics of variables. Pay particular attention to query selections like document.querySelector, document.querySelectorAll and document.getElementById and how to extract text with .textContent and .getAttribute(). Also pay attention to lists and their associated methods of .map and .filter, which will be very important.