Skip to content

Latest commit

 

History

History
79 lines (55 loc) · 1.64 KB

README.md

File metadata and controls

79 lines (55 loc) · 1.64 KB
Raw

Features:

  • Tailwind design
  • Tailwind animations and effects
  • Full responsiveness
  • Clerk Authentication (Email, Google, 9+ Social Logins)
  • Client form validation and handling using react-hook-form
  • Server error handling using react-toast
  • Image Generation Tool (Open AI)
  • Video Generation Tool (Replicate AI)
  • Conversation Generation Tool (Open AI)
  • Music Generation Tool (Replicate AI)
  • Page loading state
  • Stripe monthly subscription
  • Free tier with API limiting
  • How to write POST, DELETE, and GET routes in route handlers (app/api)
  • How to fetch data in server react components by directly accessing database (WITHOUT API! like Magic!)
  • How to handle relations between Server and Child components!
  • How to reuse layouts
  • Folder structure in Next 13 App Router

Prerequisites

Node version 18.x.x

Install packages

npm i

Setup .env file

NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/dashboard
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/dashboard

OPENAI_API_KEY=

REPLICATE_API_TOKEN=

STRIPE_SECRET_KEY=

NEXT_PUBLIC_APP_URL=

STRIPE_WEBHOOK_SECRET=

NEXT_PUBLIC_CRISP_WEBSITE_ID=

DATABASE_URL=

Setup Prisma

Add MySQL Database (I used PlanetScale)

npx prisma db push

Start the app

npm run dev

Available commands

Running commands with npm npm run [command]

command description
dev Starts a development instance of the app