requestly/awesome-frontend-resources: A curated collection of awesome resources for frontend developers: tutorials, tools, libraries, design assets, and more! ????

Awesome Frontend Resources

A curated collection of awesome resources for frontend developers: tutorials, tools, libraries, design assets, and more!

What is Awesome Frontend Resources?

Awesome Frontend Resources is a curated collection of top tutorials, tools, libraries, and design assets for frontend development. Whether you're a beginner or a seasoned pro, this easy-to-navigate repository is designed to simplify your learning and development process.

Contents

Learning Paths and Roadmaps

The journey of becoming a frontend developer can feel overwhelming, but structured learning paths and roadmaps can make the process more manageable and efficient.

DEVELOPMENT

Frontend Beginner Roadmap — A short roadmap for learning the basics before starting a frontend development role.

Frontend Roadmap — A comprehensive roadmap covering all areas of frontend development, guiding you from beginner to expert level.

Full Stack Roadmap — Covers a wide range of technologies for both frontend and backend development, essential for full-stack development.

IOS Developer Roadmap - A comprehensive roadmap covering all areas of IOS development. It covers patterns and techniques, app components, fundamentals, and so on.

LANGUAGES

JavaScript Roadmap — A comprehensive JavaScript roadmap starting from the basics and covering advanced topics.

TypeScript Roadmap — An extensive TypeScript roadmap beginning with the fundamentals and progressing to advanced concepts.

FRAMEWORKS

React Roadmap — A thorough React roadmap starting from the CLI and routers to testing and error boundaries, covering all essential concepts.

React Native Roadmap — A detailed guide for mastering React Native, from basics to advanced techniques in mobile app development.

Vue Roadmap — A comprehensive roadmap for learning Vue.js, covering fundamental to advanced topics for building dynamic user interfaces.

Angular Roadmap — An extensive Angular roadmap guiding you through the framework's core features, modules, and advanced concepts.

Node.js Roadmap — A complete roadmap for Node.js, encompassing server-side development, APIs, and advanced backend techniques.

MOBILE DEVELOPMENT

Android Roadmap — A step-by-step guide for Android development, covering all essential aspects from basic setup to advanced features.

iOS Roadmap — A comprehensive roadmap for iOS development, including Swift programming, UI design, and advanced iOS features.

Flutter Roadmap — An in-depth guide for Flutter development, from initial setup to building and deploying cross-platform mobile apps.

ENGINEERING

Software Design and Architecture Roadmap — A detailed guide for understanding and implementing software design principles and architectural patterns.

Data Structures Roadmap — A thorough roadmap for mastering data structures and algorithms, essential for efficient problem-solving in software development.

Code Review Roadmap — A comprehensive guide on how to conduct effective code reviews, improving code quality and team collaboration.

Learning Resources

Books

Online Library

Open Library — A vast digital library offering free access to millions of books, including many on programming and JavaScript.

Tutorials

Courses

Articles

TypeScript vs JavaScript — An article explaining the relationship and differences between TypeScript and JavaScript.

Videos

What the heck is the event loop anyway? — A clear and engaging explanation of the JavaScript event loop.

Closures Explained in 100 Seconds — A quick and concise video explaining JavaScript closures.

Docs & CheatSheets

Cheatsheets

HTML Cheatsheets — A handy reference for HTML5 elements and attributes.

Official Documentations

Development Resources

Playgrounds

Playcode — A playground for learning/testing/experimenting in JS or TS, along with HTML5 and CSS, with extensive library support.

JSFiddle — An online IDE for testing and sharing HTML, CSS, and JavaScript code snippets.

CodePen — A social development environment for front-end designers and developers, allowing you to build and deploy websites, showcase work.

Regex101 — A place to write and debug regular expressions with extensive and helpful feedback.

Communities

dev.to — A community platform for developers to share articles, tutorials, and discussions.

r/Frontend — A Reddit community focused on frontend development.

r/learnjavascript — A Reddit community for JavaScript learners to ask questions and share knowledge.

r/javascript — A Reddit community for discussing all things JavaScript.

Open Source Contributions

How to contribute to open source — A guide on how to start contributing to open-source projects.

How to find repos to contribute — Search on GitHub with label → first-timers-only to find out the issues that are good for first time contributors. Further filter with programming language of your choice.

— Search on GitHub with label → to find out the issues that are good for first time contributors. Further filter with programming language of your choice. GitHub Repos inviting contributors — Search on GitHub with label → help-wanted to find out the repos that are inviting contributors.

Legalities