---
title: "Eerste installatie van het thema"
description: "Ga aan de slag met Tajo!"
url: https://tajo.io/nl/docs/getting-started/configuration/
markdown: https://tajo.io/nl/docs/getting-started/configuration.md
lang: nl-NL
robots: noindex
---

Vraag vroegtijdige toegang aan

Vul je voornaam en je zakelijke e-mailadres in. We sturen je een link om je aanvraag voor toegang tot Tajo te bevestigen.

# Eerste installatie van het thema

1. Installeer om te beginnen eerst alle benodigde packages met `npm install` of `pnpm install`, en voer daarna een eerste build uit met `npm run build` of `pnpm build` om te controleren of de installatie werkt.

2. Kopieer de Pagefind-build (voor de zoekfunctie op de site) zodat die beschikbaar is in de dev-omgeving. Dit verschilt per besturingssysteem. Ik heb een paar commando’s gemaakt die daarbij helpen.

   - Voer op Windows `npm run winsearch` uit
   - Voer op OSX of Linux `npm run osxsearch` uit

3. Vervolgens configureer je de i18n-instelling van je site (één taal of meerdere). Voer gewoon het commando `npm run docs:config-i18n` uit en volg de instructies van het script om alles in te stellen!

4. Nu kun je de site helemaal naar eigen wens inrichten!

## Kennismaking met de code

Ik heb een paar code tours gemaakt die je wegwijs maken in de codebase. Je hebt de extensie [Code Tour](https://marketplace.visualstudio.com/items?itemName=vsls-contrib.codetour) nodig om ze in VSCode of een andere IDE te bekijken.

## Structuur van de code

De code is zo opgebouwd dat de meeste onderdelen onder de map `src/docs` staan. Daardoor plaats je die hele map eenvoudig in een bestaand project en voeg je in een paar minuten documentatiefunctionaliteit toe.

## Configuratieopties

De algemene configuratie van de site regel je in de map `src/docs/config/`. De meeste instellingen staan in afzonderlijke taalmappen, zodat je vertalingen makkelijker beheert.

### Site-instellingen

Met het bestand `src/docs/config/siteSettings.json.ts` stel je de site-instellingen in. Denk aan het inschakelen van view transitions, het inschakelen van animaties en het tonen van knoppen om links naar koppen in de documentatie te kopiëren.

### Sitegegevens

Met het bestand `src/docs/config/[language]/siteData.json.ts` stel je de sitegegevens in. Denk aan de titel van de site, de beschrijving, de links naar sociale media en de standaardafbeelding.

### Navigatiegegevens

Configureer de navigatiegegevens voor de bovenste navigatiebalk in het bestand `src/docs/config/[language]/navData.json.ts`.

### Indeling van de zijbalk

Bepaal de volgorde van je documentatiesecties in het bestand `src/docs/config/[language]/sidebarNavData.json.ts`.

### Robots

Zodat robots zoals die van Google de juiste sitemap zien, pas je het bestand `public/robots.txt` aan met het domein van je website.

## Meer bronnen

## Algemene informatie over Astro

Astro zoekt naar `.astro`- of `.md`-bestanden in de map `src/pages/`. Elke pagina wordt op basis van de bestandsnaam als route beschikbaar gesteld.

Aan `src/components/` is niets bijzonders, maar daar zetten we graag alle Astro-, React-, Vue-, Svelte- en Preact-componenten neer.

Statische assets, zoals afbeeldingen, zet je in de map `public/`. Zelf gebruik ik ook vaak `src/assets` voor afbeeldingen wanneer ik Astro assets inzet voor beeldoptimalisatie.

### Commando’s

Je voert alle commando’s uit vanaf de root van het project, in een terminal:

| Commando | Actie |
| --- | --- |
| `npm install` | Installeert de dependencies |
| `npm run dev` | Start de lokale dev-server op `localhost:4321` |
| `npm run build` | Bouwt je productiesite naar `./dist/` |
| `npm run preview` | Bekijk je build lokaal, voordat je deployt |
| `npm run astro ...` | Voer CLI-commando’s uit zoals `astro add`, `astro check` |
| `npm run astro -- --help` | Vraag hulp op bij het gebruik van de Astro CLI |

### Meer weten?

Bekijk gerust [de documentatie](https://docs.astro.build/) of spring in de [Discord-server](https://astro.build/chat).