Shrivantra is a digital publication by The Royals Valley that publishes expert articles on business, startups, technology, AI and personal growth. It is designed to help readers think smarter and grow faster.

What topics does Shrivantra cover?

Shrivantra covers business strategy, startups, mindset, technology, AI trends, productivity, careers and personal growth — with practical articles published weekly.

Who publishes Shrivantra?

Shrivantra is published by The Royals Valley, a digital product studio based in Kolkata, India, founded by Abhijeet Kumar.

Is Shrivantra free to read?

Yes, all content on Shrivantra is completely free to read. There is no paywall.

How often does Shrivantra publish new articles?

Shrivantra publishes new articles every week. Subscribe to the newsletter at shrivantra.com to receive new posts directly in your inbox.

Where is Shrivantra based?

Shrivantra is based in Kolkata, West Bengal, India and is operated by The Royals Valley.

Stop Storing API Keys in Your Frontend Code — You're Exposing Everything

Every developer has done it at least once. You're building a React app, you need a Google Maps key or an OpenAI API key, and you just drop it in the code. Maybe you even add it to a .env file and think "it's fine, it's not in the repo." Here's the uncomfortable truth: if it runs in the browser, the user can see it.

This is one of the most common and most dangerous mistakes in frontend development, and it costs real money to real developers every single year.

Why .env Doesn't Save You

When you use REACT_APP_API_KEY=abc123 in a Create React App project, that value doesn't stay secret. During the build process, Vite, CRA, or Next.js bundles it directly into your JavaScript files. Anyone who opens DevTools, clicks on a network request, or runs strings on your bundle can extract it in under 60 seconds.

There is no encryption. There is no magic. The variable is literally sitting in a .js file that gets served to every visitor.

The Right Way to Handle Secret Keys

The answer is simple: secrets live on the server, never the client.

If you're making an API call that requires an auth key, that call should be made from a backend — a Node.js/Express route, a Next.js API route, a serverless function on Vercel or Netlify, or any server-side environment you control.

Your frontend calls your backend. Your backend calls the third-party API with the secret key. The key never touches the browser.

Example: instead of calling OpenAI directly from React, create a /api/generate route in Next.js that reads the key from process.env (which is server-side only, genuinely private) and proxies the request.

What Happens When You Leak a Key

GitHub's secret scanning has caught thousands of exposed API keys. AWS has a team dedicated to rotating leaked credentials. OpenAI has terminated accounts with leaked keys that were abused by bots. If you accidentally push an API key to a public repo, assume it is already compromised — not will be, already is. Rotate it immediately.

Quick Checklist Before You Ship

Never prefix server secrets with VITE_, REACT_APP_, or NEXT_PUBLIC_ — those prefixes tell the framework to expose them

Any key with billing attached (Stripe, AWS, OpenAI, Twilio) should never be in client-side code

Use environment variables server-side, and use secrets managers (like Doppler, Infisical, or AWS Secrets Manager) for production

Review your built dist/ or .next/ folder before deploying — do a quick search for your key value

Your .env file is not a vault. It's just a convenience file. Keep your secrets where they belong: on the server.