Credits

Before we start, I want to mention that this application was coded entirely by Claude code; just the idea was mine, and the coding part was left to Claude code.

๐Ÿ’ก Inspiration

I kept reading about how quantum computers could one day break the encryption that protects basically everything: bank accounts, passwords, private messages, you name it.

But the part that really got me was something called "harvest now, decrypt later." Hackers don't even have to wait for quantum computers to exist. They can steal your encrypted data today, sit on it, and crack it later once the tech catches up. So stuff you send right now could still get exposed years from now.

The problem? Most developers have no idea which parts of their code are even at risk. And a lot of "security" tools out there love to overpromise stuff like "100% unbreakable!" โ€” which is just not true and honestly kind of dangerous.

So I wanted to build something that:

  • Actually shows you what's risky, in plain English ๐Ÿ”
  • Helps you start fixing it with real post-quantum crypto ๐Ÿ”
  • Is honest about what it can and can't do โœ…

๐Ÿš€ What it does

QuantumShield is a web app with a few main modes:

  • ๐Ÿงช Scan โ€” Paste your code or drop in some files. It looks for risky crypto like RSA, ECC, MD5, SHA-1, old TLS versions, and even hardcoded passwords or API keys. For every problem it finds, it tells you what it is, how bad it is (Low โ†’ Critical), why it's risky, and how to fix it.
  • ๐Ÿ“Š Quantum Risk Score โ€” Gives you a score from 0 to 100 and a letter grade (Aโ€“F) so you instantly know how exposed you are.
  • ๐Ÿ—บ๏ธ Migration Roadmap โ€” Turns your scan results into a clear, step-by-step plan, like "rotate your leaked secrets first, then drop MD5/SHA-1, then start moving RSA to post-quantum."
  • ๐Ÿ” Protect โ€” Upload any file and it encrypts it into a quantum-resistant package using real post-quantum encryption (ML-KEM-768) mixed with AES-256. You can decrypt it right back, and if you use the wrong key it fails on purpose so nothing leaks.
  • ๐Ÿ”‘ Key Upgrade โ€” Generates real post-quantum keys (ML-KEM, ML-DSA, SLH-DSA) that you can copy or download.

And the whole time, I never said "quantum-proof." I said quantum-resistant, and I remind you it still needs a real security review. No fake hype. ๐Ÿ™…

โญ Why is it useful

  • ๐Ÿง  Most people don't know what crypto they're even using. This finds it for you in seconds.
  • ๐Ÿ› ๏ธ It doesn't just point at problems โ€” it gives you the fix and a real plan to follow.
  • ๐Ÿ”’ You can actually protect real files right now with post-quantum encryption, not just read about it.
  • ๐Ÿ•ต๏ธ It's private. Everything runs in your browser, so your files and code never get uploaded to a server.
  • ๐ŸŽ“ You learn while you use it. Every result explains the "why," so it's great for understanding this stuff, not just clicking buttons.

๐Ÿ‘ฅ Who uses this

  • ๐Ÿ‘จโ€๐Ÿ’ป Developers and small teams who want to check their projects without hiring a security expert.
  • ๐Ÿ›ก๏ธ Security folks doing a quick first pass before a deeper audit.
  • ๐ŸŽ“ Students learning about cryptography and quantum computing.
  • ๐Ÿข Companies with sensitive, long-lived data โ€” think health records, finance, or government info โ€” that needs to stay safe for a long time.

๐Ÿงฐ Built with

  • โš›๏ธ React + Vite (frontend)
  • ๐ŸŸจ JavaScript
  • ๐Ÿ” @noble/post-quantum โ€” real ML-KEM-768, ML-DSA-65, and SLH-DSA (the actual FIPS 203/204/205 standards)
  • ๐ŸŒ Web Crypto API โ€” for AES-256-GCM encryption and key derivation, right in the browser
  • ๐ŸŽจ CSS โ€” hand-made dark and light themes (no template)
  • ๐ŸŸข Node.js + Express โ€” an optional backend version of the same logic
  • โ–ฒ Vercel โ€” hosting
  • ๐Ÿ™ Git + GitHub

๐Ÿ—๏ธ How we (Claude and I) built it

We started with the brain of the app first:

  • A scanner built on a set of rules (regex patterns) that catch risky crypto and explain each one.
  • A scoring system that adds up the findings and turns them into a 0โ€“100 risk score.
  • A roadmap generator that builds a fix-it plan based on what it found.

Then the crypto. We used @noble/post-quantum for the real post-quantum algorithms, and combined it with AES-256-GCM so you can actually encrypt files. The encryption works like this: post-quantum (ML-KEM) protects a secret key, and that key encrypts your file. To open it back up, you need the matching private key.

After that we built the frontend in React โ€” a dashboard, the scan page, protect page, key page, and roadmap page โ€” and gave it a serious "security product" look with a dark/light theme toggle, a collapsible sidebar, and a glowing risk meter.

Near the end we rebuilt the app to run 100% in the browser so it could deploy as a simple static site. That meant moving all the crypto from Node over to the browser's Web Crypto API.

