<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: James Kalu</title>
    <description>The latest articles on DEV Community by James Kalu (@jamesiukalu).</description>
    <link>https://dev.to/jamesiukalu</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1076732%2F1ba68297-36a1-426e-8004-ad7c7832ca3c.jpeg</url>
      <title>DEV Community: James Kalu</title>
      <link>https://dev.to/jamesiukalu</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/jamesiukalu"/>
    <language>en</language>
    <item>
      <title>I Built a 400-Item Front-End Checklist (and Taught My AI Assistant to Use It)</title>
      <dc:creator>James Kalu</dc:creator>
      <pubDate>Fri, 06 Nov 2026 17:35:35 +0000</pubDate>
      <link>https://dev.to/jamesiukalu/i-built-a-400-item-front-end-checklist-and-taught-my-ai-assistant-to-use-it-2opi</link>
      <guid>https://dev.to/jamesiukalu/i-built-a-400-item-front-end-checklist-and-taught-my-ai-assistant-to-use-it-2opi</guid>
      <description>&lt;p&gt;Most launch bugs aren't exotic. They're the basics — a missing meta description,&lt;br&gt;
a blocking script, a form without labels — missed because nobody had a list.&lt;/p&gt;

&lt;p&gt;So I built one, and made it free: the Front-End Checklist.&lt;br&gt;
Try it: &lt;a href="https://checklist.shinningtechservices.com/" rel="noopener noreferrer"&gt;https://checklist.shinningtechservices.com/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The bugs that ship are boring&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I've spent years shipping front-end work across banking, healthcare, and&lt;br&gt;
government. The pattern never changes: the bugs that slip through to production&lt;br&gt;
are almost never clever edge cases. They're the checklist items nobody checked —&lt;br&gt;
the alt text, the tap target, the meta tag, the label on the form field.&lt;/p&gt;

&lt;p&gt;A list doesn't make you a better developer. It makes the boring stuff&lt;br&gt;
impossible to forget. That's the whole idea.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What the checklist covers&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;400 items across 13 sections — accessibility, performance, SEO, security,&lt;br&gt;
privacy, testing, and more. Every item has a priority, documentation links,&lt;br&gt;
and suggested tools, so it's a work plan, not just a wall of text.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The audit engine&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Paste any public URL and the audit runs up to 246 automatic checks. You get a&lt;br&gt;
score, and failures sorted High, Medium, Low, each with the evidence behind it.&lt;/p&gt;

&lt;p&gt;Some results are flagged "verify" — heuristics, not certainties. A machine can&lt;br&gt;
tell you a label is missing; it can't tell you whether the label makes sense.&lt;br&gt;
The score is a starting point for a human, not a verdict.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;From audit to work plan&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;One click ticks every passing item straight into your checklist, so the audit&lt;br&gt;
becomes the work plan. Export the report as Markdown or PDF, or share a link.&lt;/p&gt;

&lt;p&gt;Checklist progress saves on your device. No account needed.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The agent skill and MCP server&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;There's a free agent skill for Claude Code, Cursor, and GitHub Copilot, and an&lt;br&gt;
MCP server on npm:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;npm i &lt;span class="nt"&gt;-g&lt;/span&gt; frontend-checklist-mcp
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Your AI assistant can audit a page, explain each failure, fix the code, and&lt;br&gt;
re-audit. Audit → explain → fix → re-audit, in one loop. Free API, no key.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What it can't do (honest limits)&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Single page only. No JavaScript execution. No Core Web Vitals, and no&lt;br&gt;
real-device or screen-reader testing. It catches the checkable basics; the&lt;br&gt;
rest still needs a human and a real browser.&lt;/p&gt;

&lt;p&gt;One note: audit runs are logged (URL, score, time) for analytics.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What's next&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;The checks still missing, a CLI, CI plans — and contributions. It's open&lt;br&gt;
source (MIT) at &lt;a href="https://github.com/Jamesiukalu/Frontend-Checklist" rel="noopener noreferrer"&gt;Github&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;It audited my own agency site at 88% — the remaining failures are mine to fix,&lt;br&gt;
and they're on my list. I'd genuinely like to know what it misses. What&lt;br&gt;
checks would you add, and which ones shouldn't be automatic?&lt;/p&gt;

</description>
      <category>ai</category>
      <category>frontend</category>
      <category>productivity</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
