Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
News

Learn how to test your front-end applications

We're delighted to announce that we've just launched our new "Introduction to front-end testing" learning path. In this path, we outline different testing methods to help you create more robust apps.

The Frontend Mentor team

Β·

24 Jul 2024

As developers, we aim to create robust applications, especially in a production environment. Testing often plays a key part in this, as we can write automated tests to ensure our code works as expected.

A working understanding of writing tests on realistic projects can only benefit your development career, so it's an excellent topic to learn. Therefore, we’re delighted to say that we've just launched our "Introduction to front-end testing" learning path!

Introduction to front-end testing

What we cover

We focus on automated testing strategies throughout this path, including writing unit, integration, and end-to-end tests. Here are the topics we cover:

  • Welcome to the front-end testing learning path: In this article, we introduce you to the world of testing, exploring the fundamental differences between unit, integration, and end-to-end tests. We also outline various popular testing tools.
  • Setting up your project for testing: Now that you understand the basics, we'll walk you through adding testing to your project. We use Vitest for React, Vue, and Svelte projects and Jest for Angular.
  • Unit tests: In this article, we review unit tests and the different approaches to writing tests. We also review what to test to help you learn the basics before putting your knowledge into practice.
  • Integration tests: In this article, we outline how integration tests differ from unit and E2E tests and provide an example application to illustrate how integration tests work to test multiple units of code.
  • End-to-end tests: In this article, we review how E2E tests are used to test entire user journeys in an application. We also outline some user journeys for the next challenge for you to practice writing E2E tests.
  • Other types of testing: There are many ways of testing our projects to ensure they work as intended. This article reviews some additional testing types that are important for front-end developers to understand.

Our chosen challenges

We strongly recommend completing our "JavaScript fundamentals" and "JavaScript frameworks and libraries" at the very least before attempting this path.

Because of the prerequisites, we increase the difficulty of the challenges pretty quickly, going from a junior challenge to a guru-level challenge at the end for Pro subscribers. This gives Pro subscribers an opportunity to build a fully-tested multi-page application, just like they might in a real-world product team!

Where to go

Here's the link to the learning path again: Introduction to front-end testing.

We hope you find the path helpful to start your journey into the world of testing. Many excellent testing learning resources are out there, and we link to many of them throughout the path for further learning. As always, the key is to practice, practice, practice once you understand the basics.

Enjoy! πŸ™‚

Practice building projects like a pro

  • Portfolio-ready projects
  • Professional design files
  • Curate your profile
  • Unlimited solution refinement
Unlock Pro

Get all community news and our latest articles in your inbox

Join over 50,000 developers receiving updates via our newsletter. Stay up-to-date with new challenges, articles, community news, featured solutions, and handy links from across the web. We promise no spam, and you can unsubscribe at any time.