Skip to content

Installation

SwiftAgency is a regular Astro project. There is no build step of its own, no framework to learn and no account to create.

  • Node.js 22.12 or newer. Check with node -v.
  • npm, which comes with Node. pnpm and Yarn work too; the commands below use npm.
  • Git, if you want to use the CMS or deploy from a repository.
Terminal window
# In the folder you downloaded or cloned
npm install
npm run dev

Open http://localhost:4321. Edits to files in src/ show up as you save.

The visual editor runs on the same server at http://127.0.0.1:4321/keystatic, or open it straight away with npm run cms. See Keystatic CMS.

Command What it does
npm run dev Dev server at localhost:4321, CMS at /keystatic
npm run cms Dev server that opens straight into the CMS
npm run build Static build into dist/
npm run preview Serves the production build
npm run check Astro Check: types and templates
npm run lint ESLint
npm run format Prettier, with the Astro and Tailwind plugins
npm run verify Check, lint, format check and build in one go. CI runs this.
npm run lighthouse Builds, then runs Lighthouse CI with the same thresholds as CI

The demo is a fictional studio called Swift. Work through this list and nothing of it will be left on your site.

  1. Studio details. Edit src/config/site.ts: name, legal name, URL, email, phone, address, social links and currency. See Configuration.

  2. Domain in robots.txt. Change the Sitemap: line in public/robots.txt to your domain.

  3. Preset. Set theme.preset to the look you want and set theme.switcher to false so visitors don’t see the demo preset picker. See Presets.

  4. Words. Page copy, navigation labels, services and prices live in src/i18n/ui/en.ts (and de.ts, id.ts if you keep those languages). See Languages.

  5. Work and articles. Replace the case studies, journal articles and open roles with your own, in the CMS or by hand. Delete the demo images in src/assets/ you no longer use.

  6. Legal pages. The privacy policy and imprint are template text. Rewrite them in src/content/legal/ and have them checked for your country.

  7. Contact form. Set formEndpoint in site.ts, or the form stays in demo mode. See Contact form.

  8. Social image and icon. Replace public/og.png (1200 × 630) and public/favicon.svg.

  9. Check and ship. Run npm run verify, then deploy.