2021’s Best Free Educational Resources for Front-end Developers
One-up your coding skills and industry know-how using these free tools, courses, and articles.
View the original article on Codeburst
As an independent developer I spend a lot of time teaching myself new concepts. Luckily, the internet is full of free educational resources to help web professionals improve their craft. This is my attempt to consolidate the best ones in a single location, because we all get tired of googling stuff. As I work mainly in JavaScript, most of the resources I use tend to focus on that language. However, I make use of a lot of tools that span many topics as well.
A List Apart
Format: Article
Focus: Front-end
Skill Level: All
URL: https://alistapart.com/
Articles exploring the design, development, and meaning of web content, with a special focus on web standards and best practices.
A11y Project
Format: Article
Focus: Accessibility
Skill Level: All
URL: https://www.a11yproject.com/
The A11Y Project is a community-driven effort to make digital accessibility easier.
binarysearch.io
Format: Interactive
Focus: Algorithms
Skill Level: Moderate, Advanced
URL: https://binarysearch.io/
A free interactive platform where you can work on coding and algorithms and problems together with others.
codeburst.io
Format: Article
Focus: Multiple
Skill Level: All
URL: https://codeburst.io/
“Bursts of code to power through your day.” - Tutorials and articles covering a wide range of engineering topics.
Codecademy
Format: Interactive
Focus: Multiple
Skill Level: Beginner, Moderate
URL: https://www.codecademy.com/
Interactive courses in both front and back-end technologies. Code directly in your browser and receive feedback.
CodeSignal
Format: Challenge
Focus: Algorithms
Skill Level: Moderate, Advanced
URL: https://codesignal.com/developers/
Get your coding skills certified, practice for technical interviews and build your developer resume in an interactive environment.
Codrops
Format: Article
Focus: Front-end
Skill Level: All
URL: https://tympanus.net/codrops/
Web design and development blog that publishes articles and tutorials about the latest web trends, techniques and new possibilities. Tutorials mostly focus on UI design and development.
Coursera
Format: MOOC
Focus: Multiple
Skill Level: Beginner, Moderate
URL: https://www.coursera.org/
Offers courses that have been made in partnership with known universities. Courses are generally a few weeks in length.
CSS Tricks
Format: Article
Focus: Front-end
Skill Level: All
URL: https://css-tricks.com/
Articles on building websites and all that entails, mostly from a front-end perspective.
Daily Coding Problem
Format: Challenge
Focus: Algorithms
Skill Level: Moderate, Advanced
URL: https://www.dailycodingproblem.com/
Get exceptionally good at coding interviews by solving one problem every day.
edX
Format: MOOC
Focus: Multiple
Skill Level: Beginner, Moderate
URL: https://www.edx.org/
Offers courses made in partnership with universities like Harvard and MIT. Courses are generally a few weeks in length.
Egghead.io Developer Chats
Format: Audio
Focus: Multiple
Skill Level: All
URL: https://podcasts.apple.com/us/podcast/egghead-io-developer-chats/
Chats with developers to talk about the latest and greatest in web development. Conversations that take you deeper into the human side of coding web applications and deliver insight that you might not expect.
freeCodeCamp
Format: Interactive
Focus: Multiple
Skill Level: Beginner, Moderate
URL: https://www.freecodecamp.org/
Synchronous interactive courses for beginner and intermediate developers. Code in your browser run automated tests to see if your code is implemented correctly. freeCodeCamp is a non-profit organization supported by donations and industry sponsors.
Frontend Masters Books
Format: E-Book
Focus: Front-end
Skill Level: All
URL: https://frontendmasters.com/books/
Advance your skills with in-depth, modern front-end engineering books.
Getting Git Right
Format: Article
Focus: Version Control
Skill Level: Beginner, Moderate
URL: https://www.atlassian.com/git
Tutorials, news and tips about using Git and version control, maintained by BitBucket.
Glimmer
Format: Article
Focus: Multiple
Skill Level: All
URL: https://glitch.com/glimmer/
Articles about internet culture, tech trends, policy, web history, social media platform policies, design, accessibility, streaming, and more. Produced by Glitch.
Go Make Things
Format: Article
Focus: Front-end
Skill Level: Beginner, Moderate
URL: https://gomakethings.com/
Code snippets, tools, techniques, and interesting stuff from around the web. Focused mainly on Vanilla JavaScript.
Hack Design
Format: Article
Focus: Design
Skill Level: Beginner, Moderate
URL: https://hackdesign.org/
Resources to learn design techniques and technologies. Materials for all skill levels. Sign up for the newsletter and get lessons emailed to you weekly.
Illustrated.dev
Format: Graphic
Focus: Multiple
Skill Level: Beginner, Moderate
URL: https://illustrated.dev/
Illustrated explanations of web development, technology and a little bit of anthropology.
Increment
Format: Article
Focus: Multiple
Skill Level: Moderate, Advanced
URL: https://increment.com/
Print and digital magazine about how teams build and operate software systems at scale. Produced by Stripe, it offers insights from industry leaders.
JavaScript Object Explorer
Format: Interactive
Focus: JavaScript
Skill Level: Beginner, Moderate
URL: https://objectexplorer.netlify.app/
A resource to help people find the correct object method for your code. Narrow down what you want to do and explore until you find what’s most useful to you.
Khan Academy
Format: Interactive
Focus: Multiple
Skill Level: Beginner, Moderate
URL: https://www.khanacademy.org/computing
Interactive video-based lessons mostly tailored toward beginners, but also including more advanced topics like algorithms and cryptography.
Learn Code the Hard Way
Format: Article
Focus: Multiple
Skill Level: Beginner, Moderate
URL: https://learncodethehardway.org/
Books and tutorials for beginners covering a variety of languages as well as design basics, Regular expressions, and system administration.
Leetcode
Format: Challenge
Focus: Algorithms
Skill Level: Moderate, Advanced
URL: https://leetcode.com/
Coding challenges and practice algorithms designed to help users prepare for technical interviews.
Photoshop Etiquette
Format: Article
Focus: Design
Skill Level: Moderate, Advanced
URL: https://photoshopetiquette.com/
Short lessons on best practices when designing for the web using Photoshop.
Scrimba
Format: Interactive
Focus: Front-end
Skill Level: Beginner, Moderate
URL: https://scrimba.com/
Hands-on interactive screencasts that let you code along with the instructor. Courses in a variety of front-end topics.
Skilled.dev
Format: Video
Focus: Algorithms
Skill Level: Moderate, Advanced
URL: https://skilled.dev/
Whether you are looking for your first job or trying to move up to your dream role, these videos will teach you how to win the coding interview.
Smashing Magazine
Format: Article
Focus: Multiple
Skill Level: All
URL: https://www.smashingmagazine.com/
Articles, guides, and books ranging from technical tutorials to discussions regarding the tech industry.
SurviveJS
Format: E-Book
Focus: JavaScript
Skill Level: All
URL: https://survivejs.com/
Advance your skills with in-depth, modern front-end engineering books.
The Odin Project
Format: Tutorial
Focus: Multiple
Skill Level: Beginner, Moderate
URL: https://www.theodinproject.com/
Free synchronous courses designed to fill in the gap for people who are trying to hack it on their own but still want a high quality education. Choose from three different “Learning Tracks”: Full Stack Ruby on Rails, Full Stack JavaScript, and Front End Only.
Watch and Code
Format: Video
Focus: Front-end
Skill Level: Beginner
URL: https://watchandcode.com/
Video-based coding courses focusing on beginning and intermediate JavaScript.