Ship in 5 minuten

1. Bereid uw computer voor en open het project

Voltooi eerst Voordat u begint: accepteer de GitHub-uitnodiging, installeer Node.js 22 of nieuwer, Git, een editor en Corepack, en kloon vervolgens uw webrepository of de All Platforms-monorepo. Open de map supastack in de editor en selecteer Terminal → Nieuwe terminal. U zou package.json moeten zien in de bestandslijst op het hoogste niveau van de editor. Alle onderstaande opdrachten worden uitgevoerd vanuit de root van deze repository.

Hiermee start u de lokale demonstratie zonder accounts bij AI-, facturerings- of e-mailproviders en zonder Docker. Houd rekening met extra tijd voor het downloaden van afhankelijkheden bij de eerste keer. Volg in de volgende stappen alleen het Windows-blok of alleen het macOS/Linux-blok; voer ze niet allebei uit.

• Installeer de tools en ontvang de code
• Leer hoe u een opdracht uitvoert en een bestand bewerkt
• Of laat een agent de installatie voor u uitvoeren

2. Maak configuratiebestanden – macOS / Linux

Voer in uw terminal elke regel hieronder uit. Met de eerste kopie wordt .env gemaakt voor latere migratieopdrachten. De tweede maakt apps/web/.env.local aan, die de webserver daadwerkelijk leest. Beide bevatten de lokale instellingen van het voorbeeld. Als een van beide bestemmingsbestanden al bestaat, bewaar het dan en sla de kopieeropdracht over; overschrijf de opgeslagen instellingen niet. Windows-gebruikers gebruiken in plaats daarvan de volgende sectie.

corepack pnpm install downloadt de bibliotheken die de app nodig heeft. Als Corepack vraagt ​​om pnpm te downloaden, antwoord dan y. Wacht tot het klaar is en de terminalprompt terugkeert. Een laatste Done-bericht zonder foutmelding betekent dat u kunt doorgaan.

cp .env.example .env
cp .env.example apps/web/.env.local
corepack pnpm install

2. Configuratiebestanden maken — Windows PowerShell

Gebruik deze opdrachten in PowerShell vanuit de map met package.json. Als .env of apps/web/.env.local al bestaat, sla dan de kopieerregel over en behoud uw instellingen. Wacht tot de installatie is voltooid voordat u de server start. Als de uitvoering van het script wordt geblokkeerd, gebruik dan corepack.cmd in plaats van corepack, zoals uitgelegd in Voordat u begint.

Copy-Item .env.example .env
Copy-Item .env.example apps/web/.env.local
corepack pnpm install

3. Start de webserver – laat deze terminal open staan

Voer de onderstaande opdracht uit vanuit de root van de repository. Het start alleen de webapp, dus het werkt zowel in de webrepository als in de monorepo van All Platforms. Wacht tot de terminal Local: http://localhost:3000 en Ready weergeeft. Het compileren van de eerste pagina kan iets langer duren. De terminal zou moeten blijven draaien; dat wordt verwacht.

In de monorepo All Platforms start corepack pnpm dev samen de beschikbare ontwikkelwerkruimten. Als apps/docs aanwezig is, gebruikt die aparte documenten-app http://localhost:3001.. De openbare handleidingen die u leest, maken deel uit van de webapp op http://localhost:3000/docs.. U hebt geen poort 3001 nodig om deze tutorial te volgen.

corepack pnpm --filter @supastack/web dev

4. Open de app en voltooi één lokale taak

Open http://localhost:3000 in de adresbalk van uw browser om de startpagina te bekijken. Open vervolgens http://localhost:3000/dashboard.. Behoud de vooraf ingevulde naam en het e-mailadres, of voer uw eigen testwaarden in en klik op Start local reference flow. Hierdoor ontstaat een demonstratiewerkruimte in het geheugen; er wordt geen permanent account aangemaakt en er wordt geen echte e-mail verzonden.

Open in de demonstratie AI task vanuit de zijbalk, voer een kort verzoek in, zoals Vat de lokale acceptatiecriteria samen, en klik op Queue local task. Wanneer de status in de wachtrij staat, klikt u op Run local task en vervolgens op View result. U zou voltooide uitvoer en een Email queued-status moeten zien. De AI-reactie is opzettelijk nep en herhaalbaar; de e-mail in de wachtrij is lokaal. Als u de server opnieuw opstart, worden deze demonstratiegegevens gewist.

Om /auth te gebruiken voor echte aanmelding, start u eerst Postgres en past u migraties toe met behulp van de database- en migratiehandleiding. Daarna kunnen aanmeldings- of OTP-berichten van EMAIL_PROVIDER=local worden ingezien op http://localhost:3000/mail-preview;, ze bereiken geen externe inbox. Bij mobiel inloggen wordt ook gebruik gemaakt van deze door een database ondersteunde authenticatie, in plaats van de demonstratiesessie.

• Postgres en permanente accounts toevoegen

5. Stop, start opnieuw en los veelvoorkomende problemen bij de eerste keer opstarten op

Succes betekent dat de startpagina wordt geladen, de lokale werkruimte wordt geopend en een taak in de wachtrij wordt voltooid. Wanneer u klaar bent, klikt u op de serverterminal en drukt u op Ctrl + C. Om later verder te gaan, opent u een terminal in de hoofdmap van de repository opnieuw en herhaalt u de serveropdracht vanaf stap 3; u hoeft de afhankelijkheden niet elke keer opnieuw te installeren.

Als localhost:3000 niet wordt geopend, controleer dan of de serverterminal nog actief is en Ready weergeeft. Als poort 3000 in gebruik is, stop dan de andere ontwikkelserver met Ctrl + C en probeer het opnieuw. Als u na het openen van /auth een databasefout ziet, ga dan terug naar /dashboard voor de demonstratie of voltooi de databasehandleiding. Als de lokale demonstratie ontbreekt, controleer dan APP_ENV=local, AI_PROVIDER=fake, BILLING_PROVIDER=local, EMAIL_PROVIDER=local en JOB_PROVIDER=local in apps/web/.env.local en start vervolgens opnieuw op.

Om de naam en marketingtekst aan te passen, opent u apps/web/src/marketing/site-config.ts in de editor. Volg Branding voor de exacte velden en verificatiestappen. Voor de weergave-instellingen van het echte account voltooit u eerst de database-instellingen en opent u vervolgens /settings/appearance. Geautomatiseerde acceptatieopdrachten duren langer dan deze eerste uitvoering; vind ze onder Werkruimteopdrachten.

• Een fout bij eerste uitvoering oplossen
• Wijzig de naam van uw product en kopieer