add-expert
This skill automates the process of adding new experts to the Remotion experts page. It handles image uploads, structured data entry (such as name, social links, and description), and the automatic generation of expert cards, ensuring content consistency and reducing manual errors. With this skill, users can efficiently update the expert list without needing deep knowledge of the codebase, thereby accelerating content publishing and website maintenance.
npx skills add https://github.com/remotion-dev/remotion --skill add-expertBefore / After Comparison
1 组Before this skill, developers had to manually upload expert images to specific directories, edit TSX files to add structured data, and manually run commands to generate expert cards. This process was tedious and prone to issues like incorrect paths or inconsistent data formats, consuming significant time.
This skill automates the entire expert information entry process. Developers only need to provide the necessary information, and this Skill automatically handles image placement, data formatting, and card generation, significantly reducing manual operations and potential errors, greatly improving efficiency and accuracy.
Steps
-
Add the expert's photo to both:
packages/docs/static/img/freelancers/<firstname>.pngpackages/promo-pages/public/img/freelancers/<firstname>.png
The image should be a square headshot (PNG format). Both paths must have the same file.
-
Add an entry to the
expertsarray inpackages/promo-pages/src/components/experts/experts-data.tsx:{ slug: 'firstname-lastname', name: 'First Last', image: '/img/freelancers/<firstname>.png', website: 'https://example.com' | null, x: 'twitter_handle' | null, github: 'github_username' | null, linkedin: 'in/linkedin-slug/' | null, email: 'email@example.com' | null, videocall: 'https://cal.com/...' | null, since: new Date('YYYY-MM-DD').getTime(), description: ( <div> A short description of the expert's work and specialties. Links to projects can be included with <a> tags. </div> ), },sinceshould be set to today's dateslugmust be lowercase, hyphenated version of the name- Set unused social fields to
null - The entry goes at the end of the
expertsarray (before the closing])
-
Render the expert card by running in
packages/docs:bun render-cardsThis generates
packages/docs/static/generated/experts-<slug>.png. Verify it says "Rendered experts-<slug>" (not "Existed").
User Reviews (0)
Write a Review
No reviews yet
Statistics
User Rating
Rate this Skill