By Fernando Pena – Published on Feb 17, 2022
Read on DEV.to

🧭 What You'll Find in This Guide

• A roadmap to learn and grow in front-end development
• Insights from the State of CSS and State of JS reports
• Recommendations for both free and paid courses

🛠️ Roadmap for Studying Front-End

1. The Basics

Start with the foundational trio:

• HTML
  Defines the structure of web pages.

  • 🔗 HTML5 Boilerplate

• CSS
  Styles the appearance of web pages.
  Key areas to explore:

  • Preprocessors: Enhance CSS with features like variables and nesting.

    • Examples: SASS, SCSS, LESS

  • Frameworks: Provide pre-designed components and layouts.

    • Examples:
      • Bootstrap
      • Tailwind CSS
      • Materialize CSS
      • Foundation
      • Bulma

  • CSS-in-JS: Write CSS directly in JS files.

    • Example: Styled-Components

• JavaScript
  Adds interactivity to web pages.

📊 Industry Insights

The article references data from:

• State of CSS Report
  Highlights trends and popular tools in CSS.

• State of JS Report
  Insights into JavaScript frameworks, libraries, and tools.

🎓 Learning Resources

A curated list of learning platforms:

• Free Courses
  Great for beginners and self-learners.

• Paid Courses
  Offer structured learning and mentorship.

🔗 Read the Full Article

👉 Web Development | Which path to follow in Front-End studies?