Build your SaaS landing page in 15 minutes using Mantine

·

2 min read

After the Jsoncrack codebase analysis series, I have decided to update my website TThroo to use Mantine components.

I was able to create components required in less than 15minutes.

Wait, what components?

  1. Header

  2. Hero Section

  3. Features

  4. FAQ

  5. Footer

You can find them in TThroo repo.

Choose the starter project

Mantine provides Nextjs starter configured with Mantine.

I chose next-app-min-template

And then copied the code from Mantine components listed above and that’s it. You now have your SaaS landing page.

But is it though?

You still need to update the copy writing for your website content, update the logo to match your brand’s values, but atleast you have a website ready. One less problem…

The problem

I used to host my website on firebase hosting, with nextjs, you have to perform additional steps. Keep this in mind.

Conclusion:

Jsoncrack codebase analysis helped me learn about Mantine and I liked their components. This is what you do, you apply from your learnings.

It can be something a small thing such as this one to decide to go with Mantine or it can be a huge pattern that you decided to apply when you have a lot of modals in your project.

Sure, I could have used tailwind, but it is alright. I want to demonstrate as much as possible how powerful and useful opensource to learn from.

If you have any questions or need help with your project, feel free to reach out to me at ram@tthroo.com