Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Roadmap

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
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.