Front-end development

Hi There

<p> This is an open-source repository for all who want to learn front-end Development.</p> <br> <h2 align="center" ><strong>Front-end development</strong></h2><br>

Front-end web development is the practice of converting data to a graphical interface, through the use of HTML, CSS, and JavaScript, so that users can view and interact with that data. <br>

Make sure to show your support by star mark & sharing the repository

A List of Useful Resources for Front End Developers

Front-end development
Hi There
A List of Useful Resources for Front End Developers

RoadMap

Roadmap - For a well described step-by-step roadmap for front-end developers.

Useful

BGJar - Free SVG background generator for your websites, blogs, and app.
Inspect - inspect and debug your mobile web apps and websites on iOS devices directly from Mac or Windows.

Learning

A Complete Guide to Flexbox | CSS-Tricks - A comprehensive guide to the Flexbox Layout.
A Complete Guide to Grid | CSS-Tricks - A comprehensive guide to the Grid Layout.
Command Line Power User - A video series for web developers on learning a modern command-line workflow with ZSH, Z, and related tools.
CSS Grid - Complete video course all about CSS Grid
Best Of JS A site to check the best GitHub Repos for your favourite js framework
CodeCademy - A series of interactive courses teaching the world how to code. Offering free and paid subscriptions across a variety of languages.
Codementor - A tool to get help from experienced developers in various coding languages on your learning journey.
Scaler Topics - A platform to learn programming languages like HTML, Java, Javascript, Python etc.
Conquering Responsive Layouts - Made by Kevin Powell(https://twitter.com/KevinJPowell). This course takes you through everything you need to know to create responsive layouts in his brilliant 21-day course.
Coursera - A selection of courses from highly reputable schools like Stanford and Yale.
CSS Almanac | CSS-Tricks - A quick reference guide to many features of CSS.
CSS Grid Playground - A visual guide curated by the Mozilla team to help you learn CSS's grid layout features with lots of code example and demos.
Design Resources - Design Resources from Skullface.
dev.to - Where programmers share ideas and help each other grow.
DevProjects - A free community consists of curated projects from senior developers to help you bridge the gap between theory and practice. !
Dicoding Academy - Where everyone can learn programming from fundamentals (Available only in Bahasa Indonesia).
edx - A series of University-level courses from Harvard, MIT, Wharton, and more.
EggHead - Web development video tutorials in "bite-size" segments. Has both free and "Pro" (paid) memberships.
Enboard | Front End Resources - Organized resources about front end development.
Flexbox - Level up your Flexbox knowledge – an online, Zombie-centric story course.
freeCodeCamp - A free resource incorporating programming projects and interview preparation for developer jobs.
Frontend Masters - Web development video tutorials from industry leaders (updated frequently). Has both free (limited-time) and paid memberships.
Full Stack Open - Course on Full Stack Web Development by University of Helsinski. Learn React, Redux, Node.js, MongoDB, GraphQL and TypeScript in one go! This course will introduce you to modern JavaScript-based web development. The main focus is on building single page applications with ReactJS that use REST APIs built with Node.js.
GeeksforGeeks - A computer science portal for geeks.
Khan Academy - A universal online learning platform that also provides the important courses for developers.
LearnAnything - Search interactive mind maps to learn anything.
Learn JavaScript - Learn JavaScript in an interactive environment. Read short lessons, take notes, and complete challenges directly in your browser.
Mastering Markdown - A Mini Series that will change how you write documentation.
Mozilla Developer Network - The latest information about Open Web technologies.
Complete web development tutorials -Lyty.dev complete web development tutorials with well explained examples for free.
Pluralsight - Unlimited online developer training from industry experts.
Saylor - An open, online learning solution offering college credit opportunities for students.
Scrimba - Code-screencast-based learning in a variety of languages.
Scotch - Many Web development courses. Has both free and "Premium" (paid) memberships.
Search Courses - A selection of trending courses and tutorials.
SoloLearn- A free portal for learning web development.
Team Treehouse - Self-paced learning across a variety of languages and subjects.
The Modern JavaScript Tutorial - Everything about the Javascript Language.
The Odin Project - An Open-Source Curriculum for Learning Web Development
Tutorials point - Tutorials for many different languages with interactive code examples.
Udacity - Learn anything online – deep learning, machine learning, front end languages.
Udemy - An online learning and teaching marketplace.
Watch and Code - The computer science school for students that demand intellectual rigor and depth.
W3School - Web development reference library. Covers HTML, CSS, Javascript (jQuery, AJAX, and more), as well as some server-side languages. Includes descriptions and interactive examples.
Web APIs | MDN - Everything a beginner needs to know about Web APIs.
Web Design in 4 minutes by Jeremy Thomas creator of Bulma CSS and marksheet.io.
WesBos - Free and premium courses in web development
Web Dev Tricks - All your CSS, js, jQuery trending codes with source codes in one place. Your handy partner for all types of modern web development and designs.
web.dev - Guides and resources for modern fast websites by google developers.
Become a Front-End Web Developer - Develop competency with HTML, CSS, JavaScript, and jQuery.
WebGlossary.info - Glossary for web development and design, with more than 3,500 entries (as per August 2023)
Web Skills - A visual overview of useful skills to learn as a web developer.
The App Brewery - All in one platform to cover your web development skills
Full Stack open 2021 - This course serves as an introduction to modern web application development with JavaScript.
Devtools Tech - A free interview preparation platform for Frontend Engineers with a focus on high quality real world programming questions.

⬆ back to top

A11y

A11y Style Guide - A living style guide or pattern library, generated from KSS documented styles...with an accessibility twist.
Axe - Accessibility testing toolkit.
Colour Contrast Analyser - CCA helps you determine the legibility of text and the contrast of visual elements, such as graphical controls and visual indicators.