Configuration manuelle

Le moyen le plus rapide de créer un nouveau site Saasfly est d’utiliser create saasfly comme indiqué dans le guide d’installation.

Configuration requise

Node.js - 18.17 ou version ultérieure.
Bun - 1.0 ou version ultérieure.
OS - macOS, Windows (y compris WSL) et Linux sont pris en charge.

Au fait, nous vous recommandons d’utiliser NVM (Node Version Manager) pour exécuter différentes versions de Node.js.

1. Installation manuelle

Pour créer manuellement une nouvelle application Saasfly, il suffit de suivre quelques étapes :

Fork et cloner le référentiel depuis GitHub

Veuillez ouvrir https://github.com/saasfly/saasfly et forker ce référentiel.

Un fork est une copie d’un dépôt. Le fork d’un dépôt vous permet d’expérimenter librement des modifications sans affecter le projet d’origine.

Clonez le référentiel forké (veuillez remplacer <your_username> par le nom de votre compte GitHub) :

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

Vous verrez la procédure de clonage :

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.

Installer les dépendances

Pour une meilleure expérience, veuillez utiliser Bun (Comment installer Bun), au lieu de npm ou yarn.

Utiliser bun pour installer les dépendances :

bun i

Cela peut prendre plusieurs minutes, puis vous verrez :

+ @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]
+ [email protected]
+ [email protected] (v1.12.4 available)
+ [email protected]

1296 packages installed [1133.89s]

Générer des types de prisma

Veuillez vous assurer que vous êtes dans le dossier saasfly, puis utilisez bun pour générer les types Prisma :

cd packages/db/
bun db:generate

Sortir:

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

2. Démarrer Saasfly

Vous devez suivre les listes ci-dessous pour exécuter le serveur.

Configurer les variables d’environnement

Entrez dans le dossier saasfly, dupliquez le fichier .env.example, renommez-le en .env.local et entrez vos variables.

cd saasfly
cp .env.example .env.local

Assurez-vous d’avoir une base de données Postgres (Si vous n’avez pas de Postgres, cliquez ici) et d’avoir créé une nouvelle base de données.

POSTGRES_URL doit figurer dans votre fichier .env.local :

# Exemple de format
# POSTGRES_URL="postgres://{USER}:{PASSWORD}@{DB_HOST}:{DB_PORT}/{DATABASE}"

POSTGRES_URL="postgres://postgres:[email protected]:5432/saasfly"

Ensuite, utilisez bun pour créer des tables de base de données :

bun db:push

Sortir:

🚀  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                          │
└─────────────────────────────────────────────────────────┘

Si quelque chose ne va pas, vous pouvez nous en parler sur Discord, nous serons heureux de répondre à tout ce qui concerne Saasfly.

Exécutez d’abord la construction

Étant donné que certains composants de base sont nécessaires à la compilation, vous devez d’abord run build.

bun run build

Exécuter le serveur de développement

Utilisez bun run pour démarrer votre serveur Web :

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

Si tout se passe bien, Saasfly devrait maintenant diffuser votre projet sur http://localhost:3000, et vous pouvez voir le résultat :

Félicitations ! Vous pouvez désormais commencer à coder pour créer votre SaaS.

Si vous êtes nouveau sur Saasfly, consultez la documentation structure du projet pour un aperçu de tous les fichiers et dossiers possibles dans votre application.

Courez avec Stripe

Veuillez lire l’article Stripe. Puis utilisez bun dev pour exécuter avec Stripe :

bun dev