<?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: lichongyang130</title>
    <description>The latest articles on DEV Community by lichongyang130 (@lichongyang130).</description>
    <link>https://dev.to/lichongyang130</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%2F4134662%2F2b6a3e30-f474-4991-9151-1f7997c3c402.png</url>
      <title>DEV Community: lichongyang130</title>
      <link>https://dev.to/lichongyang130</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/lichongyang130"/>
    <language>en</language>
    <item>
      <title>I stopped trusting AI website prompts. Here's how I verify them instead.</title>
      <dc:creator>lichongyang130</dc:creator>
      <pubDate>Mon, 21 Sep 2026 00:03:18 +0000</pubDate>
      <link>https://dev.to/lichongyang130/i-stopped-trusting-ai-website-prompts-heres-how-i-verify-them-instead-20c2</link>
      <guid>https://dev.to/lichongyang130/i-stopped-trusting-ai-website-prompts-heres-how-i-verify-them-instead-20c2</guid>
      <description>&lt;p&gt;I stopped trusting AI website prompts. Here's how I verify them instead.&lt;/p&gt;

&lt;p&gt;Every "10 jaw-dropping prompts for your landing page" thread has the same problem: the screenshot is real, but the prompt they actually pasted is not the one that made it. You copy it, get something three steps uglier, and assume you did it wrong.&lt;/p&gt;

&lt;p&gt;You didn't. The prompt was just oversold.&lt;/p&gt;

&lt;h2&gt;
  
  
  The test I started running
&lt;/h2&gt;

&lt;p&gt;I stopped reading prompt round-ups cold. Instead, for any prompt I was about to use, I ran it through three different frontier models and scored the output against a fixed rubric — layout fidelity, typography, spacing, whether it actually matched the description. Not vibes. A number.&lt;/p&gt;

&lt;p&gt;The results were loud. Across a batch of prompts I'd collected:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;a chunk of them held up across all three models&lt;/li&gt;
&lt;li&gt;several only produced that "screenshot" on one specific model and fell apart on the other two&lt;/li&gt;
&lt;li&gt;a few failed every time and were just… bad, hidden behind a nice thumbnail&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;That last bucket is the one nobody publishes. Which is exactly the problem.&lt;/p&gt;

&lt;h2&gt;
  
  
  What I look for now
&lt;/h2&gt;

&lt;p&gt;Three things, in order:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Fidelity scores per model, not per author.&lt;/strong&gt; If a prompt only works on one model, I want to know that before I build a workflow around it.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Failures shown, not buried.&lt;/strong&gt; A list where every entry has a perfect score is a marketing page, not a tool.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;A score I can reproduce.&lt;/strong&gt; A rubric I can hold up against my own output and get roughly the same number.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;I ended up putting this scoring into the library I was already building — &lt;a href="https://www.56juqingba.com" rel="noopener noreferrer"&gt;https://www.56juqingba.com&lt;/a&gt; runs each AI website prompt through 3 frontier models and shows the real fidelity score, including the runs that scored low. No cherry-picked screenshots; the receipts are the product.&lt;/p&gt;

&lt;h2&gt;
  
  
  The takeaway
&lt;/h2&gt;

&lt;p&gt;You don't need to distrust every prompt you find. You just need to stop treating a screenshot as proof. Verify on your stack, against more than one model, and keep the score where you can see it later.&lt;/p&gt;

&lt;p&gt;The prompt section on that site is free to browse — poke at the ones with low scores and judge for yourself whether the scoring is honest.&lt;/p&gt;

</description>
      <category>ai</category>
      <category>webdev</category>
      <category>program</category>
      <category>productivity</category>
    </item>
    <item>
      <title>I shipped an animated landing page in 90 minutes (and what I'll never hand-code again)</title>
      <dc:creator>lichongyang130</dc:creator>
      <pubDate>Sun, 20 Sep 2026 23:00:52 +0000</pubDate>
      <link>https://dev.to/lichongyang130/i-shipped-an-animated-landing-page-in-90-minutes-and-what-ill-never-hand-code-again-7ah</link>
      <guid>https://dev.to/lichongyang130/i-shipped-an-animated-landing-page-in-90-minutes-and-what-ill-never-hand-code-again-7ah</guid>
      <description>&lt;p&gt;I shipped an animated landing page in 90 minutes (and what I'll never hand-code again)&lt;/p&gt;

&lt;p&gt;The hard parts of a modern landing page aren't the layout. They're the small motions: the tilt that makes the CTA feel clickable, the text that scrambles in on load, the aurora background that looks expensive but doesn't tank your Largest Contentful Paint.&lt;/p&gt;

&lt;p&gt;I used to hand-code all of that. Now I don't — and I tracked a full build minute-by-minute to prove the point.&lt;/p&gt;

&lt;h2&gt;
  
  
  The build
&lt;/h2&gt;

&lt;p&gt;I gave myself 90 minutes and one rule: no bespoke animation code. Every motion had to come from a verified source with a number attached to it.&lt;/p&gt;

&lt;p&gt;Here's what I pulled together, in order:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Hero section&lt;/strong&gt; — a tilt card that reacts to the pointer, plus scramble-text on the headline to draw the eye on load.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Background&lt;/strong&gt; — an aurora veil with a performance tier, so I knew exactly what it cost before I shipped it.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;CTA + stats&lt;/strong&gt; — a counter that animates in with an easing curve instead of a jump cut.&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Why I stopped hand-coding this
&lt;/h2&gt;

&lt;p&gt;Every copy-paste component site I've used does the same bait-and-switch: a pretty screenshot, and then the code you paste is either broken or bloated with 40KB of dependencies.&lt;/p&gt;

&lt;p&gt;The library I used for this build is different — and that's the actual point of this post. It ships receipts instead of marketing:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;every animated component has an a11y audit and a bundle-size number&lt;/li&gt;
&lt;li&gt;every AI website prompt is tested against 3 frontier models with a real fidelity score (failures shown, not hidden)&lt;/li&gt;
&lt;li&gt;a public run log, including the runs that didn't make the cut&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The three pieces I used — tilt card, scramble text, aurora veil — are all in the free tier at &lt;a href="https://www.56juqingba.com" rel="noopener noreferrer"&gt;https://www.56juqingba.com&lt;/a&gt;. Steal the patterns; that's the whole idea.&lt;/p&gt;

&lt;h2&gt;
  
  
  What I'd still hand-code
&lt;/h2&gt;

&lt;p&gt;For the record, not everything belongs in a library. Your business logic, your data fetching, your design system tokens — keep those yours. Components and motion are the last thing you should be reinventing.&lt;/p&gt;

&lt;p&gt;If you're a frontend dev who's tired of shipping hero sections by hand, go poke around the library. It's free.&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>frontend</category>
      <category>animation</category>
      <category>programming</category>
    </item>
  </channel>
</rss>
