explaingit

frontendmasters/front-end-handbook-2017

3,783HTMLAudience · developerComplexity · 1/5LicenseSetup · easy

TLDR

Source for the free 2017 Front-End Developer Handbook, a beginner-friendly guide to what front-end development is, how to learn it, and which tools professionals use (HTML, CSS, JavaScript, and build tools).

Mindmap

mindmap
  root((FE Handbook 2017))
    Section 1 What It Is
      Role overview
      Skills involved
      Team fit
    Section 2 Learning
      Self-directed resources
      Courses and books
      Structured paths
    Section 3 Tools
      Code editors
      Build systems
      Testing tools
    Core Topics
      HTML
      CSS
      JavaScript
      Browser DOM
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Get an overview of what front-end development involves and what skills to learn as a complete beginner.

USE CASE 2

Find a curated list of learning resources for HTML, CSS, JavaScript, and browser fundamentals without being overwhelmed by options.

USE CASE 3

Use as a reference to understand the tools and build systems that front-end developers were using in 2017.

USE CASE 4

Share with a manager or employer as a quick orientation to what front-end developers actually do.

Tech stack

HTMLCSSJavaScript

Getting it running

Difficulty · easy Time to first run · 5min

This is a readable handbook, no setup required, just open the HTML files or read the online version. Note: content reflects 2017 practices.

Free to read and share for personal or educational use, but not for commercial purposes and you may not modify it (Creative Commons BY-NC-ND).

In plain English

This repository holds the source files for the Front-End Developer Handbook 2017, a freely available guide written by Cody Lindley and sponsored by Frontend Masters. The handbook is aimed at anyone who wants to understand what front-end development is, how to learn it, and which tools practitioners use. It works as a starting point for beginners, a reference for working developers, and an orientation resource for managers or employers who want to understand the field. The handbook is organized into three sections. The first covers what front-end development actually is as a practice: the skills involved, the kinds of work front-end developers do, and how the role fits into a broader team. The second section points to learning resources, both self-directed (tutorials, courses, books) and more structured paths. The third section surveys the tools commonly used in the field at the time of writing, from code editors to build systems to testing tools. The content centers on the core web technologies: HTML, CSS, the browser document model, and JavaScript. It sticks to those and to tools built directly on top of them. The authors describe the handbook as a curated shortlist rather than an exhaustive catalog, with the goal of giving readers enough context on each topic without going so deep that any one section becomes overwhelming. Note that this is the 2017 edition, and a newer 2019 edition is available at the Frontend Masters website. The 2017 content reflects the tools and practices that were current at that time, so some recommendations may be outdated. The handbook is published under a Creative Commons license that allows reading and sharing but not commercial use or modification. The full text is readable online and was also available for download in several ebook formats.

Copy-paste prompts

Prompt 1
Based on the Front-End Developer Handbook 2017, give me a learning roadmap to go from zero to being able to build basic websites with HTML, CSS, and JavaScript.
Prompt 2
Summarize what a front-end developer does day-to-day according to the frontendmasters handbook and how their role fits into a product team.
Prompt 3
List the core build tools and code editors that were standard for front-end development in 2017 and explain what each one does.
Open on GitHub → Explain another repo

← frontendmasters on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.