Implementation steps

Follow these steps to upgrade to the latest template.

1. Prepare for your upgrade
   

   Before you start, save a copy of your current site.

   Then, identify a framework. Current frameworks include HTML, Eleventy, .NET Core MVC, and React. You’ll usually pick the framework you’re currently on.

2. Review Template updates
   

   To understand the changes in the code, perform a code comparison in your framework repository. This helps you understand the work you need to do. You can also learn how to do a code comparison in GitHub.

3. Download the State Web Template from GitHub
   

   Download the latest Template release for your framework:

   • HTML
   • Eleventy
   • ASP.NET Core MVC
   • React

   This is also a good time to have your security office perform a scan of the files.

4. Look for CSS, JavaScript, and structural changes
   

   Most changes are made in:

   • The CSS and JavaScript source files in the /src/scss/ and /src/js/ folders
   • Includes and modules folders /src/_includes/ and /src/_includes/modules/
5. Replace older library files with the updated ones
   

   The Template has CSS and JavaScript (JS) code base. You will replace these source files with newer ones or point to the corresponding CDN links found on the state web template CDN page.

   Custom CSS and JS code may be impacted when you update these files. Keep your customizations separate from the core template source code for an easier update process.

6. Integrate the new template into your environment
   

   From your code comparison, make the necessary changes and updates to your code. Usually, incremental versions will not require any structural template adjustments. You only need to replace core CSS (/src/scss/) and JS (/src/js/) files or update the CDN links.

7. Perform necessary tests and reviews
   

   After core source code has been updated, you should thoroughly review and test your website or web application before pushing to production. This includes QA, code and heuristic reviews, and accessibility testing. Do not forget to inspect for code level errors or conflicts.

8. Release to production
   

   You’re now ready to follow your organization's change management and release process. You may want to perform another QA and verify that everything works as expected in the production environment.