How to Use Vercel

Getting started with Vercel

After reading this guide, you will be able to set up your Vercel account, deploy your first Next.js or React application, and understand how to optimise your workflow for better results.

Step 1: Sign up and set up

1. Go to Vercel's website.
2. Click on the "Sign Up" button in the top right corner.
3. Choose to sign up using GitHub, GitLab, or Bitbucket. Authorise Vercel to access your account.
4. Once signed in, you’ll be taken to the Vercel dashboard. Click on the "New Project" button to start setting up your first project.

Step 2: Your first deployment

1. On the "New Project" page, select a repository from your connected Git account.
2. Vercel will automatically detect your framework (Next.js or React). Click on the "Import" button.
3. Review the default settings and click "Deploy" to start the deployment process.
4. After the deployment is complete, you will see a unique preview URL for your project. Click on it to view your live application.

Step 3: Get better results

1. To optimise your deployment, navigate to the "Settings" tab of your project.
2. Under "Environment Variables," add any necessary variables your application requires for production.
3. Use the "Preview Deployments" feature to review changes before merging. This will create a unique URL for each pull request.
4. Consider setting up custom domains under the "Domains" section for easier access.

Pro tip

Connect your Vercel account to a CI/CD tool like GitHub Actions or GitLab CI for automated deployments on every push. This saves you from manually deploying each time you make a change.

Common mistake to avoid

A common mistake is neglecting to set the correct environment variables. Always check that your app has access to all necessary variables in the "Settings" > "Environment Variables" section before deploying, as missing variables can lead to runtime errors.