https://github.com/yasinmahmoudi/screen-recorder
A recording and sharing video app
https://github.com/yasinmahmoudi/screen-recorder
arcjet better-auth bunnynet drizzle-orm neondb nextjs nextjs16 tailwindcss typescript
Last synced: 3 months ago
JSON representation
A recording and sharing video app
- Host: GitHub
- URL: https://github.com/yasinmahmoudi/screen-recorder
- Owner: YasinMahmoudi
- Created: 2025-10-26T15:12:41.000Z (9 months ago)
- Default Branch: main
- Last Pushed: 2025-11-10T01:49:50.000Z (9 months ago)
- Last Synced: 2025-11-10T03:23:20.211Z (9 months ago)
- Topics: arcjet, better-auth, bunnynet, drizzle-orm, neondb, nextjs, nextjs16, tailwindcss, typescript
- Language: TypeScript
- Homepage: https://capterra.vercel.app
- Size: 4.01 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ⏺️ Capterra - screen recording app
This app helps you to record , upload and also share your videos across the platform with others . 😍
## 📷 Screenshots
## 🚀 Demo
[Click here to see demo](https://capterra.vercel.app)
## ⚙️ Tech Stack
![]()
![]()
![]()
## ✨ Features
👉 **Screen Recording**: Capture your screen directly within the app .
👉 **Authentication**: Secure user auth with Better-Auth & Google provider.
👉 **Arcjet Integration**: Implement bot protection, rate limiting, email validation for enhancing the app security.
👉 **Modern Tech Stack**: Built with Next.js 16 for a fast, production-ready web app.
👉 **Share Videos**: Share videos via unique links for easy access and distribution.
👉 **Database Integration**: Utilize Neon for manage data in database.
👉 **Type-Safe Queries**: Using Drizzle ORM’s type-safe queries for secure and efficient database interactions.
👉 ** Respovive Design **: Fully responsive design for all sceens and devices .
## 🛠️ Installation
Clone the project
```bash
git clone https://github.com/YasinMahmoudi/screen-recorder.git
```
Go to the project directory
```bash
cd screen-recorder
```
Install the project dependencies using pnpm :
```bash
pnpm install
```
Set Up Environment Variables
Create a new file named `.env` in the root of your project and add the following content \
Or use `.env.example` provided in the root directory :
# BASE URL
NEXT_PUBLIC_BASE_URL=http://localhost:3000
#BETTER AUTH
BETTER_AUTH_SECRET=
BETTER_AUTH_URL=http://localhost:3000
#GOOGLE
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
# Recommended for most uses
DATABASE_URL=
# For uses requiring a connection without pgbouncer
DATABASE_URL_UNPOOLED=
# Parameters for constructing your own connection string
PGHOST=
PGHOST_UNPOOLED=
PGUSER=
PGDATABASE=
PGPASSWORD=
# Parameters for Vercel Postgres Templates
POSTGRES_URL=postgresql:
POSTGRES_URL_NON_POOLING=
POSTGRES_USER=
POSTGRES_HOST=
POSTGRES_PASSWORD=
POSTGRES_DATABASE=
POSTGRES_URL_NO_SSL=postgresql:
POSTGRES_PRISMA_URL=postgresql:
# Neon Auth environment variables for Next.js
NEXT_PUBLIC_STACK_PROJECT_ID=
NEXT_PUBLIC_STACK_PUBLISHABLE_CLIENT_KEY=
STACK_SECRET_SERVER_KEY=
#BUNNY
BUNNY_STORAGE_ACCESS_KEY=
BUNNY_LIBRARY_ID=
BUNNY_STREAM_ACCESS_KEY=
#ARCJET
ARCJET_KEY=
Start the server
```bash
pnpm dev
```