How Front-End Developers Are Made
Image source: https://github.com/kamranahmedse/developer-roadmap
If you were to set out today to become a front-end developer I would loosely strive to follow the process outlined below (Part two, "Learning Front-End Dev", dives into more details on learning resources).
- Learn HTML
- Learn CSS
- Learn DOM
- Learn JSON and data APIs
- Learn the fundamentals of user interface design (i.e. UI patterns, interaction design, user experience design, and usability).
- Learn CLI/command line
- Learn the practice of software engineering (i.e., Application design/architecture, templates, Git, testing, monitoring, automating, code quality, development methodologies).
- Get opinionated and customize your tool box with whatever makes sense to your brain (e.g. Webpack, React, and Mobx).
- Learn Node.js
Lately a lot of non-accredited, expensive, front-end code schools/bootcamps have emerged. These avenues of becoming a front-end developer are typically teacher directed courses, that follow a more traditional style of learning, from an official instructor (i.e., syllabus, test, quizzes, projects, team projects, grades, etc.). Keep in mind, if you are considering an expensive training program, this is the web! Everything you need to learn is on the web for the taking, costing little to nothing. However, if you need someone to tell you how to take and learn what is actually free, and hold you accountable for learning it, you might consider an organized course. Otherwise, I am not aware of any other profession that is practically free for the taking with an internet connection, a hundred dollars a month for screencasting memberships, and a burning desire for knowledge.
For example if you want to get going today, consuming one or more of the following self-directed resources below can work:
- 2016/2017 MUST-KNOW WEB DEVELOPMENT TECH [watch]
- A Beginner's Guide to Front-End Programming [read & watch][free to $]
- Become a Front-End Web Developer [watch][$]
- Front-End Curriculum [read]
- freeCodeCamp [interact]
- So, You Want to be a Front-End Engineer [watch]
- Front End Web Development Career Kickstart [watch][$]
- Front End Web Development: Get Started [watch][$]
- Introduction to Web Development [watch][$]
- Foundations of Front-End Web Development [watch][$]
- Lean Front-End Engineering [watch][$]
- Learn Front End Web Development [watch][$]
- Front-End Dev Mastery [watch][$]
- Front-End Web Developer Nanodegree [watch][$]
- Full Stack for Front End Engineers [$]
If you are not a self motivated individual and need a more structured approach you should consider a directed learning path.
When getting your start, you should fear most things that conceal complexity. Abstractions in the wrong hands can give the appearance of advanced skills, while all the time hiding the fact that a developer has an inferior understanding of the basics or underlying concepts.
The remaining parts of this book will point the reader to potential resources that could be used to learn front-end development and the tools used when practicing front-end development. It is assumed that on this journey you are not only learning, but also doing as you learn and investigate tools. Some suggest only doing to learn. While others suggest only learning about doing. I suggest you find a mix of both that matches how your brain works and do that. But, for sure, it is a mix! So, don't just read about it, do it. Learn, do. Learn, do. Repeat indefinitely because things change fast. This is why learning the fundamentals, and not abstractions, are so important.