Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/bouzayenilyes/lingo
Build a Duolingo Clone With Nextjs, React, Drizzle, Stripe
https://github.com/bouzayenilyes/lingo
drizzle nextjs reactjs stripe
Last synced: 21 days ago
JSON representation
Build a Duolingo Clone With Nextjs, React, Drizzle, Stripe
- Host: GitHub
- URL: https://github.com/bouzayenilyes/lingo
- Owner: bouzayenilyes
- Created: 2024-03-15T16:48:35.000Z (9 months ago)
- Default Branch: main
- Last Pushed: 2024-03-19T00:42:38.000Z (9 months ago)
- Last Synced: 2024-03-19T01:48:21.323Z (9 months ago)
- Topics: drizzle, nextjs, reactjs, stripe
- Language: TypeScript
- Homepage: https://lingo-xi.vercel.app
- Size: 548 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Build a Duolingo Clone With Nextjs, React, Drizzle, Stripe (2024)
This is a repository for a "Build a Duolingo Clone With Nextjs, React, Drizzle, Stripe (2024)
Key Features:
- 🌐 Next.js 14 & server actions
- 🗣 AI Voices using Elevenlabs AI
- 🎨 Beautiful component system using Shadcn UI
- 🎭 Amazing characters thanks to KenneyNL
- 🔐 Auth using Clerk
- 🔊 Sound effects
- ❤️ Hearts system
- 🌟 Points / XP system
- 💔 No hearts left popup
- 🚪 Exit confirmation popup
- 🔄 Practice old lessons to regain hearts
- 🏆 Leaderboard
- 🗺 Quests milestones
- 🛍 Shop system to exchange points with hearts
- 💳 Pro tier for unlimited hearts using Stripe
- 🏠 Landing page
- 📊 Admin dashboard React Admin
- 🌧 ORM using DrizzleORM
- 💾 PostgresDB using NeonDB
- 🚀 Deployment on Vercel
- 📱 Mobile responsiveness
### Prerequisites
**Node version 14.x**
### Cloning the repository
```shell
git clone https://github.com/bouzayenilyes/lingo.git
```
### Install packages
```shell
npm i
```
### Setup .env file
```js
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=""
CLERK_SECRET_KEY=""
DATABASE_URL="postgresql://..."
STRIPE_API_KEY=""
NEXT_PUBLIC_APP_URL="http://localhost:3000"
STRIPE_WEBHOOK_SECRET=""
```
### Setup Drizzle ORM
```shell
npm run db:push
```
### Seed the app
```shell
npm run db:seed
```
or
```shell
npm run db:prod
```
### Start the app
```shell
npm run dev
```