Skip to content
TagsAngular

What is Angular?

Angular is a front-end framework built and maintained by Google that helps developers build fast, powerful web applications. Think of it as a complete toolkit that gives you everything you need to build a web app in one place, rather than piecing together lots of different tools yourself.

Unlike some other frameworks, Angular has strong opinions about how your code should be structured, which can actually be a huge help when you're learning. Instead of facing a blank slate with a thousand decisions to make, Angular guides you toward proven patterns used by professional developers every day.

Why learn Angular?

Angular has been around since 2016 and has built up a large, active community of developers and a huge library of learning resources, which makes it a solid choice for beginners who want plenty of support while they learn.

Angular is also widely used by companies big and small to build everything from internal dashboards to customer-facing apps, which means learning Angular is a great skill if you're looking to land a job in web development.

Practice Angular on Frontend Mentor

Learning about Angular through reading or watching videos is great, but actually using it to build something real is where the learning sticks. That's exactly what Frontend Mentor is built for.

Frontend Mentor gives you professionally designed projects to build at your own pace, so you can practice Angular in a way that mirrors real-world work. Each challenge comes with design files and project requirements, and all you have to do is build it, which is exactly the kind of hands-on experience that helps things click.

Recommended Angular challenges

Hand-picked challenges to help you practice Angular at every skill level.

  • Free

    Social links profile

    • HTML
    • CSS
    newbie

    In this small project, you'll build out your social link-sharing profile. You can even personalize it and use it to share all your social profiles!

  • Free

    Product list with cart

    • HTML
    • CSS
    • JS
    junior

    Practice updating the UI in multiple places based on user actions. The starter download also includes a JSON file to help you practice populating the DOM dynamically.

  • Premium

    Character counter

    • HTML
    • CSS
    • JS
    junior

    This project will test a range of your skills, especially your JavaScript, with the counters and letter density graph. The theme switcher is another little challenge.

  • Free

    Interactive comments section

    • HTML
    • CSS
    • JS
    intermediate

    This is project will put your JavaScript skills to the test. We provide a JSON file to pull the data, but it's also a perfect project to build as a full-stack CRUD app!

  • Free

    Weather app

    • HTML
    • CSS
    • JS
    • API
    intermediate

    Build a responsive weather app with search functionality, unit conversion, and detailed forecasts using the Open-Meteo API.

  • Premium

    Frontend Quiz app

    • HTML
    • CSS
    • JS
    intermediate

    This app will test your skills (as well as your knowledge!) as you build out a fully functional quiz. We provide a local JSON file to help you practice working with JSON!

  • Free

    REST Countries API with color theme switcher

    • HTML
    • CSS
    • JS
    • API
    advanced

    If you're wanting to test your JavaScript skills this is the challenge for you. Use whichever JS framework you prefer and pull data from the REST Countries API.

  • Free

    Rock, Paper, Scissors game

    • HTML
    • CSS
    • JS
    advanced

    This challenge will test your HTML, CSS and JavaScript skills. There's even a Rock, Paper, Scissors, Lizard, Spock version if you really want to challenge yourself.

  • Premium

    Kanban task management web app

    • HTML
    • CSS
    • JS
    guru

    In this project, you'll build a fully-functional task management app with a light/dark mode toggle. We provide a JSON file, so you can practice working with JSON data.

View more challenges

Solutions made with Angular

View more solutions

Take your Angular skills further

Want a more structured approach? This learning path guides you through curated Angular challenges—from first principles to real-world projects.

advanced

JavaScript frameworks and libraries

Using a JavaScript framework can provide many benefits. In this path, we outline core concepts and provide a sequence of challenges to help you reinforce knowledge and gain hands-on experience with your chosen framework.

Related tags

  • #react

    React is a popular JavaScript library for building user interfaces. It is efficient and declarative, using a virtual DOM to optimize updates to the UI. React is often used with other libraries or frameworks.

  • #vue

    Vue.js is a progressive, reactive JavaScript framework for building web applications. Its adaptable architecture enables seamless integration with other libraries or existing projects, while its core library focuses on the view layer, making it easy to learn and use for a variety of applications.

Join 1,146,987 people building portfolio-worthy projects

Our highly supportive, positive community is here to help you improve your skills. We all try to help each other out wherever possible. We’d love to welcome you to our community!

Log in