Ajouter un événement OpenAPI

VérifiéSûr

Créer un nouvel événement ou intervenant pour le site OpenAPI en créant un fichier YAML et en convertissant les images en WebP.

Spar Skills Guide Bot
ContenuDébutant
23/07/2026
Claude Code
#yaml-data#webp-images#events-site#static-site#data-entry

Recommandé pour

Synthèse automatique

Crée le fichier de données data/<slug>/event.yml d'un nouvel événement (ou conférence, masterclass, talk) du site OpenAPI events, en convertissant au préalable les images en WebP hébergés dans le dépôt.

Points forts

  • Fournit le schéma YAML complet des champs obligatoires et optionnels (agenda, talks, sponsors, meta SEO) avec les contraintes de cohérence comme slug = nom du dossier et permalink = /events/ + slug
  • Impose l'hébergement local des images via la conversion WebP (mode lot depuis source-images/<slug>/ ou image par image avec --kind cover/avatar) au lieu d'URL distantes
  • Inclut une étape de vérification explicite (npm run typecheck puis npm run build) et documente l'ordre d'affichage via data/events.order.yml

Limites

  • Fortement lié à l'arborescence et aux scripts npm de ce dépôt précis (convert-image, npm run img), donc non réutilisable tel quel ailleurs
  • Suppose que l'utilisateur fournit dès le départ l'image de couverture et chaque photo d'intervenant, sinon l'agent doit les réclamer
  • La validité réelle du fichier n'est confirmée que par typecheck/build, sans validation de schéma dédiée en amont
Quand l'utiliser

À utiliser quand on veut ajouter un nouvel événement ou un intervenant au site OpenAPI events à partir d'informations et d'images fournies.

Quand l'éviter

À éviter pour modifier un site d'événements qui n'utilise pas cette structure data/<slug>/event.yml ni les scripts npm de ce dépôt.

Analyse de sécurité

Sûr
Score qualité88/100

The skill is purely editorial documentation for a specific repo's event-data workflow. It instructs the agent to run existing project npm scripts (npm run img / typecheck / build) and to fetch user-supplied image URLs into the repo, which are legitimate, transparent operations — no destructive commands, no credential/secret access, no obfuscated or exfiltrating payloads, and no attempts to disable safety controls. The only mild consideration is that it invokes npm scripts and network image downloads, which is normal build tooling for this repository.

Aucun point d'attention détecté

Comment cette analyse est faite

Exemples

Add a conference
Add a new conference to the events site: 'API Days Tokyo', October 14 — 15, 2026 at Tokyo International Forum, Japan, 09:00–17:00, type Conference, status upcoming. Cover image is at https://example.com/tokyo.jpg and the speaker is Jane Doe, Staff Engineer at Acme, photo /tmp/jane.jpg.
Add a masterclass with local images
Create a masterclass entry for our online 'API Design Fundamentals' workshop on March 3, 2026. Raw files are already in source-images/api-design-fundamentals/ with cover.png and speaker photos named after each speaker — run the batch image conversion and generate the event.yml.
Add a speaker to an existing event
Add a new speaker, Marie Curie, Principal Engineer at Radium Labs, to the existing api-days-tokyo event. Her photo is at /tmp/marie.jpg — convert it to WebP and update the event.yml speakers list.

name: add-event description: Add a new event (or speaker) to the OpenAPI events site by creating data/<slug>/event.yml, with speaker avatars and the event image converted to repo-hosted WebP. Use when asked to add/create a new event, conference, masterclass, or talk to the site, or to add a speaker to an existing event.

Add an event to the OpenAPI events site

Each event is its own file: data/<event-slug>/event.yml (one event per file, discovered and bundled at build time, typed by EventItem in lib/events.ts). Adding an event = creating that file and hosting its images locally via the convert-image skill.

