Aller à l'article
Aniq-UI

VelraLancer l'agence en local

Lancer l'agence en local

Installez et démarrez chaque application avec Node.js et Yarn, un terminal par application.

Pour le pack Full Stack

Avant de commencer : installez Node.js 22 ou plus récent et lancez corepack enable une fois (sous Node.js 25 et plus récent, qui n'inclut plus Corepack, lancez d'abord npm install -g corepack). Aucun serveur de base de données n'est nécessaire.

Voir la configuration requise

Ouvrez chaque terminal là où les commandes ci-dessous l'attendent : dans velra-real-estate-full-stack pour la pile complète, ou à côté du dossier de l'application pour un pack à application unique.

ApplicationDossierAdresse
APIback-endlocalhost:8000Local
Site publicstorefrontlocalhost:3030Local
Tableau de bord de l'agenceadmin-dashboardlocalhost:3031Local

Démarrez l'API en premier : les deux frontends lisent toutes leurs données à partir de l'API.

Démarrez l'API

  1. Installez et configurez

    .env.example fonctionne tel quel pour le développement local : SQLite sur le port 8000.

    Terminal
    corepack enable
    cd back-end
    yarn install
    cp .env.example .env
    Un problème ?
  2. Créez la base de données

    yarn seed vérifie que chaque photo du seed est présente, puis crée database.sqlite, ses tables et l'agence de démonstration : 31 permissions, les rôles Super Admin et Agent, les deux comptes, 11 paramètres d'agence, 6 quartiers, 17 biens (15 publiés, 2 brouillons) avec 38 photos de galerie, 2 aperçus de mise en scène approuvés, 5 demandes et 8 demandes de visite. Le relancer n'ajoute que ce qui manque et ne réinitialise jamais un mot de passe.

    Terminaldans back-end
    yarn seed
  3. Démarrez le serveur

    Terminaldans back-end
    yarn dev

    Résultat attendu: localhost:8000/api/healthLocal répond avec "status":"ok" et "database":"up".

    Un problème ?

Démarrez l'API

  1. Installez et configurez

    .env.example fonctionne tel quel pour le développement local : SQLite sur le port 8000.

    Terminal
    corepack enable
    cd velra-backend
    yarn install
    cp .env.example .env
    Un problème ?
  2. Créez la base de données

    yarn seed vérifie que chaque photo du seed est présente, puis crée database.sqlite, ses tables et l'agence de démonstration : 31 permissions, les rôles Super Admin et Agent, les deux comptes, 11 paramètres d'agence, 6 quartiers, 17 biens (15 publiés, 2 brouillons) avec 38 photos de galerie, 2 aperçus de mise en scène approuvés, 5 demandes et 8 demandes de visite. Le relancer n'ajoute que ce qui manque et ne réinitialise jamais un mot de passe.

    Terminaldans velra-backend
    yarn seed
  3. Démarrez le serveur

    Terminaldans velra-backend
    yarn dev

    Résultat attendu: localhost:8000/api/healthLocal répond avec "status":"ok" et "database":"up".

    Un problème ?

Démarrez le site public

Dans un deuxième terminal :

  1. Installez et configurez

    Le .env copié fait pointer le site vers l'API sur le port 8000.

    Terminal
    cd storefront
    yarn install
    cp .env.example .env
  2. Démarrez l'application

    Terminaldans storefront
    yarn dev

    Résultat attendu: localhost:3030Local ouvre le site en anglais avec les annonces de démonstration ; l'arabe est sur /ar.

    Un problème ?

Démarrez le site public

L'API ne fait pas partie de ce pack. Démarrez-la en premier ; le .env copié l'attend sur http://localhost:8000/api.

  1. Installez et configurez

    Si votre API tourne ailleurs, définissez NEXT_PUBLIC_API_BASE_URL dans .env avec son adresse, /api compris.

    Terminal
    corepack enable
    cd velra-website
    yarn install
    cp .env.example .env
    Un problème ?
  2. Démarrez l'application

    Terminaldans velra-website
    yarn dev

    Résultat attendu: localhost:3030Local ouvre le site avec les annonces de votre API ; l'arabe est sur /ar.

    Un problème ?

Démarrez le tableau de bord de l'agence

