The most essential list of resources for Front-End beginners (?? ?? & ??)
If you want to learn how to become a Front-End developer, you are on the right place!
Regularly I will update that list with new resources and links I found on the web. Don't hesitate to participate sending a PR! Maybe your first on Github :)
I'm using some emoticons to give you more information about these links.
- All links without a flag are in English ?? ??. The flag ?? means the resource is in French, ? means the resource is multi-language.
- ? are paid tutorials, ? are free tutorials. Sometimes you will have some free videos / articles and other paid on the same website.
- ? indicate that the link is a reference
- ? is present when video content is available
Table of Contents
- Start here
- Learn HTML
- Learn CSS
- Learn JavaScript
- Learn Git
- Tools
- Chat / Slack
- Aggregators / News
- Newsletters
From Web Developer Roadmap 2017
Start here
- Understand Internet
- How Does the Internet Actually Work? ? ?
- What is Internet? ? ?
- How does the internet work? - Part 1 (It's like a bad drawing.) ?
- How Does the Internet Work? ?
- How the Internet Works for Developers - Pt 1 - Overview & Frontend ?
- ?? Benjamin Bayart : Qu'est ce qu'Internet (Conférence à SciencesPo le 14 avril 2010, durée 5h30) ? ?
- ?? C'est pas sorcier -INTERNET : Les pirates tissent leur toile ?
- ?? Comprendre Internet - histoire ?
- ?? Comprendre comment marche Internet ?
- ?? Comprendre Internet
- Understand your journey
→ Web Developer Roadmap 2019 - Github
Learn HTML
-
Courses / Tutorials
- ? Learn HTML - CodeCademy ?? ? ?
- HTML5 and CSS - FreeCodeCamp ? ?
- MarkSheet - A free HTML & CSS tutorial ? ?
- Intro to HTML/CSS: Making webpages - KhanAcademy ?
- Learn the Web ?
- HTML5 Introduction - EDX ?
- HTML - Creating basic web pages ?
- Learn to code HTML & CSS - Shay Howe ?
- HTML Tutorials ?
- Intro to HTML and CSS - Udacity ?
- Learn HTML in 12 minutes - Youtube ? ?
- Learn HTML in 30 Minutes - Youtube ? ?
- HTML Fundamentals - SoloLearn ??
- HTML Basics - TreeHouse ? ?
- HTML/CSS Path - Code School ? ?
- HTML Essential Training - Lynda ? ?
- Your First Day with HTML - Pluralsight ? ?
- HTML Fundamentals - Pluralsight ? ?
- Introduction to HTML and CSS - TreeHouse ?
- Introduction to HTML5 and CSS3 - Frontend Masters ? ?
- HTML/CSS on Code Avengers ??
- 30 Days to Learn HTML & CSS ?? ?
- ?? Apprenez à créer votre site web avec HTML5 et CSS3 - OpenClassRooms ??
- ?? Tutoriels web HTML - Alsacréations ?
- ?? HTML et CSS - Le Cours Complet - Udemy ?
- HTML5 Tutorial - w3schools ?
-
Documentation
-
Guidelines
-
Quiz / Challenges
-
Articles/Books
Learn CSS
-
Courses / Tutorials
- ? Learn CSS - CodeCademy ?? ?
- Learn CSS in 12 Minutes - Youtube ? ?
- CSS Basics - TreeHouse ? ?
- Introduction to CSS ? ?
- CSS3 In-Depth ? ?
- CSS Essential Training 3 - Lynda ? ?
- Scalable Modular Architecture for CSS (SMACSS) - Frontend Masters ? ?
- ?? Tutoriel HTML/CSS - Box Sizing - Grafikart ? ?
- ?? Tutoriel CSS : Comment bien organiser son CSS - Grafikart ? ?
- ?? Tutoriels web CSS - Alsacréations ?
- CSS Tutorial - w3schools ?
- Learn CSS - Sololearn
- Selectors
- CSS Diner ? ?
- Flexbox
- ? Flexbox Froggy ? ?
- Flexbox Defense ? ?
- CSS Grid
- ? Grid Garden ? ?
- Learn CSS Grid with Wes Bos ? ?
- Selectors
-
Documentation
-
Guidelines
-
Quizz / challenges
-
Articles/Books
- CSS, The definitive guide - Eric Meyer
- Enduring CSS - Ben Frain
- The CSS PocketGuide - Chris Casciano
- CSS Secrets: Better Solutions to Everyday Web Design Problems - Lea Verou
- Professional CSS3 - Piotr Sikora
- ?? CSS3 - Raphaël Goetter, Hugo Giraudel
- ?? CSS avancées - Raphaël Goetter
- ?? CSS avancées, Vers HTML5 et CSS3 - Mathieu Nebra
- ?? Premier pas en CSS3 et HTML5
Learn JavaScript
-
Courses / Tutorials
- Basic JavaScript ? ?
- Introduction To JavaScript - CodeCademy ?? ?
- Beau teaches JavaScript - Youtube ? ?
- JS 30 For 30 - 30 Projects for 30 Days ? ?
- Intro to JavaScript - Udacity ?
- Learn JavaScript - Codementor ?
- Introduction to JavaScript Programming - Frontend Masters ? ?
- LambdaSchool Javascript Mini Bootcamp?? ?
- JavaScript Essential Training - Lynda ? ?
- JavaScript Fundamentals - Tuts+ ?? ?
- Getting Started with JavaScript for Web Development - Scotch ??
- JavaScript Basics - TreeHouse ?
- JavaScript path - Code School ?
- ES6 for everyone ? ?
- ?? Tutoriels web JavaScript - Alsacréations ?
- JavaScript.Info
- JavaScript Tutorial - w3schools ?
- Javascript Tutorial - Watch and Code by Gordon Zhu ??
- Learn Javascript
-
Documentation
-
Guidelines
-
Quiz / challenges
-
Articles / Books
- Practical Modern JavaScript ?
- You Don't Know JS (book series) ?
- JavaScript, the definitive guide
- Javascript: The Good Parts
- Eloquent JavaScript: A Modern Introduction to Programming
- JavaScript Allongée
- Learning JavaScript
- Understanding ECMAScript 6: The Definitive Guide for JavaScript Developers
- JavaScript and JQuery: Interactive Front-End Web Development
- ?? JavaScript - Développez efficacement
Learn GIT
- 15 minutes to learn Git ?
- Git-it (Desktop App) - NodeSchool ? ?
- ? Learn Git on CodeCademy ?? ?
- Git-it is a (Mac, Win, Linux) Desktop App for Learning Git and GitHub ? ?
- Learn Git Branching – Educational challenges ?
- Learn Git by Microsoft ?
- Git-it – Learn Git in a real terminal ?
- Git CheatSheet ?
- Git Essential Training - Lynda ? ?
- Try Git ?
Tools
-
Essential
- Github ?? ?
-
Website auditors
- Checkbot ?? ?
-
Playgrounds
-
Editors
- Visual Studio Code ? ?
- Sublime Text ?
- Atom ?
- Brackets ?
- NotePad++ ?
- Cloud9 ??
Chat / Slack channels
Aggregators / News
- Smashing Magazine ?
- CSS-Tricks ?
- Front-End Stash ?
- Codrops ?
- Front-End Front - Basically, front-end news
- Echo JS - JavaScript News
- A list Apart - Code
- Scotch - Code Eat Sleep Loop
Newsletters
- Frontend Focus
- CSS Weekly
- CSS-Tricks
- JavaScript Weekly
- WebTools Weekly
- Smashing Magazine
- Sidebar
- Responsive Design Weekly
- JSK Weekly
- WebRTC Weekly
Contributing
Open an issue or a pull request to suggest changes or additions.
Contributors
Check out all the super awesome contributors.