2026 · Archive · Token portal
AANN.ai
A 14-section token portal with a public trust-score route and supply pages built for the aggregators that read them.
- Next.js 13
- styled-components 6
- axios
- SendGrid
- sections in the portal
- 14
- viewport tiers from one hook
- 5
- implementations of the roadmap alone
- 3
- keys moved server-side as compromised
- 2
What I walked into
A token portal whose supply figures are read by CoinGecko and CoinMarketCap, which fetch a URL and read the body rather than running JavaScript.
The OpenSea key had been sitting in the env block of next.config.js, which inlines it into the client bundle.
What I changed, and why
Supply pages for machines
/total-supply and /circulating-supply are prerendered statically, so the aggregators find the numbers in the body.
Five tiers, one hook
Viewport tiers resolve centrally through a useView hook, and the heavier blocks ship a separate implementation per tier.
Keys out of the bundle
The OpenSea key moved server-side, the SendGrid key came out with it, and both were treated as compromised.
The OpenSea key was being inlined into the client bundle, which makes it public.
Where it landed
The portal’s 14 sections, the trust-score route and the supply pages are restored, with the supply routes prerendered for the aggregators.
No secret ships to the browser any more: both keys live server-side and were treated as compromised.