DEV Community

Cover image for Want to learn frontend development? Read this!
Saad Irfan
Saad Irfan

Posted on

Want to learn frontend development? Read this!

In the past, many people have asked me about a course or tutorial I recommend or know of to learn something (mostly related to frontend). So when I taught frontend development from beginner to advance level, I collected some resources. They had been in my Google Docs for more than a year.

Finally, I decided to curate a list of these resources and put them on GitHub. I compiled resources related to learning Git, HTML, CSS, JavaScript, Asynchronous JavaScript, React, Next.js, and more. I also listed some job boards where you can find jobs related to front-end development.

GitHub logo msaaddev / frontend-resources

A list of frontend resources from very basic to advance. Feel free to add new resources!

cover image

A curated list of frontend resources from very basic to advance. Feel free to add new resources!

separator

Code Editor

Name Description Status
Visual Studio Code A free and open source code editor for the cloud. free
Sublime Text A sophisticated, open source text editor for code, markup and prose. free
Atom A hackable text editor for the 21st Century free
Vim Vim is a highly configurable text editor built to make creating and changing any kind of text very efficient. free
Notepad++ Notepad++ is a text and source code editor for use with Microsoft Windows. free
Brackets With focused visual tools and preprocessor support, Brackets is a modern text editor that makes it easy to design in the browser. free

Resources

Name Description Status
Visual Studio Code Crash Course In this

The following are some JavaScript resources:

JavaScript

Name Description Status
Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. free

Resources

Name Description Status
Learn JavaScript - Full Course for Beginners This complete 134-part JavaScript tutorial for beginners will teach you everything you need to know to get started with the JavaScript programming language. free
JavaScript DOM Crash Course - Part 1 This crash course focuses on the DOM WITHOUT JQUERY. In this part we will talk about what the JavaScript DOM (Document Object Model). We will also look at how to change content and styles via these selectors free
JavaScript DOM Crash Course - Part 2 In this video we will learn how to traverse and move around the DOM with properties like parentNode, parentElement, nextElementSibling and so on. We will also learn how to insert elements with createElement() and createTextNode(). free
JavaScript DOM Crash Course - Part 3 In this lesson in the JavaScript DOM, we will be looking at different events and how to attach them to DOM elements with addEventListener(). free
JavaScript DOM Crash Course - Part 4 In this video we will take what we learned in the last 3 videos and create a simple Item lister project where we can add list items with a form, delete them and filter through them all with vanilla JavaScript and DOM properties and methods. free
Async Javascript Tutorial For Beginners (Callbacks, Promises, Async Await) Asynchronous JavaScript crash course free

Want more resources?

You can find more of these resources on the GitHub repository I have placed above. Don’t forget to star the repo if you found the resources I have collected useful.

Top comments (0)