Problem
A customer is about to launch XM Cloud and their front-end "head" application to production. A technical team member must verify that the application is ready for production.
Solution
XM Cloud Considerations
Published Content
Ensure that all of your content is published to Experience Edge. Review the Publishing to Edge recipe for more guidance. You should review your Incremental Static Regeneration (ISR) settings in your front-end application as part of the publishing process. This will determine the delay between publishing and when the new content is available to users.
Security
Perform a security review to ensure the correct access controls are in place.
Privacy
Verify your data privacy compliance with XM Cloud by using the privacy checklist.
Search Engine Optimization (SEO)
Ensure your application is SEO-optimized. Validate that your sitemap and robots.txt are publicly accessible by search engines. Additionally, consider other essential SEO details like alt tags on images, metadata, and open graph data.
Redirects
Ensure all previous or new redirects are handled. Refer to the Redirect Handling recipe (coming soon) for more information.
Error Page Handling
When an error occurs, ensure visitors are redirected to the proper page. See the documentation on generating a custom static error page.
Analytics
Ensure that XM Cloud Pages Analyze is ready to collect your production analytics. Refer to the setup guide here: Create and assign site identifiers for Analytics.
Front-end Hosting Considerations
Vercel and Netlify provide a production launch checklist. No matter what your hosting provider is, it would be beneficial to review them both.
Vercel Production Checklist for Launch
Netlify Production Launch Checklist
Environment Variables
Ensure that all services are using production environment variables, including the Context ID environment variable.
Domain & DNS
Review and follow the recommended steps to prepare your domain to serve your new application. Refer to Vercel Domain Documentation & Netlify Domain Documentation
Usage Monitoring
If your hosting platform supports notifications or alerts, consider setting those up for important limits like bandwidth, function invocations, and image optimization.
Front-end Application Considerations
Follow the Production Checklist provided in the Next.js documentation. The list covers front-end optimizations, development best practices, performance testing, and more.
Perform a Lighthouse performance test to uncover possible optimizations for your front-end application.
Check the Front End Checklist to ensure your front-end application is ready for production.
Related Recipes
- Performance Tuning (coming soon)
- Sitemap (coming soon)