๐Ÿ˜… Challenges we (both Claude and I) ran into

  • ๐Ÿค” The post-quantum library was tricky to figure out. The way you call its functions had changed between versions, so the order of the arguments was different from what we expected. We ended up reading the library's type files and writing a tiny test to confirm exactly how to use it instead of guessing.
  • ๐Ÿšซ GitHub blocked our first upload! We had a fake API key in our demo sample (on purpose, to show the scanner catching it), but it looked so real that GitHub thought it was a live Stripe key and refused the push. We had to make the fake key look more obviously fake. Kind of a funny problem to have.
  • ๐Ÿ“ฆ Deploying was harder than expected. We first tried Vercel, but it didn't like that we had a separate backend server. So we rebuilt the whole thing to run in the browser with no backend at all, which actually made it better.
  • ๐Ÿ” Node crypto vs. browser crypto are not the same. Switching to Web Crypto meant relearning how it does things (for example, it sticks the authentication tag onto the end of the encrypted data instead of giving it to you separately).

๐Ÿ† Accomplishments that I'm proud of

  • โœ… It uses real post-quantum crypto, not a fake "demo mode."
  • ๐Ÿ” The encrypt โ†’ decrypt actually works, and using the wrong key fails loudly instead of leaking anything.
  • โšก It runs entirely in your browser, so it's fast, private, and deploys anywhere.
  • ๐ŸŽจ It genuinely looks like a real security product โ€” not a basic school project.
  • ๐Ÿค We stayed honest the whole way. No "100% unbreakable" nonsense.

๐Ÿ“š What I've learned

  • ๐Ÿงฎ How quantum computers actually threaten RSA and ECC (thanks to something called Shor's algorithm), and what the new post-quantum standards are.
  • ๐ŸŒ The real differences between Node's crypto and the browser's Web Crypto.
  • ๐Ÿ“– How to read a library's type definitions to figure out the correct way to use it, instead of guessing and hoping.
  • ๐Ÿ™ A bunch of Git skills: fixing rejected pushes, rebasing, and dealing with GitHub's secret scanning.
  • ๐Ÿ’ฌ That being upfront about a tool's limits actually makes people trust it more, not less.

๐Ÿ”ฎ What's next for QuantumShield

  • โœ๏ธ Signed packages โ€” sign each encrypted file with ML-DSA and check the signature when you open it.
  • ๐Ÿ”— Hybrid mode โ€” use classic and post-quantum encryption together for extra safety during the switch.
  • ๐Ÿ—‚๏ธ Full repo scanning โ€” point it at a whole GitHub repo and get a heatmap of risky files.
  • ๐Ÿ“„ PDF reports โ€” export a clean report you can hand to a teacher, judge, or boss.
  • ๐Ÿง  Smarter scanning โ€” understand the code's structure to cut down on false alarms.

Architecture

                โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”
  Browser  โ”€โ”€โ”€โ–บ โ”‚  React + Vite client (:5173) โ”‚
                โ”‚  Dashboard ยท Scan ยท Protect   โ”‚
                โ”‚  Key Upgrade ยท Roadmap        โ”‚
                โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ฌโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜
                       /api/*  (Vite proxy)
                                โ”‚
                โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ–ผโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”
                โ”‚  Node + Express API (:3001)   โ”‚
                โ”‚                               โ”‚
                โ”‚  scanner.js   rule engine     โ”‚
                โ”‚  scoring.js   risk score      โ”‚
                โ”‚  roadmap.js   migration plan  โ”‚
                โ”‚  cryptoFile.js  AES-256-GCM   โ”‚
                โ”‚  pqc.js  โ—„โ”€โ”€ crypto-agile โ”€โ”€โ” โ”‚
                โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ผโ”€โ”˜
                                              โ”‚
                              @noble/post-quantum (FIPS 203/204/205)
                              ML-KEM-768 ยท ML-DSA-65 ยท SLH-DSA
  • Stateless โ€” no database. Files and keys are processed in memory and returned to the browser.
  • Crypto-agile โ€” every PQC call goes through server/lib/pqc.js. Swap the library there and nothing else changes.

Folder structure

QSH/
โ”œโ”€ package.json            # root scripts: dev / dev:server / dev:client / build
โ”œโ”€ README.md
โ”œโ”€ server/
โ”‚  โ”œโ”€ index.js             # Express app + API routes
โ”‚  โ”œโ”€ package.json
โ”‚  โ””โ”€ lib/
โ”‚     โ”œโ”€ scanner.js        # regex rule engine
โ”‚     โ”œโ”€ scoring.js        # 0โ€“100 risk score
โ”‚     โ”œโ”€ roadmap.js        # phased migration plan
โ”‚     โ”œโ”€ cryptoFile.js     # AES-256-GCM + ML-KEM hybrid (KEM-DEM)
โ”‚     โ””โ”€ pqc.js            # ML-KEM / ML-DSA / SLH-DSA wrapper (the agile seam)
โ””โ”€ client/
   โ”œโ”€ index.html
   โ”œโ”€ vite.config.js       # proxies /api -> :3001
   โ”œโ”€ package.json
   โ””โ”€ src/
      โ”œโ”€ main.jsx  App.jsx  api.js  index.css
      โ”œโ”€ components/  Sidebar ยท RiskGauge ยท FindingCard ยท icons ยท ui
      โ””โ”€ pages/       Dashboard ยท Scan ยท Protect ยท Keys ยท Roadmap

โš ๏ธ Honesty note: QuantumShield is quantum-resistant, not "quantum-proof." It's a risk-assessment and migration helper, and real security still depends on how you store your keys and on a proper review. ๐Ÿ›ก๏ธ

Quick Note

I put 2 links for the same website of my project; so if one doesn't work please use the other one. Thank you.

Built With

Share this project:

Updates