frontend-dev-guidelines SKILL.md skillA

frontend-dev-guidelines from aiskillstore/marketplace is an agent skill: a SKILL.md folder an AI agent loads when a task calls for it.

Install it, pinned
mdr add aiskillstore/marketplace/frontend-dev-guidelines@git:20260113.222b7de

Pins git:20260113.222b7de in mdr.lock. Pin the fingerprint instead.

Audit grade
A, 17 of 17 checks passed
Kind
SKILL.md skill
Repository
aiskillstore/marketplace
Path
skills/0chan-smc/frontend-dev-guidelines/SKILL.md
Versions recorded
1
Latest version
git:20260113.222b7de, committed Jan 13, 2026
Size
15,418 bytes
Repository stars
471
License
none declared

Next.js 15 애플리케이션을 위한 프론트엔드 개발 가이드라인. React 19, TypeScript, Shadcn/ui, Tailwind CSS를 사용한 모던 패턴. Server Components, Client Components, App Router, 파일 구조, Shadcn/ui 컴포넌트, 성능 최적화, TypeScript 모범 사례 포함. 컴포넌트, 페이지, 기능 생성, 데이터 페칭, 스타일링, 라우팅, 프론트엔드 코드 작업 시 사용.

Collected from public GitHub. Every version is saved exactly as it was and never changes. Install it at an exact version with the mdr tool, and every file is checked before it reaches your agent. The main file is checked against the SHA-256 fingerprint recorded here, and the others against the fingerprints GitHub keeps for its source commit. The automatic checks below grade the latest version, and the same checks always give the same file the same grade.

What the file says

# Frontend Development Guidelines

## Purpose

Comprehensive guide for modern Next.js 15 development with React 19, emphasizing Server Components, Client Components, App Router patterns, Shadcn/ui components, proper file organization, and performance optimization.

## When to Use This Skill

- Creating new components or pages
- Building new features
- Fetching data (Server Components, Server Actions)
- Setting up routing with Next.js App Router
- Styling components with Tailwind CSS and Shadcn/ui
- Performance optimization
- Organizing frontend code
- TypeScript best practices

---

## Quick Start

### New Component Checklist

Creating a component? Follow this checklist:

- [ ] Determine Server vs Client Component (default: Server Component)
- [ ] Add `"use client"` directive only if needed (interactivity, hooks, browser APIs)
- [ ] Use TypeScript with explicit prop types
- [ ] Import Shadcn/ui components from `@/components/ui`
- [ ] Use Tailwind CSS classes for styling
- [ ] Import aliases: `@/components`, `@/lib`, `@/hooks`
- [ ] Use `cn()` utility for conditional classes
- [ ] Default export at bottom
- [ ] Use Server Components for data fetching when possible
…

Read the whole file at its exact version.

How to install

The exact contents, by fingerprint
mdr add aiskillstore/marketplace/frontend-dev-guidelines@sha256:ecae2dfd455140b3

The line at the top of this page pins the label git:20260113.222b7de, which is what most people want. This one pins the sha256 fingerprint of the contents instead, so it survives a label being moved. Either way the exact version is written to mdr.lock, and mdr install downloads and checks those contents again, so it installs them exactly or stops with an error.

Badge

mdr badge

