What I learnt while building Manasukh News.

5 min read
What I learnt while building Manasukh News.

Let's Start With Where I Got the Idea to Build This

It all started as a casual conversation. I was talking to one of my seniors, and just the day before, I had used V0 for the first time. I was honestly blown away by how effective it was in creating websites—though, to be fair, the website it gave me was super buggy and didn’t even work properly.

But still, just the possibility that AI could do that? That alone amazed me.

One thing that has always dragged me down is my UI/UX skills. I’ve never been that good at designing things. But suddenly, that wasn’t a concern anymore. It felt like a whole new world had opened up for me.

I had just woken up, and the first thing I did was text my senior:
“We should work together now.”

I told him how powerful AI had become and how easy it was to do even the most complex things now. He asked me to do a demo project to see how AI actually performs. That demo project became Manasukh News.

I Wasn't Overwhelmed—In Fact, I Was Excited

When I got the task, I wasn’t nervous at all. Honestly, I was hyped. Another project to build, another thing to add to my arsenal.

But yeah… it wasn’t as simple as I had imagined.


Approach and Hurdles

My approach was pretty straightforward in my head:
Use V0.dev to handle the UI, and I’ll do everything else myself.

That was mistake number one. I way overestimated what V0.dev could do. Don’t get me wrong—it’s a great tool—but it used Next.js 14 and TailwindCSS v3 for styling.

And right from the start, I ran into my first issue: I couldn't even run the app locally.
It just wouldn't run, and I had no idea why.

After hours of digging, going back and forth between ChatGPT and Lambda Chat, I finally figured it out—how to run the app and how to set up TailwindCSS v4.

Once that was sorted, things were smooth for a while. I built the website, and it was working. The frontend was done in just a few days. I thought the hard part was over and all that was left was the CMS.

Spoiler: it wasn’t that easy.

Midway through building the backend, I realized a few things:


Uh Oh...

  • I’ve never made a rich text editor in my life.

  • Wait, where’s tailwind.config.ts in TailwindCSS v4?

  • What do you mean I can't use @tailwindcss/typography plugin anymore?

  • Where am I supposed to store all the images?

  • Why are all database providers so damn expensive?


Slowly, I Found the Answers

I’ve Never Made a Rich Text Editor

God made humans, humans made more humans, and one of those humans created @tiptap.
I used the @tiptap extension to build a custom rich text editor. For previewing, I used @tailwindcss/typography and the classic "dangerouslySetInnerHTML" in a <div>.

But of course, while doing that, two more problems showed up:


Where’s tailwind.config.ts in TailwindCSS v4?

So in TailwindCSS v4 with Next.js, there’s no explicit tailwind.config.ts file anymore (at least not by default). Instead, we just write styles and configurations directly in globals.css. Took me a while to figure that out.


Why Can’t I Use @tailwindcss/typography Anymore?

Okay, this one frustrated me. The plugin wasn’t deprecated or anything—I just didn’t know how to set it up in the new system.

Previously, we used to add all plugins in tailwind.config.ts. But now that it’s gone, I was clueless. Turns out, all I had to do was add this line directly in globals.css:

@plugin "@tailwindcss/typography"

That’s it. But I didn’t know this. I tried everything—from messing with postcss.config.mjs to all kinds of configurations. Speaking of which…


PostCSS Config Was a Whole Other Problem

Configuring PostCSS gave me more headaches than I expected. But again, with enough trial, error, and late-night Googling, I figured it out.


Where Am I Going to Store All These Images?

Since news articles obviously need images and graphics, I needed a reliable way to store them.

I ended up using UploadThing—worked great, simple to use. Surprisingly, this part went pretty smoothly.


Why Is Every Database Provider So Expensive?

This looked like a big issue at first. But realistically, most providers offer free tiers. For a small-to-medium project like this, it’s more than enough.

I chose Neon.tech as my database provider, and it worked just fine. If the site ever blows up, I’ll happily start paying for it.


Learnings and Conclusion

While building this application, I learned something really important:

Never underestimate a project just because it seems simple.

What looked like a one-week sprint turned into a full-on adventure. But I’m genuinely happy it did—because I learned so much from every error, every Google search, and every late-night debug session.

Each problem pushed me to find a custom solution tailored to what I needed.

And in the end? I didn’t just build Manasukh News—I leveled up.

Can’t wait to take on even crazier projects ahead.

Want to check out the project?
Here is the link to the project: https://newsphi.vercel.app