Aller à l'article
Aniq-UI

NorthstackLancer Northstack en local

Lancer Northstack en local

Lancez votre pack sur votre ordinateur, avec Docker.

Pour le pack Full Stack

DockerRecommandéInstallation manuelle

Avant de commencer : installez et ouvrez Docker Desktop, ou Docker Engine avec Compose.

Voir la configuration requise

  1. Téléchargez votre template

    Ouvrez Mes templates et téléchargez le ZIP correspondant à votre pack.

    Résultat attendu: Un fichier nommé comme northstack-full-stack-….zip se trouve dans vos téléchargements.

  2. Décompressez et ouvrez le dossier

    Ouvrez un terminal là où se trouve le ZIP, extrayez-le et placez-vous dans le dossier northstack-full-stack. Sous Windows, vous pouvez plutôt l'extraire dans l'Explorateur de fichiers, puis ouvrir un terminal dans le dossier.

    Terminal
    unzip -q northstack-full-stack-*.zip
cd northstack-full-stack
ls

    Résultat attendu: Le dossier contient back-end, dashboard, website et docker-compose.yml, à côté de README.md, QUICKSTART.md et LICENSE.md.

    Un problème ?

  3. Démarrez les applications

    Construisez et démarrez l'API, le site public et le tableau de bord de l'espace de travail. Rien n'a besoin d'être configuré avant. Le premier démarrage construit trois images et remplit la base avec les espaces de travail d'exemple, ce qui prend quelques minutes ; les démarrages suivants prennent quelques secondes.

    Terminaldans northstack-full-stack
    docker compose up --build

    Un port est déjà utilisé ?

    Si le démarrage s'arrête avec ports are not available, address already in use ou port is already allocated, un autre programme utilise 3030, 3031 ou 8000. Arrêtez-le, ou créez un fichier nommé .env dans le dossier northstack-full-stack, à côté de docker-compose.yml, avec le port voulu, par exemple ADMIN_PORT=3041 (SITE_PORT pour le site, API_PORT pour l'API). Relancez docker compose up --build et ouvrez l'application sur son nouveau port.

    Un port est déjà utilisé

    Résultat attendu: Les trois services restent actifs et le journal cesse de défiler. Laissez ce terminal ouvert.

    Un problème ?

  4. Ouvrez le site public

    Ouvrez localhost:3030Local. L'anglais est sur /en et l'arabe sur /ar. Le site n'a pas de comptes propres : ses boutons Live demo ouvrent la connexion du tableau de bord.

    Résultat attendu: Le site s'ouvre sur sa page d'accueil. La page des tarifs vend les deux licences par le paiement du site, qui ne débite personne tant que l'API n'a pas de clés de paiement.

    Un problème ?

  5. Se connecter au tableau de bord

    Ouvrez localhost:3031Local. Connectez-vous avec owner@northstack.example et le mot de passe NorthstackDemo26!. Chaque compte du seed utilise ce mot de passe ; changez-les avant que la pile soit accessible depuis Internet.

    Résultat attendu: Le tableau de bord s'ouvre sur la vue d'ensemble de l'espace de travail de Forma Studio, avec ses projets, l'usage du mois, le graphique d'activité des projets et la checklist de lancement.

    Un problème ?

Faites le tour

À quoi ressemble l'espace de travail d'exemple une fois que tout fonctionne.

