Skip to content
AMN Docs

Guide Day 1 - Setup Local

Guide Day 1 - Setup Local

Documentation technique

Audience : Nouveaux développeurs rejoignant l’équipe
Durée estimée : 2-4 heures
Prérequis : Sprint 0 terminé

1. Prérequis

1.1. Outils requis

Outil Version minimale Installation
Node.js 20+ https://nodejs.org/
Git 2.30+ https://git-scm.com/
VS Code Dernière https://code.visualstudio.com/
Wrangler CLI Dernière npm install -g wrangler
Sanity CLI Dernière npm install -g @sanity/cli

1.2. Comptes requis

  • Compte GitHub avec accès au repository
  • Compte Cloudflare avec accès au workspace
  • Compte Sanity avec accès au projet

2. Clonage du repository

Terminal window
# Cloner le repository
git clone git@github.com:votre-org/votre-repo.git


# Se déplacer dans le dossier
cd votre-repo


# Installer les dépendances
npm install

3. Configuration des variables d’environnement

3.1. Création du fichier .env

Terminal window
# Copier le fichier d'exemple
cp .env.example .env

3.2. Remplir les variables1/2

.env
SANITY_PROJECT_ID=your-project-id
SANITY_DATASET=production
SANITY_API_READ_TOKEN=your-read-token
SANITY_API_WRITE_TOKEN=your-write-token
SANITY_PREVIEW_SECRET=your-preview-secret


CLOUDFLARE_ACCOUNT_ID=your-account-id

3.2. Remplir les variables2/2

Où trouver ces valeurs :

  • SANITY_PROJECT_ID : Dashboard Sanity → Settings → API
  • SANITY_DATASET : production ou staging
  • SANITY_API_READ_TOKEN : Dashboard Sanity → Settings → API → Tokens
  • SANITY_API_WRITE_TOKEN : Dashboard Sanity → Settings → API → Tokens
  • SANITY_PREVIEW_SECRET : Généré aléatoirement (ex: openssl rand -base64 32)
  • CLOUDFLARE_ACCOUNT_ID : Dashboard Cloudflare → Workers & Pages → Account ID

4. Authentification

4.1. Cloudflare Wrangler

Terminal window
# Authentification
wrangler login


# Vérification
wrangler whoami

4.2. Sanity CLI

Terminal window
# Authentification
sanity login


# Vérification
sanity manage whoami

5. Configuration VS Code

5.1. Extensions recommandées

Extension Usage
Astro Support Astro
Sanity Support Sanity
Tailwind CSS IntelliSense Support Tailwind
ESLint Linting
Prettier Formatting
GitLens Git amélioré

5.2. Configuration .vscode/settings.json

{
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "files.associations": {
    "*.astro": "astro"
  }
}

6. Lancement du serveur de développement

6.1. Build local

Terminal window
# Build du projet
npm run build


# Preview local
npm run preview

6.2. Développement local

Terminal window
# Serveur de développement
npm run dev

Le site sera accessible sur http://localhost:4321.

7. Tests

7.1. Lancer les tests

Terminal window
# Tests unitaires
npm run test


# Tests E2E
npm run test:e2e

7.2. Linting

Terminal window
# Linting
npm run lint


# Type checking
npm run typecheck

8. Workflow Git

8.1. Créer une branche

Terminal window
# Se mettre sur develop
git checkout develop


# Pull les dernières modifications
git pull origin develop


# Créer une branche feature
git checkout -b feature/slice-X-tache

8.2. Commiter les modifications

Terminal window
# Ajouter les fichiers
git add .


# Commiter
git commit -m "feat: description de la modification"


# Pusher
git push origin feature/slice-X-tache

8.3. Créer une Pull Request

  1. Aller sur GitHub
  2. Cliquer sur “New Pull Request”
  3. Sélectionner la branche feature/slice-X-tache vers develop
  4. Remplir le template de PR
  5. Soumettre pour review

9. Déploiement local (Wrangler)

9.1. Déploiement staging

Terminal window
# Déploiement staging
wrangler pages deploy dist --project-name=votre-projet-staging

9.2. Logs en temps réel

Terminal window
# Logs du worker
wrangler tail

10. Sanity Studio local

10.1. Lancer le Studio

Terminal window
# Lancer le Studio
npm run sanity:dev

Le Studio sera accessible sur http://localhost:3333.

11. Dépannage

11.1. Problèmes courants

Symptôme Cause probable Solution
npm install échoue Version Node.js incompatible Mettre à jour Node.js
wrangler login échoue Permissions insuffisantes Vérifier les permissions Cloudflare
Variables d’environnement non chargées Fichier .env manquant Créer le fichier .env
Build échoue Dépendances manquantes npm install

11.2. Ressources

12. Checklist de validation1/2

Avant de commencer le développement, vérifier :

  • Node.js 20+ installé
  • Git installé
  • VS Code installé
  • Wrangler CLI installé
  • Sanity CLI installé
  • Repository cloné
  • Dépendances installées

12. Checklist de validation2/2

  • Variables d’environnement configurées
  • Authentification Cloudflare réussie
  • Authentification Sanity réussie
  • Serveur de développement fonctionne
  • Tests passent
  • Linting passe

13. Prochaines étapes

Une fois le setup local terminé :

  1. Lire le guide de contribution (CONTRIBUTING.md)
  2. Lire la méthodologie de développement (Standard-operating-procedure.md)
  3. Consulter l’ordre des slices (Phase0-Ordre-Slices.md)
  4. Commencer par Slice 1 : Schéma Sanity “page”

14. Support

En cas de problème :

15. Historique des modifications

Date Version Description Auteur
YYYY-MM-DD 1.0 Création initiale [Nom]
Switch to normal mode

Contents

Built with StarlightPowered by Cloudflare