Deploy the Sparrow Starter Web App Using Vercel

First, fork the Sparrow Reference Web App repository using the button shown below. Vercel will link to the repository on GitHub and automatically deploy every time code is merged to the main branch.

From the README document in the cloned Sparrow Reference Web App repository on GitHub, there is a section called “Deploying.” Inside is a section called “Deploy on Vercel.” Click the Vercel Platform link to start.

First, the repository must be imported to Vercel. If it doesn’t appear, search for it.

Click the “Import” button next to the correct repository, which is sparrow-reference-webapp.

Once the repository is imported into Vercel, create a team name.

Then, configure the Project Settings. Make sure the project name, framework and root directory are what you want.

Next, open the Environment Variables section and configure the Environment Variables. They should be named the same as they are in the .env.local file.

Now it is time to click the big blue “Deploy” button.

Vercel will indicate where it is in the deployment process.

When it is finished. it will have a screen saying “Congratulations!” and indicate that the site has been deployed.

Click the “Go to Dashboard” button at the right to view the dashboard and access the site URL.

Note that in this deployment, the company name variable was not set and it rendered as “Nada Company.” You can add a NEXT_PUBLIC_COMPANY_NAME environment variable if you would like to change this name.

Troubleshooting Vercel Deployments

To edit the environment variables in a Vercel deployment, go to Settings and chose Environment Variables. Add new variables, or edit the existing variables and save.

Redeploy by going to the Deployments tab.