Roadmap

Roadmap.md

Roadmap of Web Development

Getting Started

Operating System

What operating system your computer runs on.

• Mac, Windows, Linux

Browsers

Where you view a website.

• Chrome, Firefox, Safari, Edge, Internet Explorer
• DevTools

Text editors

Where you edit a website.

• Notepad or TextEdit
• Notepad++, Visual Studio Code, Atom, Brackets, Sublime, Coda

The Internet

How computers communicate with each other.

• Domains
• Servers
• IP Addresses
• URLs
• HTTP protocol

Front End

HTML

Structure: how a website is structured.

• Syntax and Terminology: tags, elements, attributes, and attribute values
• Concepts: block vs. inline elements
• Formatting
• tables, forms, lists, headings
• Metadata

CSS

Style: how a website looks.

• Syntax and Terminology: selectors and properties, tags, classes, ids, pseudo
• Positioning: absolute, relative, fixed, static
• Box model
• Padding and margins
• Flex, float
• Inheritance
• Colors, text formatting
• CSS Animations

JavaScript

Interactivity: what a website can do.

• Programming basics

System Administration

Hosting

• Dedicated servers vs. VPS

Command Line

• Windows or UNIX-like (Mac and Linux)
• Moving between directories
• Creating files and directories
• Deleting files and directories
• Copying files and directories
• Moving files and directories
• Permissions

Version Control

How to maintain changes to your project.

• Terminology: Repository, commit, push, pull, branch, merge
• GitHub, GitLab, BitBucket

Workflow and Automation

• Node.js
• Gulp and Grunt
• Webpack

Sass

• Terminology and Concepts: Variables, nesting, mixins

Backend

Server

Web server software.

• Apache or nginx

PHP

A backend programming language.

• Connecting to a database

Databases

Where data is stored.

• MySQL

Content Management

• Content management system: WordPress
• Static site generators: Jekyll