Blogit - Ultimate Boilerplate for all your content management platform

Under the Hood

The idea emerges from a use case. Blogit template

I was developing a daily writing app using Firebase and a few of the latest technology.

The entire process was quite simple but repetitive, let divide the process

• Next.js framework setup
• Packages installation
• UI components (Frontend website)
• State Management
• Authentication
• Firebase CRUD APIs — ADD, UPDATE, DELETE
• Firebase Storage APIs
• Search API
• Vercel deployment, Github CI/CD A lot more process comes that are often repetitive process.

All the above setups are almost the same for developing any kind of content management platform. CRUD APIs to state management and database and so on.

Not just a usual blogging boilerplate!!

Blogit, This is not usual boilerplate for bloggers, it’s more advanced boilerplate that itself is a product to use as the following categories

• Content Writing Platform
• Notion, Obsidian based apps
• Journalling, Daily writing tools — Todoist, Apple Notes
• Documentation tools like Docsify
• Writing such as Medium, DevTo, Hashnode

What’s Inside?

Home Page

• View all blogs (drafts and published).
• Edit and publish blog posts.

Profile Page

• Showcase all publicly shared blogs.
• Create a public profile to share your work.

Search Modal

• Search through all blogs (drafts and published).
• Efficient fuzzy search using Fuse.js.

Authentication

• Google authentication via Firebase OAuth for secure login.
• Advanced Blog Editor
• Notion-like block-scope editor for effortless writing.
• Add headings, images, code blocks, links, dividers, and more.
• Content Export
• Export blog content into multiple formats: HTML, Markdown, and plain text

Public Blog Links

• Publish blog posts on a shareable link for easy global access.
• API Integrations
• Fully set up APIs to store user details, blogs (drafts and published), and images.

Storage & Database

• Firebase Firestore for blog and user data storage.
• Firebase Storage for managing image uploads.

It’s a product within itself rather than a boilerplate.

Benefits of this boilerplate

Ready-to-Launch Blogging Platform: This allows developers and businesses to start their content platform in minutes.
Advanced Editor: The Notion-like block editor (powered by Editor.js) provides rich writing capabilities, including headings, images, links, code blocks, and more, making it easy to create engaging, structured content.
Modern Tech Stack: Built using Next.js, Tailwind CSS, Mantine UI components, lucide-react and react-icons, editors, redux, react-query
Google Authentication: Secure and simple login with Firebase OAuth
Public Profile & Blog Sharing: Showcase your work through a public profile page, with shareable blog links
Powerful Storage & APIs: Integrated with Firebase for managing user data, storing blogs, and handling images, ensuring a secure, reliable, and scalable platform.
Vercel Analytics — track your platform’s performance effortlessly

Tech Stack

• Next.js
• Reactjs
• Tailwind CSS
• React Query
• Firebase
• Mantine
• Editorjs
• Firebase OAuth (Google Authentication)
• Redux

Purpose of boilerplate

Currently, I am working on the demo part of the boilerplate.

Soon I’ll add the blogit demo on the template, it’s a Notion-like writing platform developed using Blogit.

We can build other content management and related apps using blogit as the fundamental boilerplate, making blogit a framework tool.

The purpose is simple, blogit can be or should be used for the following apps

• Simplest writing app, to-dos, message apps,
• Content creation platforms like Medium
• Journalling apps
• Documentation apps For anything related to writing that needs CRUD APIs, Editors like Notion, Markdown or Text editors can be developed using blogit.

How to use boilerplate?

• Get the boilerplate
• Go to the Firebase console and create a project, get the API keys of the project and copy-paste it
• Inside Firebase enable Authentication and add Google Authentication
• Install Node.js in your terminal if not installed using brew, (brew install node)
• Open the boilerplate in the vs-code (or sublime, vim)
• Open the terminal and press “yarn” or “npm install”
• Add the .env file in your boilerplate and put the Firebase API keys as it is the .env
• Run the “yarn run dev” command in the terminal
• Open localhost:3001 on your browser

Who is the Idea customer?

Use-case of the boilerplate

• Good for Freelancers, easily save 50 hours of your dev time and the cost is also minimal
• Good for small startups and CEOs
• Good for Enterprise who want to create a new content management platform
• Good for solopreneurs who want to build and ship fast
• Good for agencies working directly with clients

4 steps to get started

All the use cases, instructions on How to use, and Documentation for all APIs and architecture are present in the boilerplate itself.

-Within 4 steps one can build and deploy their blog platform instantly and start writing online to share their work.

• Within 4 steps one can build a blogging platform for their clients
• Within 4 steps one can build Notion-like apps for customers
• Within 4 steps one can build a to-do app

• Within 4 steps one can build a medium like apps
  It’s 4 steps

• Get the Boilerplate

• Add Firebase API keys in .env

• Push changes to Github

• Deploy to vercel.com
  Hence your blog platform is ready.

Conclusion

I would insist you all reading check out the template, if found good give it a shot and review me back.

Your feedback is very much appreciated and helps me to define the future.

Your feedback can help me create this boilerplate as a framework for all kinds of content management platforms on the internet.

Blogit - Ultimate boilerplate for all your content management platform

Shrey