d sektionen.se

Informationssidan för D-Sektionen är en statisk hemsida byggd med Astro. Den är utsprädd över två olika repositoyn, ett för själva hemsidan och ett för markdown-filerna som används för att generera innehållet.

• D-Sektionen
• D-Sektionen Content

Utveckling

Kloning av källkod

Eftersom att repot använder sig av submodules behöver du klona repot med --recurse-submodules flaggan. Detta gör att alla submodules klonas automatiskt.

git clone --recurse-submodules git@github.com:d-sektionen/d-sektionen.se.git

Alternativt kan du klona repot utan submodules och sedan initiera dem manuellt:

git clone git@github.com:d-sektionen/d-sektionen.se.git
git submodule update --init --recursive

Körande av hemsidan lokalt

Först bör du installera alla beroenden:

npm install

För att pagefind ska kunna bygga sökindexet behöver du bygga sidan en gång innan du kör den lokalt.

npm run build

Nu kan du köra sidan lokalt

npm run dev

Struktur

Styling

Stylingen för hemsidan är byggd med Tailwind CSS för att underlätta utvecklingen.

Komponenter

Alla komponenter sparas i src/components katalogen. För att underlätta importering går det att använda @components aliaset för att importera komponenter. Exempelvis:

import MyComponent from "@components/MyComponent";

Widgets

Widgets är de komponenter som är tänka att användas i MDX filer på content repot. Dessa är teniskt sett Astro komponenter men de är byggda för att användas i MDX filer. Widgets sparas i src/widgets katalogen.

Content management

Astro content hanteras i src/content.config.ts filen. Denna fil definierar hur content hämtas och vilka scheman kontentet ska följa. För nuvarande är dessa de collections som finns definierade:

• pages - Sidorna som finns i navbaren
• posts - Blogginlägg som visas på i nyhetsflödet samt /kategori/{id} sidorna
• categories - Kategorier som används för att filtrera blogginlägg /kategori/{id}
• event - Händelser som importeras från Gooogle Calendar