add-expert
この Skill は、Remotion のエキスパートページに新しいエキスパートを追加するプロセスを自動化します。画像アップロード、構造化データ入力(名前、ソーシャルリンク、説明など)、およびエキスパートカードの自動生成を処理し、コンテンツの一貫性を確保し、手動エラーを削減します。この Skill を使用することで、ユーザーはコードベースの詳細な知識なしにエキスパートリストを効率的に更新でき、コンテンツ公開とウェブサイトのメンテナンスを加速します。
npx skills add https://github.com/remotion-dev/remotion --skill add-expertBefore / After 効果比較
1 组この Skill がない場合、開発者はエキスパート画像を特定のディレクトリに手動でアップロードし、TSX ファイルを編集して構造化データを追加し、手動でコマンドを実行してエキスパートカードを生成する必要がありました。このプロセスは煩雑で、パスの間違いやデータ形式の不整合により問題が発生しやすく、多くの時間を費やしていました。
この Skill は、エキスパート情報入力プロセス全体を自動化します。開発者は必要な情報を提供するだけで、この Skill が画像の配置、データフォーマット、カード生成を自動的に処理し、手動操作と潜在的なエラーを大幅に削減し、効率と正確性を大幅に向上させます。
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").
ユーザーレビュー (0)
レビューを書く
レビューなし
統計データ
ユーザー評価
この Skill を評価