RAVI RAGHUL

CS student building real products & automating workflows.

[RAVI RAGHUL @RaviR_S]

Hey @X 👋

I'm looking to #connect with fellow developers interested in:

🤖 AI Agents
🚀 Indie Hacking
🛠️ Automation Tools
💻 Full-Stack Development
📈 Growth with AI
🔧 DevOps
🧠 AI/ML
📊 Data Science
💼 Freelancing
🚀 Startups
💡 Tech

Let's grow together 🤝

[RAVI RAGHUL @RaviR_S]

@svembu are my comments still getting hidden?

[RAVI RAGHUL @RaviR_S]

@dhruvtwt_ Test

[RAVI RAGHUL @RaviR_S]

U have only 20 bucks, which one will u pay for ?

[RAVI RAGHUL @RaviR_S]

@figma @grok is figma motion free??

[RAVI RAGHUL @RaviR_S]

4️⃣ The TL;DR 📝

Browsers are smart enough to fill in the blanks for URLs. Servers aren't.

Always use an absolute URL built with an environment variable when fetching data inside a Next.js Server Component. 🚀

#NextJS #WebDevelopment #100DaysOfCode

[RAVI RAGHUL @RaviR_S]

Next.js Server Components are incredible, but they come with one annoying quirk that catches everyone off guard. ⚠️

If you try to fetch('/api/data') inside a Server Component, your app will crash.

Here is why, and how to fix it instantly. 🧵👇

[RAVI RAGHUL @RaviR_S]

3️⃣ The Production Fix 🌍

You don't want to hardcode localhost:3000, because it will break when you deploy to Vercel!

The fix?
Use a dynamic environment variable:

const baseUrl = https://t.co/6ypRxz6Dgo_PUBLIC_BASE_URL;

await fetch(baseUrl + '/api/events');

[RAVI RAGHUL @RaviR_S]

Storing raw image files directly in your MongoDB database is a massive rookie mistake. 🛑

It bloats your DB, slows down queries, and costs a fortune.

Here is the production-ready way to handle Image Uploads in a Next.js 16 API Route. 🧵👇

[RAVI RAGHUL @RaviR_S]

4️⃣ The TL;DR 📝

Client sends FormData.

Next.js API turns the File into a Buffer.

Cloudinary stores the Buffer and returns a URL.

MongoDB stores the URL string.

Insanely fast, infinitely scalable. 🚀

#NextJS #JavaScript #Backend

[RAVI RAGHUL @RaviR_S]

3️⃣ The TL;DR 📝

Need it for a database or secure API? Use SECRET_KEY. (Server Only)

Need it for a UI component or frontend tracking? Use NEXT_PUBLIC_KEY. (Client & Server)

Simple prefix. Massive security implications. 🚀

#NextJS #WebDev #ReactJS

[RAVI RAGHUL @RaviR_S]

Next.js environment variables confused the heck out of me until today. 🤯

If you are leaking API keys to the browser, or getting "undefined" errors on the client side, you are probably making this one simple mistake.

Here is the ultimate Next.js .env cheat sheet. 🧵👇

[RAVI RAGHUL @RaviR_S]

2️⃣ The NEXT_PUBLIC_ Magic Key 🔑

What if you actually need a variable on the frontend? (Like a public URL or a PostHog tracking key?)

Just add NEXT_PUBLIC_ to the front of the variable name! Ex: NEXT_PUBLIC_BASE_URL=http://localhost:3000

[RAVI RAGHUL @RaviR_S]

@grok @anushiyaxx Do it