Domaine is the world's largest independent Shopify design & development partner. Our agency site is built for performance, scalability, and ease-of-use.
Domaine uses Astro as a lightweight framework for SSR and SSG. Astro ships zero javascript by default, allowing for many of the conveniences of Next.js but without the bulk and performance concerns of React. If needed, components can opt-in to a reactivity framework like React, but so far this has not been needed.
We use hybrid rendering throughout this project, but in reality this results in all pages being fully static, leading to great performance and SEO optimization. We fetch all CMS content on the server at build time, so no client-side rendering is needed. More on CMS data-fetching below.
Astro also comes with some nice quality-of-life features like performance auditing, viewport transitions, single-file components, scoped CSS, and much more.
We use Sanity as the CMS for our site, for its extensibility, flexibility, and optimizations. The site is built modularly using a set of reusable sections, giving editors a high level of control over page building outside of the core site pages. Once content changes have been published, they can be deployed directly from Sanity to either Staging or Production.
We use Vercel to manage deployments of the site via their GitHub integration. Pushes to the staging or master branch will trigger a build in Vercel and deploy to staging.meetdomaine.com or meetdomaine.com respectively.
All commands are run from the root of the project, from a terminal:
| Command | Action |
|---|---|
npm install |
Installs dependencies |
npm run dev |
Starts local dev server at localhost:4321 |
npm run build |
Build your production site to ./dist/ |
npm run preview |
Preview your build locally, before deploying |
npm run astro ... |
Run CLI commands like astro add, astro check |
npm run astro -- --help |
Get help using the Astro CLI |
Reach out to trey@meetdomaine.com!