Kitaab Shayari Platform
A full-stack MERN community platform dedicated to Urdu and Hindi poetry where writers publish, readers discover, and the community engages with short-form literary content. Built from scratch with a focus on content architecture, authentication security, and a reading experience optimised for mobile screens.
What We Built
Kitaab fills a gap in South Asian digital content: a dedicated platform for Shayari and poetry that isn't buried inside general social networks. Users can create an account, publish their poems with topic tags, browse the community's work, and bookmark pieces they want to revisit.
The platform required a complete full-stack build — RESTful Node.js/Express API backed by MongoDB, and a React frontend with Tailwind CSS. The reading typography was given exceptional care: line height, font sizing, and padding were tuned specifically to make short Urdu and Hindi verses feel immersive on a small screen.
Problems We Solved
Secure Multi-User Authentication
Building a robust auth system from scratch — registration, login, protected routes, and persistent sessions — without leaking sensitive user data or exposing the API to brute-force attacks.
Content Discovery at Scale
As content volume grows, unindexed MongoDB queries become exponentially slower. We had to design the tag and author schema with performance in mind from day one.
Typography for non-Latin Scripts
Rendering Urdu and Hindi text beautifully on web requires careful font stack selection, letter-spacing adjustments, and line-height tuning different from standard Latin typography defaults.
Stateless API Design
The React frontend and Node.js backend needed to communicate cleanly through a RESTful API — designing consistent endpoint conventions and error-response formats early was critical.
Technical Architecture
Authentication uses JWT tokens stored securely in httpOnly cookies, with bcrypt hashing at a cost factor of 12. Protected routes on the Express API validate token signatures on every request — ensuring users can only modify their own content.
MongoDB collections were designed with Mongoose schemas: a User model, a Poem model with embedded tag arrays, and a Bookmark model with indexed user and poem references. Compound indexes on tag + createdAt fields ensure sorted discovery queries stay fast as content volume increases.
The React frontend uses Context API for auth state — avoiding unnecessary prop drilling across the component tree. Tailwind CSS utility classes maintain consistency across the reading view, profile pages, and submission forms without a single line of custom CSS.
What Was Built
User registration and JWT-based authentication
Poem and Shayari submission with rich text
Tag-based content discovery and filtering
Community likes and bookmark system
Author profile pages with published works
Responsive reading experience for mobile
The Real Product
JWT Authentication
httpOnly cookie storage with signature validation on every protected API route.
Indexed MongoDB Queries
Compound indexes on tag + timestamp fields keep discovery queries under 80ms.
Context API State
Global auth state via React Context — clean, prop-drilling-free architecture.
Results & Impact
JWT/BCrypt
Auth Security
Stateless authentication with bcrypt password hashing and token expiry management.
< 80ms
Query Speed
Indexed MongoDB collections ensured fast tag-based content retrieval at scale.
68%
Mobile Readers
Over two-thirds of users accessed content on mobile — driving the mobile-first reading layout.
Need a Full-Stack Platform?
Build Your Custom Web App
From database schema to pixel-perfect frontend — engineered with security and scale in mind.