Adoption

Agent Skills are supported by leading AI development tools.

VS Code Gemini CLI GitHub Goose Amp Cursor Claude Code Letta OpenCode Claude OpenAI Codex Factory VS Code Gemini CLI GitHub Goose Amp Cursor Claude Code Letta OpenCode Claude OpenAI Codex Factory

eliferjunior/astro

Name: astro
Author: eliferjunior

.claude/skills/ts-astro/SKILL.md

npx skillsauth add eliferjunior/Claude astro

Clean

TrivyContainer and dependency vulnerability scanner

Clean

SemgrepStatic code analysis for vulnerabilities

Clean

mcp-scan (Snyk)Model Context Protocol security validation

Skipped

Snyk (dep)Open source security scanning

Skipped

Socket.devSupply chain security analysis

Skipped

VirusTotalMulti-engine malware detection

Skipped

CrowdStrikeAdvanced threat intelligence

Skipped

OSV-ScannerOpen Source Vulnerability database check

Skipped

OWASP Dep-Check

Astro

Overview

Astro is a web framework for building content-driven websites that ships zero JavaScript by default. Its island architecture hydrates only interactive components, achieving excellent Lighthouse scores while supporting React, Vue, Svelte, or any UI framework where interactivity is needed.

Instructions

When creating pages, use file-based routing in src/pages/ with .astro, .md, or .mdx files, and organize shared structure in src/layouts/.
When adding interactivity, use client directives on framework components: prefer client:visible or client:idle over client:load since most components do not need immediate hydration.
When managing content, define Content Collections in src/content/ with strict Zod schemas using defineCollection(), and query with getCollection() and getEntry().
When choosing rendering modes, default to static (SSG) for marketing and content pages, use output: "server" for dynamic pages, or use hybrid rendering with per-page export const prerender = false.
When optimizing images, use the <Image> component from astro:assets for automatic format conversion (WebP/AVIF), resizing, and lazy loading instead of raw <img> tags.
When adding page transitions, enable View Transitions with <ViewTransitions /> for SPA-like navigation without shipping a client-side router.
When integrating UI frameworks, install the appropriate integration (@astrojs/react, @astrojs/vue, @astrojs/svelte) and use Astro components for static content, reaching for framework components only when interactivity is required.

Examples

Example 1: Build a blog with Content Collections

User request: "Create an Astro blog with type-safe Markdown content"

Actions:

Define a blog Content Collection with Zod schema for frontmatter (title, date, tags, author)
Create dynamic route src/pages/blog/[slug].astro with getStaticPaths()
Build blog index page querying getCollection("blog") with sorting
Add layout with SEO meta tags, navigation, and View Transitions

Output: A statically generated blog with validated content, clean URLs, and smooth page transitions.

Example 2: Add interactive components to a static site

User request: "Add a React search component to my Astro documentation site"

Actions:

Install @astrojs/react integration
Create the React search component with state and event handling
Add the component to the page with client:idle directive
Pass static data as props from the Astro page frontmatter

Output: A documentation site that is fully static except for the interactive search island.

Guidelines

Use Astro components (.astro) for static content; only use React/Vue/Svelte when interactivity is needed.
Default to client:visible or client:idle over client:load for hydration directives.
Define Content Collections with strict Zod schemas to catch content errors at build time.
Use astro:assets <Image> over raw <img> tags for automatic optimization.
Keep layouts thin with shared <head>, navigation, and footer; put page-specific content in pages.
Use hybrid rendering: static for marketing pages, SSR only for personalized or dynamic pages.
Enable View Transitions for SPA-like navigation without shipping a router.

eliferjunior/astro

.claude/skills/ts-astro/SKILL.md

Assists with building content-driven websites using Astro's island architecture. Use when creating static sites, blogs, documentation, or marketing pages that ship zero JavaScript by default. Trigger words: astro, static site, island architecture, content collections, SSG, hybrid rendering, astro components.

development

Updated Apr 16, 2026

$ install --global

skillsauth

npx skillsauth add eliferjunior/Claude astro

Install this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.

Security Scan Results

3 of 9 scanners reported clean

Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.

Scanners Passed

Scanners in report

Clean

TrivyContainer and dependency vulnerability scanner

95%

Clean

SemgrepStatic code analysis for vulnerabilities

95%

Clean

mcp-scan (Snyk)Model Context Protocol security validation

95%

Skipped

Snyk (dep)Open source security scanning

50%

Skipped

Socket.devSupply chain security analysis

50%

Skipped

VirusTotalMulti-engine malware detection

50%

Skipped

CrowdStrikeAdvanced threat intelligence

50%

Skipped

OSV-ScannerOpen Source Vulnerability database check

50%

Skipped

OWASP Dep-Check

50%

Last scanned: Apr 17, 2026, 1:14 AM18.6s1 file scanned

SKILL.md

