Template: LLM-based Code Generation #5998
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
ASchwad
changed the title
|
@ASchwad is attempting to deploy a commit to the Remotion Team on Vercel. A member of the Team first needs to authorize it. |
| }); | ||
|
|
||
| if (!response.ok) { | ||
| throw new Error(`API error: ${response.status}`); |
There was a problem hiding this comment.
We get back a 500 error code if you did not enter a API key. Can we properly handle this (not 500) and propagate the error to the frontend, instructing the user that they need to set an API key?
Like for your example:
The environment variable "OPENAI_API_KEY" is not set. Add it to your
.envfile and try again.
| promoBanner: { | ||
| width: 1280, | ||
| height: 720, | ||
| src: '/img/code-generation-template.png', |
There was a problem hiding this comment.
This file doesn't seem to exist.
| contributedBy: null, | ||
| }, | ||
| { | ||
| homePageLabel: 'Code Generation', |
There was a problem hiding this comment.
Can we call the template "Prompt to Motion graphics"?
And the slug and folder name is prompt-to-motion-graphics and template-prompt-to-motion-graphics
While it is longer, it is more descriptive of the use case and aligns with the other template template-prompt-to-video
Also happy to hear better name suggestions!
| repoName: 'template-code-generation', | ||
| description: 'AI-powered code generation for Remotion', | ||
| longerDescription: | ||
| 'A template that uses AI to generate Remotion video code from prompts.', |
There was a problem hiding this comment.
| 'A template that uses AI to generate Remotion video code from prompts.', | |
| 'A SaaS template for "Prompt to Motion Graphics" products. Generates Remotion code, streams it to the frontend, and compiles and previews it in the browser.', |
| }); | ||
|
|
||
| export const defaultMyCompProps: z.infer<typeof CompositionProps> = { | ||
| title: "Next.js and Remotion", |
There was a problem hiding this comment.
Probably this can be removed
|
|
||
| @custom-variant dark (&:is(.dark *)); | ||
|
|
||
| :root { |
There was a problem hiding this comment.
Can you check what parts of this are actually necessary and which ones are dead code?
We also don't seem to have light/dark theme support, so the variant can probably be removed
| /> | ||
| <Composition | ||
| id="NextLogo" | ||
| component={NextLogo} |
There was a problem hiding this comment.
NextLogo composition can probably be removed
| useVideoConfig, | ||
| } from "remotion"; | ||
|
|
||
| export const TextFade: React.FC<{ |
There was a problem hiding this comment.
Unused component (also remove all related code)
| const { fps } = useVideoConfig(); | ||
| // Text content - easily customizable | ||
| const WORDS = ["One sec please :)", "Getting started", "with your", "Code Generation"]; |
There was a problem hiding this comment.
This is cute, maybe too cute 😄
The user may be confused and think this is the output animation since it has a Play button and is animated.
Can we replace it with a boring, ordinary spinner?
2 participants
A Next.js starter template that utilizes an LLM to generate Remotion code, allowing users to preview and edit the output directly in the browser.
Requirements