Første temaoppsett

1. For å komme i gang installerer du først alle nødvendige pakker med npm install eller pnpm install, og kjører deretter et første bygg for å bekrefte at oppsettet fungerer, med npm run build eller pnpm build.
2. Kopier Pagefind-bygget (for søk på nettstedet) slik at det er tilgjengelig i utviklingsmiljøet. Dette varierer med operativsystemet ditt. Jeg har laget noen kommandoer som hjelper deg.
   • På Windows kjører du npm run winsearch
   • På OSX eller Linux kjører du npm run osxsearch
3. Deretter vil du konfigurere i18n-oppsettet for nettstedet (ett språk, eller flere). Bare kjør kommandoen npm run docs:config-i18n og følg instruksjonene i skriptet for å komme i gang!
4. Nå kan du sette opp nettstedet slik du selv vil ha det!

Kodeintroduksjoner

Jeg har laget noen kodeomvisninger som introduserer deg for kodebasen. Du trenger utvidelsen Code Tour for å se dem i VSCode eller en annen IDE.

Kodestruktur

Koden er strukturert med de fleste elementene under katalogen src/docs. Det gjør det enkelt å slippe hele mappen inn i et eksisterende prosjekt og legge til dokumentasjonsfunksjonalitet på noen få minutter.

Konfigurasjonsalternativer

Overordnet konfigurasjon av nettstedet gjøres i mappen src/docs/config/. De fleste innstillingene ligger inne i egne språkmapper for å gjøre det enklere å håndtere oversettelser.

Innstillinger for nettstedet

Filen src/docs/config/siteSettings.json.ts brukes til å konfigurere innstillingene for nettstedet. Det gjelder ting som om view transitions skal være på, om animasjoner skal være på, og om det skal vises knapper for å kopiere lenker til overskrifter i dokumentasjonen.

Nettstedsdata

Filen src/docs/config/[language]/siteData.json.ts brukes til å konfigurere dataene for nettstedet. Det gjelder ting som tittel, beskrivelse, lenker til sosiale medier og standardbilde.

Navigasjonsdata

Konfigurer navigasjonsdataene for den øverste navigasjonslinjen i filen src/docs/config/[language]/navData.json.ts.

Sidemenyoppsett

Konfigurer rekkefølgen på dokumentasjonsseksjonene dine i filen src/docs/config/[language]/sidebarNavData.json.ts.

Robots

For at roboter som Google skal se riktig sitemap, bør du redigere filen public/robots.txt slik at den bruker ditt eget domene.

Flere ressurser

Generell informasjon om Astro

Astro ser etter .astro-filer eller .md-filer i katalogen src/pages/. Hver side eksponeres som en rute basert på filnavnet.

Det er ikke noe spesielt med src/components/, men det er der vi liker å legge komponenter for Astro, React, Vue, Svelte og Preact.

Statiske ressurser, som bilder, kan legges i katalogen public/. Jeg bruker også ofte src/assets til bilder når jeg bruker Astro assets for bildeoptimalisering.

Kommandoer

Alle kommandoer kjøres fra roten av prosjektet, i en terminal:

Kommando	Handling
npm install	Installerer avhengigheter
npm run dev	Starter lokal utviklingsserver på localhost:4321
npm run build	Bygger produksjonsnettstedet til ./dist/
npm run preview	Forhåndsvis bygget lokalt, før du publiserer
npm run astro ...	Kjør CLI-kommandoer som astro add, astro check
npm run astro -- --help	Få hjelp til å bruke Astro CLI

Vil du lære mer?

Ta gjerne en titt på dokumentasjonen eller hopp inn i Discord-serveren.