Site Templates

Introduction

In the designer app there is a site preview where users are able to review their style configuration changes in “almost” realtime. This preview is an iframe with it’s source set to the HungerRush site templates application including a site ID parameter for retrieving the correct generated CSS for that site.

Template management and updating

The Site template repository is a Next.js app that mocks the HungerRush Online Ordering site templates. The source-of-truth production site for our template mocks is demogrouptile.hungerrush.com (demo). When new features and template changes are required it is the development team’s responsibility to confirm that the necessary changes have been applied to demo first before updating our templates to match.

Online Ordering mocking explained

The reason the Online Ordering templates are mocked for the site preview is for quicker updates to the UI when users make configuration changes in Designer. If the iframe source were set to the live published site, for a truthful representation, publishing would be required for each change to be displayed in the preview. This would cause longer UI update wait times resulting in an unpleasant user experience as well as unnecessarily increasing resource usage which would increase operating costs.