Frontend must have
Must-have checklist for a modern React/Next.js frontend project.From its SKILL.md
npx -y skills add paulgrape/skill-auditor --skill frontend-must-haveAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 0 stars0 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
SKILL.md
1.2 KB, 287 tokens by cl100k_base, as published. Nobody here has run it
Frontend must-have checklist
Use this skill when bootstrapping or auditing a frontend project. Match the stack the repo actually uses.
Routing (Next.js App Router)
import { useRouter } from 'next/navigation'
import Link from 'next/link'
export function Nav() {
const router = useRouter()
return <Link href="/dashboard">Dashboard</Link>
}
State management
import { create } from 'zustand'
const useStore = create<{ count: number }>(() => ({ count: 0 }))
Data fetching
import { useQuery } from '@tanstack/react-query'
export function UserList() {
const { data } = useQuery({ queryKey: ['users'], queryFn: fetchUsers })
return null
}
Validation
import { z } from 'zod'
const UserSchema = z.object({ email: z.string().email() })
Styling
Use tailwindcss utility classes. Keep component styles colocated.
Testing
import { render, screen } from '@testing-library/react'
import { describe, it, expect } from 'vitest'
- Write unit tests with
vitestand@testing-library/react. - Add E2E with
playwrightfor critical user flows.
What ships with it
Read from the repository
Just SKILL.md. No reference files, no scripts.