name:: astro
description:: >-
by default. Trigger words:: astro, static site, island architecture, content collections,
license:: Apache-2.0
compatibility:: Requires Node.js 18+
author:: terminal-skills
version:: 1.0.0
category:: development
tags:: ["astro", "static-site", "island-architecture", "ssg", "content"]

Astro

Overview

Instructions

When creating pages, use file-based routing in src/pages/ with .astro, .md, or .mdx files, and organize shared structure in src/layouts/.
When adding interactivity, use client directives on framework components: prefer client:visible or client:idle over client:load since most components do not need immediate hydration.
When managing content, define Content Collections in src/content/ with strict Zod schemas using defineCollection(), and query with getCollection() and getEntry().
When choosing rendering modes, default to static (SSG) for marketing and content pages, use output: "server" for dynamic pages, or use hybrid rendering with per-page export const prerender = false.
When optimizing images, use the <Image> component from astro:assets for automatic format conversion (WebP/AVIF), resizing, and lazy loading instead of raw <img> tags.
When adding page transitions, enable View Transitions with <ViewTransitions /> for SPA-like navigation without shipping a client-side router.
When integrating UI frameworks, install the appropriate integration (@astrojs/react, @astrojs/vue, @astrojs/svelte) and use Astro components for static content, reaching for framework components only when interactivity is required.

Examples

Example 1: Build a blog with Content Collections

User request: "Create an Astro blog with type-safe Markdown content"

Actions:

Define a blog Content Collection with Zod schema for frontmatter (title, date, tags, author)
Create dynamic route src/pages/blog/[slug].astro with getStaticPaths()
Build blog index page querying getCollection("blog") with sorting
Add layout with SEO meta tags, navigation, and View Transitions

Output: A statically generated blog with validated content, clean URLs, and smooth page transitions.

Example 2: Add interactive components to a static site

User request: "Add a React search component to my Astro documentation site"

Actions:

Install @astrojs/react integration
Create the React search component with state and event handling
Add the component to the page with client:idle directive
Pass static data as props from the Astro page frontmatter

Output: A documentation site that is fully static except for the interactive search island.

Guidelines

Use Astro components (.astro) for static content; only use React/Vue/Svelte when interactivity is needed.
Default to client:visible or client:idle over client:load for hydration directives.
Define Content Collections with strict Zod schemas to catch content errors at build time.
Use astro:assets <Image> over raw <img> tags for automatic optimization.
Keep layouts thin with shared <head>, navigation, and footer; put page-specific content in pages.
Use hybrid rendering: static for marketing pages, SSR only for personalized or dynamic pages.
Enable View Transitions for SPA-like navigation without shipping a router.

Related Skills

eliferjunior/fireworks-ai

development

VerifiedTrustedCommunity

Expert guidance for Fireworks AI, the platform for running open-source LLMs (Llama, Mixtral, Qwen, etc.) with enterprise-grade speed and reliability. Helps developers integrate Fireworks' inference API, fine-tune models, and deploy custom model endpoints with function calling and structured output support.

SKILL.mdUpdated Apr 17, 2026

eliferjunior/fireworks-ai

eliferjunior/firecrawl

development

VerifiedTrustedCommunity

Convert any website into clean, structured data with Firecrawl — API-first web scraping service. Use when someone asks to "turn a website into markdown", "scrape website for LLM", "Firecrawl", "extract website content as clean text", "crawl and convert to structured data", or "scrape website for RAG". Covers single-page scraping, full-site crawling, structured extraction, and LLM-ready output.

SKILL.mdUpdated Apr 16, 2026

eliferjunior/firecrawl

eliferjunior/firebase

tools

VerifiedTrustedCommunity

Expert guidance for Firebase, Google's platform for building and scaling web and mobile applications. Helps developers set up authentication, Firestore/Realtime Database, Cloud Functions, hosting, storage, and analytics using Firebase's SDK and CLI.

SKILL.mdUpdated Apr 16, 2026

eliferjunior/firebase

eliferjunior/file-upload-processor

development

VerifiedTrustedCommunity

When the user needs to build file upload functionality for a web application. Use when the user mentions "file upload," "image upload," "upload endpoint," "multipart upload," "presigned URL," "S3 upload," "file validation," "upload to cloud storage," or "accept user files." Handles upload endpoints, file validation (type, size, magic bytes), cloud storage integration, and upload status tracking. For image/video processing after upload, see media-transcoder.

SKILL.mdUpdated Apr 16, 2026

eliferjunior/file-upload-processor

Download

For Claude Desktop. Download once, then upload the file in the app — no terminal needed.

Need help? View full Cowork setup guide →

Install manually

Choose your platform

# Clone the repo
git clone https://github.com/eliferjunior/Claude.git

# Copy into Claude Code skills folder (global)
cp -r Claude/.claude/skills/ts-astro ~/.claude/skills/

Claude Code Skills — official skills path docs.

Repository

eliferjunior/Claude

Compatible with

Claude Code

OpenAI Codex CLI

ChatGPT