turbomac

프로젝트 세부 사항 : 너겟 기사

기술 스택

• 다음 .js 13
  • Zustand
  • 테일 윈드 CSS
  • 프레이머 모션
• Nest.js
  • 프리즘
  • MySQL
• socket.io
• 터보 로포
• 터 밥
• Netlify

도구 라이브러리 :

• Daisyui
• @neodrag/react
• ahooks

프로젝트 장점

• TypeScript 전체 스택 개발
• 최신 기술 (Next.js 13, Turbopack, RSC) 실습을 기반으로합니다.
• Turborepo는 프로젝트 구조를 관리합니다
• 구성 요소 개발, 명확한 코드 로직
• 페이지는 간단하고 우아합니다
• 풍부한 애니메이션 효과

효과 디스플레이

• 온라인 경험 : Turbomac

Topbar 상태 표시 줄 :

• 다크/라이트 모드 전환
• 전 세계적으로 ContextMenu를 추가하십시오

앱을 열고 닫습니다.

• 각 앱의 상단 범위를 드래그 및 떨어 뜨릴 수 있으며 상단 범위에서 두 번 클릭하여 확대 할 수 있습니다.

시작 패드 시작 :

• 호버 창의 4 모서리를 통해 트리거 될 수도 있습니다.

단말기

• 파일 경로로 이동하고 파일을 열 수 있습니다
• 위아래로 히스토리 명령 레코드를 전환하십시오
• 탭 키를 통해 완전한 기록
• 명령 줄에서 앱을 열거 나 닫습니다

터보 차트

• 인스턴트 메시징
• 스크롤로드
• 파일 업로드
• 전환 애니메이션

chatgpt

• OpenAI API에 액세스하고 온라인으로 chatgpt를 사용하십시오

vscode

• GitHub1과 함께 온라인 소스 코드를 봅니다

프로젝트 시작

프로젝트 소스 코드를 가져 오려면 GitHub 프로젝트 주소로 이동하십시오.

터미널은 폴더 디렉토리를 입력하고 npm install 또는 pnpm install 실행합니다.

클라이언트와 서버 폴더에서 각각 .env 파일을 만듭니다.

클라이언트/.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/

서버/.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'

CD는 서버 폴더에 들어가서 npx prisma migrate dev --name init 실행하여 데이터베이스를 초기화하고 prisma generate 실행하여 Prisma 클라이언트를 사용합니다.

클라이언트와 서버를 실행하는 두 가지 방법이 있습니다.

• (권장) 클라이언트 및 서버 폴더를 입력하여 npm run dev 또는 pnpm run dev 실행하십시오.
• 루트 디렉토리에서 turbo dev 직접 실행하십시오

실행 후 서버는 포트 8080에 있고 클라이언트는 포트 3000에 있습니다. LocalHost : 3000을 열면 페이지가 표시됩니다. 등록 된 사용자 : Postman/Apifox 및 기타 인터페이스 요청 도구로 이동, 사용자 인터페이스 등록 : http://localhost:8080/register

Turbochat에 로그인하십시오

다른 앱을 추가하는 방법