[![mdr](https://markdownregistry.com/badge/art_nruhj6juhn3cal6x.svg)](https://markdownregistry.com/a/art_nruhj6juhn3cal6x)

4 badge image fetches in 30 days. What the badge shows.

Versions

The registry has recorded 1 version of this file, committed on Jan 13, 2026.

versioncommittedcommitsizeaudit
git:20260113.222b7de latest2026-01-13 222b7de 15,418 BA view

Audit of the latest version

A  17 of 17 checks passed. Fixed automatic checks with no AI involved, so the same checks give the same answer every run.
  • pass: Frontmatter block present
  • pass: Frontmatter declares a name
  • pass: Frontmatter declares a description
  • pass: Size between 200 bytes and 200 KB (15418 bytes)
  • pass: No zero-width or bidi control characters
  • pass: No instruction hidden inside an HTML comment
  • pass: No link to an exfiltration or paste host
  • pass: No credential-shaped string
  • pass: No instruction to send local credentials anywhere
  • pass: No text hidden with inline styles
  • pass: No prompt-injection phrasing
  • pass: No curl or wget piped into a shell
  • pass: No recursive delete of root, home or parent
  • pass: No instruction to read or print local credentials
  • pass: No base64 blob over 200 characters
  • pass: No link to a raw IP address
  • pass: No script tag

Source

GitHub

aiskillstore/marketplace · 471 stars · license none declared · pushed 2026-11-08 · branch main

API

GET https://markdownregistry.com/api/v1/artifacts/art_nruhj6juhn3cal6x
GET https://markdownregistry.com/api/v1/resolve?ref=aiskillstore/marketplace/frontend-dev-guidelines
GET https://markdownregistry.com/api/v1/blob/ecae2dfd455140b3a116cd077cbff9ab879111f6ac511c060e7816d4a2bac1bf

Your AI assistant does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.

Guides: the SKILL.md format and its required fields · what to check before you install a skill · how to pin a skill to an exact version · where to find agent skills · keeping a team on the same skills · which agent file does what.

More from aiskillstore/marketplace

sitemapkit SKILL.md skill
aiskillstore/marketplace · pending/0nl1n1n/sitemapkit/SKILL.md · Discover and extract sitemaps from any website using SitemapKit. Use this skill whenever the user wants to find pages…
git:20260903.f89877a · audit A · 471 stars
auv-computer-control SKILL.md skill
aiskillstore/marketplace · pending/0xselenicdove/auv-computer-control/SKILL.md · Incorporate moeru-ai/AUV into native desktop app control through its CLI or connected MCP for observation, targeted…
git:20261006.592fbb6 · audit A · 471 stars
gauntlet SKILL.md skill
aiskillstore/marketplace · pending/aakashh242/gauntlet/SKILL.md · Evidence-driven adversarial review and root-cause repair of code, designs, APIs, infrastructure, tests, and agent…
v1.0.0 · audit A · 471 stars
aident-skill SKILL.md skill
aiskillstore/marketplace · pending/aident-ai/aident-skill/SKILL.md · Use Aident Loadout first for external apps, APIs, public-web research, search and crawling, service or vendor…
v0.4.19 · audit A · 471 stars
angular-developer SKILL.md skill
aiskillstore/marketplace · pending/angular/angular-developer/SKILL.md · Generates Angular code and provides architectural guidance. Trigger when creating projects, components, services, or…
v1.0 · audit A · 471 stars
angular-new-app SKILL.md skill
aiskillstore/marketplace · pending/angular/angular-new-app/SKILL.md · Creates a new Angular app using the Angular CLI. This skill should be used whenever a user wants to create a new…
v1.0 · audit A · 471 stars
gif-cinema SKILL.md skill
aiskillstore/marketplace · pending/antropos17/gif-cinema/SKILL.md · Generate short GPT GIF shots, review their continuity, choose retakes, and assemble them into a film using the public…
git:20261106.22eb237 · audit A · 471 stars
.cursorrules Cursor rule
aiskillstore/marketplace · pending/axelfreeman/marketing-mindset/.cursorrules
git:20260903.567c889 · audit A · 471 stars
AGENTS.md@pending/axelfreeman/marketing-mindset AGENTS.md file
aiskillstore/marketplace · pending/axelfreeman/marketing-mindset/AGENTS.md
git:20260903.567c889 · audit A · 471 stars
marketing-mindset SKILL.md skill
aiskillstore/marketplace · pending/axelfreeman/marketing-mindset/SKILL.md · Use when the user needs a professional marketer's operating mindset for any marketing, growth, or client-acquisition…
v0.1.0 · audit A · 471 stars
llms.txt@pending/axelfreeman/marketing-mindset llms.txt file
aiskillstore/marketplace · pending/axelfreeman/marketing-mindset/llms.txt
git:20260903.567c889 · audit A · 471 stars
brand-voice-editor SKILL.md skill
aiskillstore/marketplace · pending/azeemkafridi/brand-voice-editor/SKILL.md · Edit social media content into a consistent brand voice while preserving facts and preparing it for BulkPublish…
git:20260902.2316198 · audit A · 471 stars

Every file in aiskillstore/marketplace

Other files named frontend-dev-guidelines

frontend-dev-guidelines SKILL.md skill
vodailocz/kilo-kit-mcp · skills/engineering/frontend-development/SKILL.md · Frontend development guidelines for React/TypeScript applications. Modern patterns including Suspense, lazy loading…
git:20260902.2f5a8e7 · audit A · 27 stars
frontend-dev-guidelines SKILL.md skill
tamnguyendinh/anvien · internal/aicontext/skills/frontend-development/SKILL.md · Use when the user asks to build or change frontend code.
git:20260604.14306d0 · audit A · 12 stars
frontend-dev-guidelines SKILL.md skill
hybridlabor-api/bdb-dev-optimized-agent-skills · skills/global_config/frontend-dev-guidelines/SKILL.md · You are a senior frontend engineer operating under strict architectural and performance standards. Use when creating…
git:20260827.2c5bbb5 · audit A · 7 stars
frontend-dev-guidelines SKILL.md skill
hybridlabor-api/aos · skills/global_config/frontend-dev-guidelines/SKILL.md · You are a senior frontend engineer operating under strict architectural and performance standards. Use when creating…
git:20260827.2c5bbb5 · audit A · 6 stars

Browse by kind, by grade A, or by owner.