Dans un troisième terminal :

  1. Installez et configurez

    Le .env copié fait pointer le tableau de bord vers l'API et ses notifications en direct sur le port 8000.

    Terminal
    cd admin-dashboard
    yarn install
    cp .env.example .env
  2. Démarrez-le et connectez-vous

    yarn dev copie d'abord le worker de la bibliothèque de cartes dans public/maplibre/, puis démarre le tableau de bord.

    Terminaldans admin-dashboard
    yarn dev

    Résultat attendu: localhost:3031Local ouvre le formulaire de connexion. Connectez-vous avec admin@velra.example et le mot de passe Admin@123.

    Un problème ?

Démarrez le tableau de bord de l'agence

L'API ne fait pas partie de ce pack. Démarrez-la en premier ; le .env copié l'attend sur http://localhost:8000/api.

  1. Installez et configurez

    Si votre API tourne ailleurs, définissez dans .env NEXT_PUBLIC_API_BASE_URL (avec /api) et NEXT_PUBLIC_WEBSOCKET_BASE_URL (sans) avec son adresse.

    Terminal
    corepack enable
    cd velra-agency-dashboard
    yarn install
    cp .env.example .env
    Un problème ?
  2. Démarrez-le et connectez-vous

    Terminaldans velra-agency-dashboard
    yarn dev

    Résultat attendu: localhost:3031Local ouvre le formulaire de connexion. Connectez-vous avec admin@velra.example et le mot de passe Admin@123, qu'une API avec seed accepte.

    Un problème ?

Autres ports

Sans Docker, les ports sont fixés dans les fichiers. Les scripts dev et start du site, dans package.json, passent -p 3030, et ceux du tableau de bord -p 3031 : changez le nombre à cet endroit pour en déplacer un, puis ajoutez la nouvelle adresse à CORS_ORIGIN dans le .env de l'API, et pour le tableau de bord définissez-y aussi FRONTEND_URL avec cette adresse. Pour déplacer l'API, définissez PORT et PUBLIC_MEDIA_URL dans son .env avec le même nombre, ainsi que NEXT_PUBLIC_API_BASE_URL dans les deux frontends (et NEXT_PUBLIC_WEBSOCKET_BASE_URL du tableau de bord).

Build de production

Les mêmes dossiers, construits une fois puis démarrés. Commencez par régler le .env de l'API pour la production : avec NODE_ENV=production, l'API ne modifie jamais les tables au démarrage, et elle refuse de démarrer tant que JWT_SECRET est vide ou encore à la valeur de l'exemple, ou tant que CORS_ORIGIN est vide.

Le .env de l'API
NODE_ENV=production
JWT_SECRET=paste-the-generated-secret-here
CORS_ORIGIN=http://localhost:3030,http://localhost:3031
FRONTEND_URL=http://localhost:3031
PUBLIC_MEDIA_URL=http://localhost:8000/media

Générez le secret avec node -e "console.log(require('crypto').randomBytes(48).toString('hex'))". Ensuite, dans le dossier de l'API, construisez-la, créez ses tables une fois et démarrez-la. yarn seed:prod ajoute l'agence de démonstration et ses comptes ; yarn db:sync:prod à sa place crée des tables vides sans compte.

Terminal
yarn build
yarn seed:prod
yarn start:prod

Build de production des frontends

Dans le dossier de chaque frontend, lancez le build une fois puis démarrez. Le site répond sur 3030 et le tableau de bord sur 3031.

Terminal
yarn build
yarn start

Les frontends compilent leur .env au moment du build : relancez donc yarn build après l'avoir modifié. Avant de déployer quoi que ce soit de public, lisez le guide de déploiement.

Repartir de données de démonstration neuves

Arrêtez l'API, puis, dans le dossier de l'API, supprimez le fichier de la base de données et recréez-la avec les données de démonstration. Cela supprime tout ce que vous avez créé.

Terminal
rm -f database.sqlite* && yarn seed

Dans PowerShell :

Terminal
Remove-Item database.sqlite*; yarn seed

Étapes suivantes

Cette page vous a-t-elle aidé ?

Vérifié sur la version 2026-10-11

Bloqué sur une étape ?

Trouvez une solution avant de tout recommencer.

Dépannage

Préférences des Cookies

Nous utilisons des cookies pour améliorer votre expérience de navigation, analyser le trafic du site et personnaliser le contenu. En cliquant sur "Accepter Tout", vous consentez à notre utilisation des cookies pour l'analyse et la publicité personnalisée.