CompteE-mailEmplacement
Propriétaire de Forma Studio : chaque page et action de l'espace de travail, la facturation, la matrice des rôles et la suppression de l'espace ; aussi admin de Monogramowner@northstack.exampleTableau de bord
Admin : les projets, l'équipe et les invitations, les paramètres de l'espace, les clés d'API et le journal d'activité ; les rôles en lecture seule, pas de facturationadmin@northstack.exampleTableau de bord
Membre : les projets et les tâches, et l'assistant ; l'équipe, les rôles et les paramètres en lecture, pas de facturationmember@northstack.exampleTableau de bord
Facturation : l'abonnement, les changements de formule et les factures ; l'équipe, les rôles et les paramètres en lecture ; pas de projets (la vue d'ensemble les omet aussi) et pas d'assistantbilling@northstack.exampleTableau de bord
Admin de la plateforme : chaque organisation, utilisateur, membre du personnel, rôle de la plateforme et paramètreplatform@northstack.exampleTableau de bord
Support : chaque page de la plateforme en lecture seule, et les exports de rapportssupport@northstack.exampleTableau de bord

Chaque compte se connecte avec le mot de passe NorthstackDemo26!. Ce sont uniquement des comptes de démonstration locaux : sur un serveur, partez à vide avec SEED_SAMPLE_DATA=false et votre propre admin de la plateforme (Démarrer à vide).

Le seed ajoute Forma Studio avec la formule Pro, 12 projets et leurs tableaux de tâches, 8 membres, 2 invitations en attente, trois factures, une clé d'API, l'activité des dernières semaines et trois conversations passées avec l'assistant, ainsi qu'un second espace de travail, Monogram, auquel le propriétaire passe depuis le sélecteur d'espace. Derrière l'administration de la plateforme, il y a 732 organisations en tout, si bien que chaque liste et chaque chiffre s'ouvrent bien remplis. Un nouveau compte créé sur la page d'inscription passe par l'onboarding et crée son propre espace de travail.

Arrêter et redémarrer

Appuyez sur Ctrl+C dans le terminal pour arrêter les applications, ou lancez ceci depuis le dossier northstack-full-stack. Vos données, la base et les fichiers téléversés, sont conservées dans le volume northstack-data.

Terminaldans northstack-full-stack
docker compose down

Redémarrez avec la même commande qu'à l'étape 3. Sans --build, elle réutilise les images déjà construites.

Terminaldans northstack-full-stack
docker compose up

Conserver vos données

docker compose down -v supprime aussi le volume de données. Le démarrage suivant génère une copie neuve des espaces de travail d'exemple, et tout ce que vous aviez créé a disparu.

Lancer le site public

Ce pack est le site public, seul. Sans API, il fonctionne sur ses données d'exemple intégrées : le formulaire de contact et le paiement des licences répondent dans votre navigateur, et rien n'est envoyé nulle part. Pour utiliser plutôt l'API Northstack, construisez-le avec l'adresse de l'API. L'API est un pack séparé et n'est pas dans ce téléchargement.

  1. Téléchargez votre template

    Ouvrez Mes templates et téléchargez le ZIP SaaS Website.

  2. Décompressez et ouvrez le dossier

    Terminal
    unzip -q northstack-website-*.zip
cd northstack-website
ls

    Résultat attendu: Le dossier contient un Dockerfile, un package.json et le guide QUICKSTART.md.

    Un problème ?

  3. Construisez l'image

    Seul, sans API : le NEXT_PUBLIC_API_BASE_URL vide construit le site sur ses données d'exemple.

    Terminaldans northstack-website
    docker build -t northstack-website --build-arg NEXT_PUBLIC_API_BASE_URL= .

    Avec l'API Northstack sur http://localhost:8000/api et le tableau de bord sur http://localhost:3031, construisez sans arguments :

    Terminaldans northstack-website
    docker build -t northstack-website .

    Avec votre propre API et vos propres domaines, les valeurs NEXT_PUBLIC_* sont compilées dans le JavaScript que charge le navigateur, ce sont donc des arguments de build :

    Terminaldans northstack-website
    docker build -t northstack-website --build-arg NEXT_PUBLIC_SITE_URL=https://www.your-domain.com --build-arg NEXT_PUBLIC_API_BASE_URL=https://api.your-domain.com/api --build-arg NEXT_PUBLIC_DASHBOARD_URL=https://app.your-domain.com .
    Un problème ?

  4. Démarrez l'application

    Si le port 3030 est pris, changez le nombre à gauche de -p, par exemple -p 3040:3030, et ouvrez plutôt ce port. Avec une API, construisez aussi avec NEXT_PUBLIC_SITE_URL=http://localhost:3040, et ajoutez cette adresse au CORS_ORIGIN et au WEBSITE_URL de l'API.

    Terminaldans northstack-website
    docker run -p 3030:3030 northstack-website

    Résultat attendu: localhost:3030Local ouvre le site. L'anglais est sur /en, l'arabe sur /ar. Construit sans API, un avis Sample data en bas de chaque page le signale.

    Un problème ?

Avec une API sur votre ordinateur, dans le conteneur localhost désigne le conteneur lui-même. Le navigateur atteint toujours l'API, mais pour que le paiement et son reçu soient complets quand le serveur les rend, indiquez au serveur du site où se trouve l'API. --add-host fait fonctionner host.docker.internal sous Linux ; Docker Desktop l'a déjà.

Terminaldans northstack-website
docker run -p 3030:3030 -e API_INTERNAL_URL=http://host.docker.internal:8000/api --add-host=host.docker.internal:host-gateway northstack-website

Lancer le tableau de bord de l'espace de travail

Ce pack est le tableau de bord de l'espace de travail, seul. Sans API, il fonctionne sur ses données d'exemple intégrées dans votre navigateur, où n'importe quel mot de passe permet de se connecter. Pour utiliser plutôt l'API Northstack, construisez-le avec l'adresse de l'API. L'API est un pack séparé et n'est pas dans ce téléchargement.

  1. Téléchargez votre template

    Ouvrez Mes templates et téléchargez le ZIP Workspace Dashboard.

  2. Décompressez et ouvrez le dossier

    Terminal
    unzip -q northstack-dashboard-*.zip
cd northstack-dashboard
ls

    Résultat attendu: Le dossier contient un Dockerfile, un package.json et le guide QUICKSTART.md.

    Un problème ?

  3. Construisez l'image

    Seul, sans API : le NEXT_PUBLIC_API_BASE_URL vide construit le tableau de bord sur ses données d'exemple.

    Terminaldans northstack-dashboard
    docker build -t northstack-dashboard --build-arg NEXT_PUBLIC_API_BASE_URL= .

    Avec l'API Northstack sur http://localhost:8000/api (ses mises à jour en direct sur http://localhost:8000) et le site sur http://localhost:3030, construisez sans arguments :

    Terminaldans northstack-dashboard
    docker build -t northstack-dashboard .

    Avec votre propre API et vos propres domaines, indiquez les adresses par lesquelles le navigateur les atteint :

    Terminaldans northstack-dashboard
    docker build -t northstack-dashboard --build-arg NEXT_PUBLIC_API_BASE_URL=https://api.your-domain.com/api --build-arg NEXT_PUBLIC_BASE_URL=https://app.your-domain.com --build-arg NEXT_PUBLIC_WEBSITE_URL=https://www.your-domain.com .
    Un problème ?

  4. Démarrez-le et connectez-vous

    Si le port 3031 est pris, changez le nombre à gauche de -p, par exemple -p 3041:3031, et ouvrez plutôt ce port. Avec une API, construisez aussi avec NEXT_PUBLIC_BASE_URL=http://localhost:3041, ajoutez cette adresse au CORS_ORIGIN de l'API, et définissez-la comme DASHBOARD_URL et FRONTEND_URL de l'API.

    Terminaldans northstack-dashboard
    docker run -p 3031:3031 northstack-dashboard

    Résultat attendu: localhost:3031Local ouvre le formulaire de connexion. Sur les données d'exemple, n'importe quel mot de passe permet de se connecter, et owner@northstack.example ouvre l'espace de travail du propriétaire. Avec une API initialisée, connectez-vous avec owner@northstack.example et le mot de passe NorthstackDemo26!.

    Un problème ?

Lancer l'API

Ce pack est l'API NestJS seule, sur un fichier SQLite gardé dans un volume Docker, northstack-api-data, avec les fichiers téléversés. Le site public et le tableau de bord de l'espace de travail sont des packs séparés et ne sont pas dans ce téléchargement.

  1. Téléchargez votre template

    Ouvrez Mes templates et téléchargez le ZIP API backend.

  2. Décompressez et ouvrez le dossier

    Terminal
    unzip -q northstack-backend-*.zip
cd northstack-backend
ls

    Résultat attendu: Le dossier contient un Dockerfile, un docker-entrypoint.sh, un package.json et le guide QUICKSTART.md.

    Un problème ?

  3. Construisez l'image

    Terminaldans northstack-backend
    docker build -t northstack-api .
    Un problème ?

  4. Démarrez-la avec les données d'exemple

    Un nouveau volume est initialisé une seule fois avec les espaces de travail d'exemple et les comptes ci-dessous, puis chaque démarrage suivant conserve ce qui s'y trouve. Sur un serveur, partez plutôt à vide avec -e SEED_SAMPLE_DATA=false (Démarrer à vide). Si le port 8000 est pris, changez le nombre à gauche de -p, par exemple -p 8010:8000, et ajoutez -e PUBLIC_API_URL=http://localhost:8010 -e PUBLIC_MEDIA_URL=http://localhost:8010/media pour que les liens qu'elle écrit (médias, téléchargements de factures) utilisent aussi le nouveau port. Vos frontends doivent alors pointer vers http://localhost:8010/api.

    Terminaldans northstack-backend
    docker run -p 8000:8000 -v northstack-api-data:/data northstack-api

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

    Un problème ?

Les comptes du seed sont owner@northstack.example, admin@northstack.example, member@northstack.example, billing@northstack.example, platform@northstack.example et support@northstack.example, tous avec le mot de passe NorthstackDemo26!. Connectez-vous avec POST /api/auth/login, ou depuis un tableau de bord Northstack.

Le conteneur accepte le site sur http://localhost:3030 et le tableau de bord sur http://localhost:3031. Pour d'autres adresses, passez CORS_ORIGIN (les deux, séparées par une virgule), FRONTEND_URL et DASHBOARD_URL (le tableau de bord) et WEBSITE_URL (le site) avec -e. Passez vos clés de la même façon, seulement celles dont vous avez besoin :

Terminaldans northstack-backend
docker run -p 8000:8000 -v northstack-api-data:/data -e GOOGLE_API_KEY=your-key northstack-api

Ne passez pas --env-file .env avec une copie de .env.example : il définit NODE_ENV=development par-dessus la valeur de production par défaut de l'image, ce qui permet à l'API de modifier seule le schéma de la base à chaque démarrage. Sans JWT_SECRET à vous, ou avec celui de l'exemple, le conteneur génère un secret et le garde dans le volume, si bien que les connexions survivent à un redémarrage.

Pour repartir de données d'exemple neuves, supprimez d'abord le conteneur (docker rm -f avec son nom), puis le volume avec docker volume rm northstack-api-data.

Étapes suivantes

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.