Zum Inhalt springen

Manuelle Einrichtung

Der schnellste Weg, eine neue Saasfly-Site zu erstellen, ist die Verwendung von create saasfly , wie im Installationshandbuch gezeigt.

System Anforderungen

  • Node.js - 18.17 oder später.
  • Bun - 1.0 oder später.
  • OS - macOS, Windows (einschließlich WSL) und Linux werden unterstützt.

Übrigens empfehlen wir die Verwendung von NVM (Node Version Manager) , um verschiedene Versionen von Node.js auszuführen.

1. Manuelle Installation

Um manuell eine neue Saasfly-App zu erstellen, sind nur wenige Schritte erforderlich:

Fork- und Clone-Repository von GitHub

Bitte öffnen Sie https://github.com/saasfly/saasfly und forken Sie dieses Repository.

Ein Fork ist eine Kopie eines Repositorys. Durch das Forken eines Repositorys können Sie frei mit Änderungen experimentieren, ohne das ursprüngliche Projekt zu beeinträchtigen.

Klonen Sie das gegabelte Repository (ersetzen Sie bitte <your_username> durch Ihren GitHub-Kontonamen):

Terminal-Fenster
git clone https://github.com/<your_username>/saasfly.git

Sie werden den Vorgang des Klonens sehen:

remote: Enumerating objects: 402, done.
remote: Counting objects: 100% (402/402), done.
remote: Compressing objects: 100% (298/298), done.
remote: Total 402 (delta 77), reused 386 (delta 65), pack-reused 0
Receiving objects: 100% (402/402), 963.18 KiB | 130.00 KiB/s, done.
Resolving deltas: 100% (77/77), done.

Installieren Sie die Abhängigkeiten

Für ein besseres Erlebnis verwenden Sie bitte Bun (So installieren Sie Bun) anstelle von npm oder yarn.

Verwenden von bun zum Installieren der Abhängigkeiten:

Terminal-Fenster
bun i

Es kann mehrere Minuten dauern und dann sehen Sie:

+ @saasfly/api@workspace:packages/api
+ @saasfly/auth@workspace:packages/auth
+ @saasfly/common@workspace:packages/common
+ @saasfly/db@workspace:packages/db
+ @saasfly/eslint-config@workspace:tooling/eslint-config
+ @saasfly/nextjs@workspace:apps/nextjs
+ @saasfly/prettier-config@workspace:tooling/prettier-config
+ @saasfly/stripe@workspace:packages/stripe
+ @saasfly/tailwind-config@workspace:tooling/tailwind-config
+ @saasfly/typescript-config@workspace:tooling/typescript-config
+ @saasfly/ui@workspace:packages/ui
+ @turbo/[email protected] (v1.12.4 available)
+ [email protected] (v1.12.4 available)
1296 packages installed [1133.89s]

Prisma-Typen generieren

Bitte stellen Sie sicher, dass Sie sich im Saasfly-Ordner befinden, und verwenden Sie dann Bun, um Prisma-Typen zu generieren:

Terminal-Fenster
cd packages/db/
bun db:generate

Ausgabe:

✔ Generated Kysely types(1.7.1) to./ prisma in 1.32s

2. Saasfly starten

Um den Server auszuführen, sollten Sie die folgenden Listen befolgen.

Einrichten der Umgebungsvariablen

Rufen Sie den Ordner „saasfly“ auf, duplizieren Sie die Datei .env.example , benennen Sie sie in .env.local um und geben Sie Ihre Variablen ein.

Terminal-Fenster
cd saasfly
cp .env.example .env.local

Stellen Sie sicher, dass Sie über eine Postgres-Datenbank verfügen (Wenn Sie keine Postgres-Datenbank haben, klicken Sie hier) und eine neue Datenbank erstellt haben.

POSTGRES_URL muss in Ihrer .env.local-Datei enthalten sein:

# Formatbeispiel
# POSTGRES_URL="postgres://{USER}:{PASSWORD}@{DB_HOST}:{DB_PORT}/{DATABASE}"
POSTGRES_URL="postgres://postgres:[email protected]:5432/saasfly"

Verwenden Sie dann bun , um Datenbanktabellen zu erstellen:

Terminal-Fenster
bun db:push

Ausgabe:

🚀 Your database is now in sync with your Prisma schema. Done in 151ms
┌─────────────────────────────────────────────────────────┐
│ Update available 5.9.1 -> 5.10.2 │
│ Run the following to update │
│ npm i --save-dev prisma@latest │
│ npm i @prisma/client@latest │
└─────────────────────────────────────────────────────────┘

Wenn etwas schiefgelaufen ist, können Sie mit uns über Discord sprechen, wir beantworten gerne alle Fragen zu Saasfly.

Führen Sie zuerst den Build aus

Da für einige grundlegende Komponenten eine Kompilierungszeit erforderlich ist, sollten Sie zuerst run build .

Terminal-Fenster
bun run build

Ausführen des Entwicklungsservers

Verwenden Sie bun run , um Ihren Webserver zu starten:

Terminal-Fenster
bun run dev:web
@saasfly/nextjs:dev: cache bypass, force executing ad8bea47f156e113
@saasfly/nextjs:dev: $ bun with-env next dev
@saasfly/nextjs:dev: $ dotenv -e ../../.env.local -- next dev
@saasfly/nextjs:dev: ▲ Next.js 14.1.0
@saasfly/nextjs:dev: - Local: http://localhost:3000
@saasfly/nextjs:dev:
@saasfly/nextjs:dev: automatically enabled Fast Refresh for 1 custom loader
@saasfly/nextjs:dev: ✓ Ready in 12.1s

Wenn alles gut geht, sollte Saasfly Ihr Projekt jetzt unter http://localhost:3000 bereitstellen und Sie können das Ergebnis sehen:

Installation

Herzlichen Glückwunsch! Jetzt können Sie mit der Programmierung beginnen, um Ihr SaaS zu erstellen.

Wenn Sie neu bei Saasfly sind, finden Sie in der Projektstruktur-Dokumentation einen Überblick über alle möglichen Dateien und Ordner in Ihrer Anwendung.

Mit Stripe arbeiten

Bitte lesen Sie den Artikel Stripe. Und verwenden Sie dann bun dev, um mit Stripe zu arbeiten:

Terminal-Fenster
bun dev