Walkthrough: Deploying your front-end application to Netlify
Netlify is a cloud computing company that offers a development platform that includes build, deploy, and serverless backend services for web applications and dynamic websites. Netlify has first-class support for Next.js.
This walkthrough describes how to:
- Prepare for deployment.
- Deploy the Next.js JSS app to Netlify.
- Configure webhooks to redeploy the app with updated content.
Prepare for deployment
Before deploying your Next.js JSS app to Netlify, you must ensure you have all the necessary environment variables ready and all the changes you want to deploy pushed in the repository and the branch you want to use for the deployment.
To prepare for the deployment of an application that uses GraphQL and Edge for fetching content and layout data:
- Generate an Edge API token if you don't already have one. You use this token to verify that your content is published to Edge and as a value for the
SITECORE_API_KEYenvironment variable. - In your SitecoreAI instance, publish all the changes you want to make available on your website.
If you made content and layout changes in a local XM environment, use the Sitecore CLI to publish your changes and verify that your content is on Edge. If you also made code changes, commit and push your code. If you set up your environment to redeploy when pushing changes to the configured branch, allow the redeployment to complete.
On Netlify:
- Log in or sign up for an account.
In your Next.js application:
- Commit and push your changes to your GitHub repository.
Deploy the Next.js JSS app to Netlify
Before deploying the Next.js JSS app, we suggest you watch the following video, which guides you through the deployment process. In the video, the publishing is done from the SitecoreAI Content Management instance.