Frontend development has taken the world by storm in the last decade with extreme progress in all web technologies (HTML, CSS, JS, etc.) sponsored and led by the biggest software companies in the world. It is arguably one of the highest paid, the most in-demand and satisfying jobs in the software industry for quite some time. This is the best time to learn it if you haven’t started already 😃!
Here is an exhaustive list of web resources that will help you to become a great Frontend developer in 2019.
Mozilla Developer Network for frontend (Html, CSS, Js, etc.) code reference and learning 🤓. This will be your code holy book 📚 and you should follow it religiously!
caniuse.com to check ✅ cross-browser compatibility of frontend technologies.
kangax-js-compat-table to check ✅ JavaScript versions (ES5, ES6, ES2016+ etc.) compatibility across different compilers, servers/runtimes and platforms (Desktop and Mobile).
html5 Periodic Table to learn different types of HTML5 elements and write semantic HTML markup 😎.
web.dev to learn about web 🕷 fundamentals from Google Developers 👨💻.
v8.dev to learn about Google’s open-source high-performance Javascript and WebAssembly engine 🦸♂️ that empowers Chrome and NodeJS.
css-tricks to learn everything about CSS 😻. Period.
htmlreference.io, cssreference.io to have an HTML/CSS visual guide 🤩 and code reference bookmark.
javascript.com, javascript.info to start learning about Javascript 😼.
ponyfoo.com to get valuable content about the Open Web platform 🕸️.
smashingmagazine.com to get professional resources for web designers 🤓 and developers.
freecodecamp.org to build frontend projects and collaborate with the community 👨🏫.
frontendmasters.com to advance 🔥 your skills with in-depth, modern frontend courses.
codecademy.com, udemy.com, pluralsight.com, lynda.com to do free and paid 💴 online code courses.
egghead.io to learn the best JavaScript tools and frameworks from industry pros 😎.
alligator.io to quickly understand seemingly-difficult frontend code concepts 😮.
leanpub.com to easily write, publish and sell in-progress and completed ebooks 📚 and online courses.
frontendfront.com to stay updated with the latest web news, trends and conferences 📣 happening all over the world 🌍.
uptodate.frontendrescue.org to follow frontend leaders 🏆 , find the best resources, attend conferences, get inspired and build your stuff.
medium.com to discover, read 📖 and write 🖊 related articles.
twitter.com, instagram.com to follow people you like, discover what they do 🔍 and share your work.
producthunt.com to discover and submit 💯 new products.
codepen.io to build, test 🧐 and discover frontend code.
jsfiddle.net to build demos for libraries/framework documentation 📃 and fiddle with frontend code.
repl.it to learn, build, collaborate and host your ideas in one place 🤩.
codesandbox.io to build ✍️ and share web applications using cutting edge technologies.
glitch.com to build ✍️ and share your next web app/bot/demo using customisable starter templates.
github.com to host and review 🧐 code, manage projects and build software 🤖 alongside millions of developers.
stackoverflow.com to get answers to your toughest coding questions 😁, share knowledge with your coworkers in private, and find your next dream job.
hashnode.com to connect with developers all around the world and grow your career 🤓.
dev.to to share and discover great ideas, have debates and make friends 💛.
Well, that's a wrap!
Do you like this list? Did I miss any essential web resources that you feel should be added?
Please let me know in the comments or collaborate on Github. Let's talk!
Disclaimer: All these resources have been chosen on popularity, relevance and effectiveness metrics. Their presence will certainly enhance your frontend developer portfolio but you can always pick and choose them :).
Latest comments (30)
Please add one more tool to generate color palettes colorswall.com/palette/generate
Great list - I propose that you should add glitch.com ! I am a long time user of codepen and a huge fan of it, and gitch.com is kind of a full stack version of it. If you haven't tried it yet - I highly recommend it!
Hi Agustin, thanks for the suggestion 🙌.
I totally agree with your proposal. glitch.com allows you to build and share full-stack web applications and it's a breeze to make stuff on it. I have built a couple of POCs on it and loved the whole experience.
I will add glitch.com to the list :).
Two more!
cssreference.io/
htmlreference.io/
😊
Hi Alberto, thanks for the suggestions 🙌.
Wow! These resources are invaluable and will act as an HTML/CSS code reference bookmark.
I will add both of them to the list :).
A pleasure mate!
Great list! I also recommend ponyfoo.com and also to subscribe to their weekly newsletter, they share really good content from all over the internet!
Hi Emanuel, thanks for the suggestion 🙌.
Indeed, ponyfoo.com is an amazing resource that has been sharing valuable content for a while now.
I will add it to the list :).
hashnode.com/
Hi Stefan, thanks for the suggestion 🙌 and sorry for a bit late reply.
hashnode.com seems like a fantastic resource to connect with developers all around the world and grow your career 🤓.
I will add it to the list :).
Very nice and informative article.
Thanks a lot.
Hi Alok,
I am glad you liked the compiled list :).
Hi Gabriel, thanks for the suggestion 🙌.
Totally agree. How can I miss it 😁? Honestly, I hadn't explored dev.to at the time of writing this post. I am simply blown away by its fantastic developer community!
I will add dev.to to the list :).
Great list thanks you
Hi Maxence,
I am glad you liked the compiled list :).
@frontEndMasters
Hi Mark, thanks for the suggestion 🙌.
Indeed, frontendmasters.com is a valuable frontend resource to advance your skills 🔥. It is a highly popular course among frontend developers.
I will add it to the list.
missing dev.to?
Hi Prashant, thanks for the suggestion 🙌.
How can I missed it 😁? Honestly, I hadn't explored dev.to at the time of writing this post. I am simply blown away by its fantastic developer community!
I will add dev.to to the list :).