irene
afe397da3f
Make each directory answerable by path alone: src/ is what the Remotion build compiles, scripts/ is what you run by hand. Removed: - `ffmpeg.sh` — never worked; every parameter was assigned `$1`, so bake/bypass were broken from the start. Superseded by `scripts/ffmpeg_tools.py bake|still`. - `src/lrc2srt.ts` — the TypeScript port; `scripts/lrc2srt.py` is the script that was actually maintained, and it now handles the multi-timestamp cases the TS version did. - `scripts/bom-gen.ts` — superseded by `scripts/bom_gen.py`. - `scripts/ffmpegusage.txt` — legacy command notebook. Every recipe in it is now reproduced by `ffmpeg_tools.py`, including the `-map 0:v:0 -map 1:a:0 -c:v copy` mux and the FLAC `-compression_level 12` case, so it has no unique content left. Also drops the `bom-gen` alias from the dispatcher (dash-case was TypeScript naming) and documents the boundary in README.md and REMOTION-QUICKSTART.md. `npm run lint` (eslint src && tsc) passes with src/ reduced to Remotion input.
88 lines
2.9 KiB
Markdown
88 lines
2.9 KiB
Markdown
# Remotion Quickstart
|
||
|
||
## Prerequisites
|
||
|
||
- Node.js 18+
|
||
- ffmpeg installed on your system
|
||
|
||
## Getting started
|
||
|
||
```bash
|
||
npm install # install dependencies
|
||
npm run dev # start Remotion Studio
|
||
```
|
||
|
||
Remotion Studio opens at **http://localhost:3000** in your browser. If 3000 is already in use, Remotion automatically bumps to 3001, 3002, etc. — watch the terminal output for the actual port number. You can also pin a specific port:
|
||
|
||
```bash
|
||
npx remotion studio --port=3001
|
||
```
|
||
|
||
## Commands
|
||
|
||
| Command | What it does |
|
||
|----------------------|----------------------------------------------|
|
||
| `npm run dev` | Starts Remotion Studio (live preview UI) |
|
||
| `npm run build` | Bundles the project for production |
|
||
| `npx remotion render`| Renders a video from the command line |
|
||
| `npx remotion upgrade` | Upgrades all Remotion packages to latest |
|
||
|
||
## Remotion Studio
|
||
|
||
`npm run dev` starts the Studio — a browser-based editor where you can:
|
||
|
||
- Preview compositions in real time
|
||
- Scrub through frames
|
||
- Change props and see changes instantly
|
||
- Render videos from the browser
|
||
|
||
The Studio auto-reloads on file changes. No manual refresh needed.
|
||
|
||
## Project structure
|
||
|
||
```
|
||
.
|
||
├── src/ # Remotion input — compiled by tsc/Remotion
|
||
│ ├── index.ts # Entry point — calls registerRoot()
|
||
│ ├── Root.tsx # React root component
|
||
│ └── Composition.tsx # Composition definitions (placeholder)
|
||
├── scripts/ # Operator tooling — Python, stdlib only
|
||
│ ├── tools.py # Dispatcher: python3 scripts/tools.py --help
|
||
│ ├── ffmpeg_tools.py # mux / bake / still / strip / probe
|
||
│ ├── lrc2srt.py # LRC → SRT
|
||
│ ├── srt2ass.py # SRT → ASS (the step before baking)
|
||
│ ├── bom_gen.py # Bill of materials for untracked assets
|
||
│ └── hwprobe.py # What this machine can actually encode
|
||
├── package.json # Remotion + React + Tailwind deps
|
||
├── remotion.config.ts # CLI config (rspack, jpeg output format)
|
||
└── tsconfig.json # TypeScript (strict, ES2018)
|
||
```
|
||
|
||
`src/` and `scripts/` do not mix: the former is what the video build compiles, the
|
||
latter is what you run by hand.
|
||
|
||
## Compositions
|
||
|
||
Compositions are defined in `src/Composition.tsx`. Each has:
|
||
|
||
- **id** — unique name
|
||
- **durationInFrames** — length in frames
|
||
- **fps** — frames per second
|
||
- **width/height** — resolution
|
||
|
||
The placeholder is 1280×720 at 30fps, 60 frames (2 seconds).
|
||
|
||
## Rendering a video
|
||
|
||
```bash
|
||
npx remotion render src/index.ts MyComp out/video.mp4
|
||
```
|
||
|
||
Replace `MyComp` with your composition ID. The output goes to `out/`.
|
||
|
||
## Next steps
|
||
|
||
- [Remotion docs](https://www.remotion.dev/docs)
|
||
- [Compositions guide](https://www.remotion.dev/docs/the-introduction-video)
|
||
- [Props guide](https://www.remotion.dev/docs/props)
|