turbomac

Projektdetails: Nuggets Artikel

Technologiestapel

• Weiter.js 13
  • Zustand
  • Rückenwind -CSS
  • Framer-Motion
• Nest.js
  • Prisma
  • Mysql
• Socket.io
• Turborepo
• Turbopack
• Netlify

Werkzeugbibliothek:

• Daisyui
• @Neodrag/React
• Ahooks

Projektvorteile

• Typscript Full Stack Development
• Basierend auf der neuesten Technologie (Next.js 13, Turbopack, RSC) Praxis
• Turborepo verwaltet die Projektstruktur
• Komponentenentwicklung, Logik der Code löschen
• Die Seite ist einfach und elegant
• Reiche Animationseffekte

Effektanzeige

• Online -Erfahrung: Turbomac

Topbar -Statusleiste:

• Dunkel-/Lichtmodus -Schalten
• Fügen Sie ContextMenu weltweit hinzu

Öffnen und schließen Sie die App:

• Der obere Bereich jeder App kann gezogen und fallen gelassen werden und doppelklick

Start Start StartedPad:

• Es kann auch durch 4 Ecken des Schwebfensters ausgelöst werden

Terminal

• Sie können zum Dateipfad springen und die Datei öffnen
• Schalten Sie den historischen Befehlsaufzeichnung durch Auf- und Ab -Tasten wechseln
• Vervollständigen Sie den Verlauf durch die Registerkartenschlüssel
• Öffnen oder schließen Sie die App in der Befehlszeile

Turbochat

• Instant Messaging
• Scrollenlast
• Datei -Upload
• Übergangsanimation

Chatgpt

• Zugriff auf die OpenAI -API und verwenden Sie Chatgpt online

VSCODE

• Quellcode online mit GitHub1s anzeigen

Projektstart

Gehen Sie zur GitHub -Projektadresse, um den Projektquellcode zu ziehen.

Das Terminal betritt das Ordnerverzeichnis und führt npm install oder pnpm install aus

Erstellen Sie .EnV -Dateien in den Client- und Serverordnern

Client/.env

 NEXT_PUBLIC_OPENAI_API_KEY= 你自己的 OpenAI Key
NEXT_PUBLIC_NODE_ENV= dev

# 部署到服务器相关
# NEXT_PUBLIC_HOST = 例如https://175.24.18:8080/
# NEXT_PUBLIC_WEBSOCKET = 例如https://175.24.18:81/

Server/.env

 # 部署上线 mysql
# DATABASE_URL= "mysql://ljq:[email protected]:3306/my_mac"
# 本地mysql 将自己的 usernamepassworddatabase名字换入
DATABASE_URL= "mysql://username:password@localhost:3306/database"
# 下面为腾讯云 ID 和 KEY 填入自己的信息
TX_SECRET_ID = 'AKID8J....'
TX_SECRET_KEY = 'vaz81....'
# COS 存储桶
TX_BUCKET = 'turbomac-13093...'
TX_REGION = 'ap-shanghai'

Die CD gibt den Serverordner ein, führt npx prisma migrate dev --name init um die Datenbank zu initialisieren, und führt prisma generate , um den Prisma -Client zu verwenden.

Es gibt zwei Möglichkeiten, Client und Server auszuführen: Server:

• (Empfohlen) Geben Sie die Client- und Server -Ordner ein, um npm run dev oder pnpm run dev auszuführen
• Führen Sie turbo dev direkt im Stammverzeichnis aus

Nach dem Ausführen befindet sich der Server auf Port 8080 und der Client befindet sich auf Port 3000. Open Localhost: 3000 und Sie sehen die Seite. Registrierter Benutzer: Gehen Sie zu Postman/Apifox- und anderen Schnittstellenanforderungen Tools, Register User Interface: http://localhost:8080/register

Melden Sie sich bei Turbochat an

So fügen Sie andere Apps hinzu