Setting up Playwright testing for Django and Vercel with Checkly integration Tutorial

I’ve been meaning to invest in Playwright for a while now, and luckily for me, Checkly solved the need to learn it myself. And now I’ll share this process with you to save you some time 😎

Background

Checkly actually integrates super easily with Vercel for any framework. I currently use Vercel for my Next.js and Django portfolio websites.

Screenshot of Vercel deployment details with Checkly integration running checks successfully after a git push for my Django portfolio website.

My use cases for Checkly right now are so trivial they are not even necessary. But I think it’s a good idea to get used to automatically testing your project because you never know when you’re going to break something. It’s also a transferrable skill that is useful in industry when you start working on projects involving two or more people.

Overview

Before I begin, I’d like to review what I’ll cover. First, I’ll show you how to create a Django project in Vercel and connect it with GitHub. Second, we’ll add the Checkly integration.

Create a new Django project in Vercel

You can skip this step if you already have a Django project in Vercel.

Go to your Vercel Dashboard and Add a new project.

Scroll down to Clone Template and select Browse All Templates →

Search for Django and click on Django Hello World.

Click Deploy.

Select your GitHub scope and name your repository.

Click Create and wait for Vercel to prepare your Git repository. (Vercel returned an error but I returned to the projects page and everything was fine 🤷‍♂️)

Return to your Vercel Dashboard and click on your new Django project.