https://github.com/Just-Moh-it/Remotion-Template-NextJS
(WIP) A secure & opinionated NextJS template for Remotion v4
https://github.com/Just-Moh-it/Remotion-Template-NextJS
nextjs nextjs-template remotion remotion-template remotion-v4 shadcn-ui typescript
Last synced: about 1 month ago
JSON representation
(WIP) A secure & opinionated NextJS template for Remotion v4
- Host: GitHub
- URL: https://github.com/Just-Moh-it/Remotion-Template-NextJS
- Owner: Just-Moh-it
- License: other
- Archived: true
- Created: 2023-05-15T08:53:52.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-08-06T23:49:24.000Z (about 2 years ago)
- Last Synced: 2025-08-17T06:26:50.726Z (about 2 months ago)
- Topics: nextjs, nextjs-template, remotion, remotion-template, remotion-v4, shadcn-ui, typescript
- Language: TypeScript
- Homepage: https://remotion-template-nextjs.vercel.app
- Size: 186 KB
- Stars: 24
- Watchers: 2
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
- awesome-shadcnui - Github - template-nextjs.vercel.app) | โ 24 | (Boilerplates & Starters)
README
๐ฆ A Fully-Featured Remotion+Next.JS Starter Template
## ๐ฆ Features
- โก๏ธ **NextJS 13** - Uses all the bleeding-edge features of NextJS 13
- ๐ **Server Actions** - APIs are abstracted, invoke and poll renders with typesafety
- ๐ **App Directory** - Create layouts and new pages delightfully
- ๐จ **TailwindCSS** - Uses TailwindCSS for styling app and videos
- ฦ **Remotion Lambda** - Uses Remotion Lambda for rendering videos at scale
- ๐ฑ **Supports Multiple Video Dimensions** - Change the aspect ratio of your videos using the app
- ๐ฆ **Fully-Featured** - Uses all the features of Remotion
- ๐ **TypeScript+Validation** - Uses TypeScript for type safety and Zod for validation
## ๐ Quickstart
### 1. Generate a repo using this template
Click on the `Use this template` button on the top of the page to create a new repo using this template.
### 2. Install dependencies
```bash
pnpm add
```
### 3. Create `.env` file
Copy the `.env.example` file to `.env` and fill in the values.
```config
REMOTION_AWS_ACCESS_KEY_ID=
REMOTION_AWS_SECRET_ACCESS_KEY=
```
### 4. Deploy lambda
```bash
pnpm run lambda:site
pnpm run lambda:function
```
### 5. Start the app
```bash
pnpm run dev
```
This will start the app on [http://localhost:3000](http://localhost:3000).
## ๐ค๐ผ Reach out
Having trouble? Unsure of something? Feel free to ask away in the [discussions](https://github.com/Just-Moh-it/remotion-template-nextjs/discussions).
## ๐ Inspiration
- [Kmenu](https://github.com/harshhhdev/kmenu) - Readme Template
- [Remotion's NextJS Template](https://github.com/remotion-dev/template-next/)