Front-End Checklist
A categorized checklist of front-end best practices, usable in a browser, in the README, or via an AI agent.
- Stars
- 74.6k
- Forks
- 6.8k
- Licence
- MIT
- Language
- MDX
- Last update
- 6 days ago
- Type
- Curated list
What it is
Front-End Checklist is a set of 386 English rules covering HTML, CSS, JavaScript, performance, accessibility, SEO, security, images, testing, privacy, and internationalization. Each rule describes a practice to check and links to a rule page with explanations and verification steps. You can browse it on the website, paste it into an MCP-capable AI agent, or work through the checkboxes in the README.
- Work through the HTML and accessibility checkboxes before shipping a page
- Ask an MCP-connected agent to review a React component against the rules
- Ask an agent to audit a public https URL for accessibility, performance, and SEO issues
- Install the skills package to run a focused security check such as the https rule
Great for
- Developers doing a pre-launch review of a website or web app
- Teams wanting a shared checklist for pull request or accessibility audits
- People using AI coding agents that support MCP and want frontend findings grounded in a rule set
- Students learning what good modern front-end practice looks like
Not ideal for
- People who want an automated linter that runs in CI, since the README describes a review workflow rather than a build-time tool
- Anyone needing a checklist for backend or non-web software, because the scope is front-end only
- Beginners looking for a step-by-step tutorial, since rules are terse and assume some web background
How to get it
- 1
Use it in the browser (or self-host)
Install the agent skills package
npx skills add frontendchecklist/skills - 2
Run it
- Open https://frontendchecklist.io to browse rules by category
- Or open the Checklist section of the README and tick items that apply to your project
- To use with an agent, connect an MCP-capable client to mcp.frontendchecklist.io and name the Front-End Checklist MCP in your prompt
- Ask the agent to review a component or audit a public URL
- 3
Get the most out of it
- Use review_code first for pasted HTML, CSS, JavaScript, React, or Next.js code, as the README suggests
- Call search_rules before making accessibility, performance, SEO, or security recommendations
- Use get_workflow or get_checklist_rules for launch or audit passes
- Pair it with UX Patterns for Devs to choose UI patterns before checking implementation quality
Downloads
Strengths
- Large, organized rule set with priority levels from Critical to Low
- Works in several ways: website, README checklist, MCP server, or agent skills
- MIT licensed and widely starred open-source project
Trade-offs
- The README does not explain how rules were chosen or how often they are reviewed, so authority is not established here
- Hosted MCP and website features depend on an external service whose terms are not described in this README
- Checklist items are guidance to check by hand or with an agent; they are not automated tests
How it compares
| Project | Stars | Type | Level | Updated | Best for |
|---|---|---|---|---|---|
| Front-End-Checklist (this) | 74.6k | Curated list | beginner | 6 days ago | Developers doing a pre-launch review of a website or web app |
| Front-End-Performance-Checklist | 17.4k | Learning resource | beginner | 24 days ago | Front-end developers who want a structured list of speed practices to review |
| front-end-interview-handbook | 44k | Learning resource | beginner | 1 months ago | Engineers preparing for front end job interviews |
| TW-Elements | 13.2k | Library | intermediate | 7 months ago | Developers already using Tailwind CSS who want prebuilt interactive components |
| Project-Ideas-And-Resources | 17.1k | Curated list | beginner | 20 days ago | Beginners who want a practice project to build |
| the-book-of-secret-knowledge | 255k | Curated list | beginner | 2.0 years ago | System and network administrators looking for a reference of tools and howtos |
Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.