spuneiartur
24 verified skills24 total stars
public-endpoint-builder
Create public (unauthenticated) API endpoints for existing Express.js + MongoDB resources. Generates list and detail controllers with aggregation pipelines, and wires them into the public routes file. Use this skill whenever the user wants to add a public endpoint, create a storefront/frontend API, expose a resource publicly, add a public route, or says things like "I need a public page for products" or "create a frontend API for articles" or "add a public list endpoint for reviews".
development1
crud-resource-scaffolder
Scaffold a complete CRUD resource for an Express.js + MongoDB API. Generates all files — model, validation schema, filter, controllers, routes, and barrel exports — in one shot. Use this skill whenever the user wants to add a new resource, create CRUD endpoints, scaffold an entity, add a new model, or says things like "I need a new collection for X" or "create endpoints for X". Even if the user only mentions a model or a single endpoint, this skill ensures the full resource is scaffolded correctly.
development1
admin-crud-scaffold
Scaffold a complete admin CRUD feature with all required files: API service, validation models, table columns, admin pages (list/add/edit), admin components (header, table, filters, actions cell), and form components (shared form, add form, edit form). Use this skill whenever the user wants to add a new admin section, create CRUD pages, scaffold entity management, add an admin table, build admin forms for a new resource, or mentions "scaffold", "generate", "create admin pages for", "add management for", or "CRUD for [entity]". This is the most common development pattern in the project — trigger it proactively when the user describes any new entity that needs admin management.
development1
brand-guidelines
Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having Anthropic's look-and-feel. Use it when brand colors or style guidelines, visual formatting, or company design standards apply.
development1
reference-field-manager
Manage embedded reference fields between Express.js + MongoDB resources. Creates Mongoose ref schemas, Yup ref schemas, trail update/remove functions, usage check configs, and wires up normalizeDropdownValues middleware. Use this skill whenever the user wants to add a relationship between models, embed a reference, link two resources, add a dropdown field that references another model, or says things like "product should reference category" or "add author to articles". This skill prevents the data integrity bugs that come from missing any part of the reference lifecycle.
development1
api-hook-wiring
Create API service modules and wire them up with React Query hooks (useQuery, useMutation, useInfiniteQuery) for data fetching, mutations, and paginated lists. Use this skill whenever the user needs to connect a frontend feature to a backend API, add data fetching to a page or component, set up mutations for form submissions, create API service functions, add infinite scrolling, or wire up any client-server data flow. Trigger on: "fetch data", "API call", "connect to backend", "mutation", "infinite scroll", "paginated list", "data fetching", "useQuery", "useMutation", or when the user describes any feature that reads or writes data.
tools1
component-factory
Create reusable React components following the project's conventions for naming, file structure, barrel exports, Tailwind styling, and hook patterns. Use this skill whenever the user wants to create a new component, add a UI element, build a feature section, create a card/modal/widget, add a table cell renderer, or organize components into feature directories. Trigger on: "create component", "add a component", "new component", "build a widget", "create a card", "add a section", or when the user describes any reusable UI element that needs to be created.
development1
frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.
development1
custom-hook
Create custom React hooks following the project's conventions for naming, file structure, and barrel exports. Use this skill whenever the user needs to add a reusable hook, create a custom data-fetching hook, encapsulate stateful logic, add a utility hook, or extract repeated logic into a hook. Trigger on: "create hook", "custom hook", "useXxx", "add a hook", "extract into a hook", or when the user describes reusable stateful logic that should be shared across components.
tools1
seo-strategy
Unified SEO skill with three modes: Article/Page Optimization, Full Website Audit, and Next.js SEO Implementation. MODE 1 — ARTICLE/PAGE SEO OPTIMIZATION: Use this mode whenever the user shares an article, blog post, draft, page content, or a URL to a single page and mentions SEO, search optimization, ranking, or Google — or even when they just say "check this article", "optimize this", or "improve this" without explicitly saying SEO. Also trigger when the user pastes or attaches article text and asks you to review, improve, rewrite, or polish it for publishing. Trigger phrases include: "optimize this article", "SEO optimize this", "improve this for SEO", "optimize this page", "rewrite for SEO", "check this article", "improve this content", "make this rank", "SEO this". When in doubt, lean toward activating this mode — it's better to offer SEO optimization than to miss the opportunity. MODE 2 — FULL WEBSITE AUDIT: Use this mode whenever the user asks for a full website SEO audit, site-wide SEO strategy, multi-page SEO analysis, SEO health check, website audit, site audit, domain SEO review, or wants to understand their overall website SEO performance. Trigger phrases include: "audit my site", "SEO strategy for my website", "check my website SEO", "full SEO audit", "multi-page SEO", "site SEO", "website SEO review", "SEO health check", "site audit", "domain audit", or when the user provides a root URL and asks for SEO help. This mode crawls multiple pages across a website and produces a comprehensive HTML report with site-wide analysis, cross-page patterns, architecture review, and prioritized strategy. MODE 3 — NEXT.JS SEO IMPLEMENTATION: Use this mode whenever the user asks to implement SEO in their Next.js project, set up meta tags, configure next-seo, add structured data, generate a sitemap, configure robots.txt, or implement any technical SEO feature in code. Trigger phrases include: "implement SEO", "add SEO to my pages", "set up next-seo", "add meta tags", "structured data", "JSON-LD", "sitemap", "robots.txt", "canonical URLs", "OpenGraph setup", or when the user is working in a Next.js codebase and asks about SEO implementation rather than content optimization. Read `references/nextjs-seo-patterns.md` for project-specific code patterns.
development1
theme-factory
Toolkit for styling artifacts with a theme. These artifacts can be slides, docs, reportings, HTML landing pages, etc. There are 10 pre-set themes with colors/fonts that you can apply to any artifact that has been creating, or can generate a new theme on-the-fly.
tools1
scroll-stop-prompter
Generates AI image and video prompts for scroll-stopping content. Creates three linked prompts: (1) a clean product/object shot on white background at 16:9, (2) an exploded/deconstructed version of the same object, and (3) a video transition prompt that animates between assembled and deconstructed states. Works with any AI image generator (Higgsfield, Midjourney, etc.) and any video model (Runway, Kling, Pika, etc.). Delivers prompts via a gorgeous HTML page with one-click copy buttons and confetti. Trigger when the user says "scroll-stop prompt", "deconstruction prompt", "exploded view prompt", "product animation prompt", or asks for prompts to create scroll-stopping video content from object imagery.
tools1
form-builder
Build forms using React Hook Form with Yup validation, following the project's HookForm component system and Field components. Use this skill whenever the user needs to create a form (contact, settings, login, data entry, filters, any form), add form validation, use the project's Field/HookForm components, create filter forms, or build any data input interface. Also trigger when the user mentions "form", "validation", "Yup schema", "fields", "input fields", "form submission", or wants to collect user data through a UI.
development1
page-scaffold
Create new Next.js pages following the project's Pages Router conventions, including public-facing pages with SEO, admin-protected pages with auth, and dynamic routes. Use this skill whenever the user wants to add a new route, create a new page, add a public page, create an admin page, add a landing page, or set up a new URL endpoint. Trigger on: "new page", "add route", "create page", "landing page", "add a page at /...", or when the user describes any new URL that needs to exist in the application.
testing1
webapp-testing
Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs.
tools1
scroll-stop-builder
Takes a video file (e.g. a product deconstruction/assembly animation) and builds a beautiful, performant website with scroll-driven animation. The video plays forward/backward as the user scrolls, creating a mesmerizing scroll-stopping effect. Uses frame extraction via FFmpeg, canvas-based rendering, and modern scroll-driven animation techniques. Includes: animated starscape background, annotation cards with snap-stop scroll, specs section with count-up animations, navbar with scroll-to-pill transform, loader, and full mobile responsiveness. Trigger when the user says "scroll-stop build", "scroll animation website", "scroll-driven video", "build the scroll-stop site", or provides a video file and asks to make it scroll-controlled. Also trigger if the user mentions "Apple-style scroll animation" or "video on scroll".
development1
db-seed-generator
Generate database seed files and one-off import/migration scripts for an Express.js + MongoDB API. Creates numbered seed runners in db/seeds/ and standalone scripts in scripts/. Use this skill whenever the user wants to create seed data, import data from CSV or JSON, write a migration script, populate the database, do a bulk update, or says things like "seed the database with test data" or "import products from this JSON" or "write a script to reset all user passwords".
development1
website-speed-audit
Comprehensive website performance audit and optimization skill. Identifies and automatically fixes performance issues including image optimization, video compression, lazy loading, Core Web Vitals, bundle size, and rendering strategy. Uses Lighthouse (via CLI or MCP when available), ffmpeg for media processing, and the project's existing Image component with blur-up lazy loading. Use this skill whenever the user mentions: website speed, page load time, performance audit, Core Web Vitals, Lighthouse, optimize images, compress videos, lazy loading, LCP, CLS, FID, INP, slow website, speed up, performance optimization, image compression, video optimization, blur placeholder, WebP conversion, media audit, bundle size, or wants to improve their website's loading performance. Also trigger when the user says "my site is slow", "optimize for speed", "reduce load time", "improve performance", or asks about image/video optimization in any context.
tools1
canvas-design
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.
documentation1
web-artifacts-builder
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.
tools1
skill-creator
Create new skills, modify and improve existing skills, and measure skill performance. Use when users want to create a skill from scratch, edit, or optimize an existing skill, run evals to test a skill, benchmark skill performance with variance analysis, or optimize a skill's description for better triggering accuracy.
testing1
template-skill
Replace with description of the skill and when Claude should use it.
tools1
template-skill
Replace with description of the skill and when Claude should use it.
tools1
skill-creator
Create new skills, modify and improve existing skills, and measure skill performance. Use when users want to create a skill from scratch, edit, or optimize an existing skill, run evals to test a skill, benchmark skill performance with variance analysis, or optimize a skill's description for better triggering accuracy.
testing1