Steps

  1. Gather the details from the user (title, dates, location, type, times, description, speakers, image). Ask for anything missing — especially the event image and each speaker photo (local path or URL).

  2. Convert every image to a repo-hosted WebP with the convert-image skill / npm run img. Images are stored per event under public/img/events/<event-slug>/. Do not put remote URLs (unsplash/pravatar) into new entries — host them locally.

    Preferred — batch the inbox. Have the user drop raw files into source-images/<event-slug>/ (gitignored): the event image named cover.*, each speaker file named after the speaker (jane-doe.jpg), optional gallery/ subfolder. Then:

    npm run img -- --event <event-slug> --all
    

    Or one image at a time (path or URL):

    npm run img -- "<url-or-path>" --event <event-slug> --kind cover
    npm run img -- "<url-or-path>" --event <event-slug> --kind avatar --name jane-doe
    

    Use the printed /img/events/<event-slug>/... paths as the field values.

  3. Create data/<event-slug>/event.yml with the schema below (a single YAML mapping — no leading -, since it's one event per file).

  4. Ordering (optional). Events are listed by date by default (upcoming soonest-first, past most-recent-first). To pin a specific order, add the slug to data/events.order.yml — that file is the primary order source; anything not listed falls back to date order.

  5. Verify: npm run typecheck then npm run build (must emit out/ cleanly).

Schema — data/<slug>/event.yml

Required fields:

title: 'API Days Tokyo' # display name
slug: api-days-tokyo # MUST equal the folder name; used in the URL
event_date: 'October 14 — 15, 2026' # human string; em dash (—) for ranges
location: 'Tokyo International Forum, Japan'
type: 'Event' # 'Event' | 'Conference' | 'Masterclass'
status: 'upcoming' # 'active' (featured) | 'upcoming' | 'finished'
image: '/img/events/api-days-tokyo/cover.webp' # repo-hosted WebP from step 2
time_start: '09:00'
time_end: '17:00'
description: 'One-line summary of the event.'
permalink: '/events/api-days-tokyo' # must be '/events/' + slug
speakers: # [] if none (e.g. past events)
  - name: Jane Doe
    position: 'Staff Engineer | Acme'
    photo: '/img/events/api-days-tokyo/speakers/jane-doe.webp' # from step 2
tags: [event] # lowercase of type, e.g. [conference]

Optional detail-page fields (omit if not known yet):

metaTitle: 'API Days Tokyo' # SEO title override
metaDescription: 'Join us at API Days Tokyo'
sponsors:
  - name: boomi
agenda: # event-page schedule: date -> category -> sessions
  'October 14':
    'Opening and keynote':
      - title: 'Welcome'
        time: '09:00 — 09:25'
        permalink: /events/talks/tokyo-welcome # optional, links to a talk below
        speakers:
          - name: Jane Doe
            position: 'Staff Engineer | Acme'
            photo: '/img/events/api-days-tokyo/speakers/jane-doe.webp'
            tag: OAI # optional badge
talks: # individual talk pages at /events/talks/<slug>
  - slug: tokyo-welcome
    title: 'Welcome'
    description: 'Full talk description.'
    time: 'October 14, 09:00 — 09:25'
    category: 'Opening and keynote'
    speakers:
      - name: Jane Doe
        position: 'Staff Engineer | Acme'
        photo: '/img/events/api-days-tokyo/speakers/jane-doe.webp'
    schedule: # sidebar day schedule on the talk page
      - { time: '09:00', title: 'Welcome', permalink: /events/talks/tokyo-welcome }

talks[] do not repeat the event title/date — those are derived from the parent.

Field rules

  • slug — unique kebab-case, equal to the folder name; permalink must be /events/<slug>. For yearly past editions, suffix the year (e.g. api-days-tokyo-2025).
  • status — active renders as the featured card; upcoming is a normal upcoming card; finished shows on the past-events page.
  • type / tags — tags is the lowercased type in a list: Event→[event], Conference→[conference], Masterclass→[masterclass].
  • speakers — [] when none. Each needs name, position, local photo.
  • event_date — uses an em dash — (not hyphen) for ranges; match existing rows.

Adding a speaker to an existing event

Convert the avatar into that event's folder (npm run img -- "<url-or-path>" --event <event-slug> --kind avatar --name <speaker-slug>), then add an entry to that event's speakers: list in data/<event-slug>/event.yml with the printed /img/events/<event-slug>/speakers/... path. No new file.

After adding

Confirm it validates (npm run typecheck / npm run build) and tell the user the event URL (/events/<slug>). Both deploy targets pick it up: the GitHub Pages build and the Cloudflare Worker build both bundle every event.yml.

Du fichier au premier essai

Le téléchargement contient exactement le contenu affiché sur cette fiche. Cette copie peut différer de la dernière version du dépôt source.

Consulter la source et ses fichiers annexes

Ce téléchargement contient uniquement SKILL.md. Les scripts, références, modèles et dépendances éventuels ne sont pas inclus. Récupérez les fichiers nécessaires depuis la source en conservant leur arborescence avant de poursuivre.

1. Télécharger le fichier

Télécharger SKILL.md

Depuis la racine d’un projet de test, enregistrez le fichier sous .skill-downloads/add-event-to-openapi-events-mrx3xwpe/SKILL.md, ou utilisez la commande suivante. Ce dossier sert à examiner la skill avant son installation.

Commande pour macOS/Linux ou WSL : un shell POSIX et curl sont nécessaires. Sous Windows sans WSL, utilisez le bouton de téléchargement et créez le dossier manuellement.

mkdir -p '.skill-downloads/add-event-to-openapi-events-mrx3xwpe' && curl --fail --show-error --location 'https://skills-guides.com/api/skills/add-event-to-openapi-events-mrx3xwpe/download' --output '.skill-downloads/add-event-to-openapi-events-mrx3xwpe/SKILL.md.part' && mv '.skill-downloads/add-event-to-openapi-events-mrx3xwpe/SKILL.md.part' '.skill-downloads/add-event-to-openapi-events-mrx3xwpe/SKILL.md'

2. Vérifier les prérequis

Lisez SKILL.md avant de l’utiliser. Si le fichier cite des scripts ou services externes, examinez-les et préparez les accès nécessaires dans votre environnement de test.

Aucune section de prérequis reconnue dans ce fichier. Cela ne signifie pas qu’il est autonome : les bibliothèques, outils et accès peuvent être cités ailleurs dans le contenu ou dans le dépôt source.

Les plateformes de la fiche sont des indications du catalogue. Les chemins ci-dessous suivent la documentation des outils ; ils ne prouvent pas que cette skill y a été exécutée. Aucune version minimale de ces outils n’est attestée pour cette fiche.

3. Charger la skill

Après vérification, copiez le dossier complet dans le projet avec l’une des commandes ci-dessous, puis ouvrez une nouvelle session de l’outil. La commande s’arrête si un dossier du même nom existe déjà : comparez les fichiers avant de le remplacer.

Claude Code
test -f '.skill-downloads/add-event-to-openapi-events-mrx3xwpe/SKILL.md' && test -s '.skill-downloads/add-event-to-openapi-events-mrx3xwpe/SKILL.md' && mkdir -p '.claude/skills' && test ! -e '.claude/skills/add-event' && cp -R '.skill-downloads/add-event-to-openapi-events-mrx3xwpe' '.claude/skills/add-event'

OpenSkills

OpenSkills doit déjà être installé. La procédure locale install/read est contrôlée avec OpenSkills 1.5.0, qui exige Node.js ≥ 20.6.0. Aucun slug du catalogue n’est résolu automatiquement.

Installation officielle d’OpenSkills
openskills install './.skill-downloads/add-event-to-openapi-events-mrx3xwpe'

openskills read 'add-event-to-openapi-events-mrx3xwpe'

La lecture doit afficher le contenu du fichier installé et son dossier de base. Elle ne lance ni la skill ni ses dépendances.

Pour un agent qui lit AGENTS.md, synchronisez ensuite l’index. Cette commande modifie AGENTS.md : relisez le diff avant de l’utiliser.

openskills sync

Mode manuel ou autre outil : joignez SKILL.md à une conversation, ou ouvrez-le dans un agent capable de lire les fichiers. Ajoutez les ressources annexes nécessaires. Il n’existe pas de dossier universel reconnu par tous les outils.

4. Faire un premier essai

Utilisez une entrée courte et fictive : un endpoint d’API, un petit document ou un brief d’interface. Dans une nouvelle conversation, joignez le fichier ou donnez son chemin à l’agent, puis adaptez cette demande :

Lis .skill-downloads/add-event-to-openapi-events-mrx3xwpe/SKILL.md et applique ses instructions à cet exemple : [décrire une entrée de test]. Indique les fichiers, dépendances ou accès qui manquent. Produis le résultat demandé par la skill sans inventer de données ni exécuter de script non examiné.

Résultat attendu : une sortie correspondant aux instructions de la skill, ou une liste précise des prérequis manquants. Une simple confirmation de lecture ne valide pas le premier usage. Si une ressource externe est indisponible, ce parcours reste à tester.

Skills similaires