Dream Words
About this project
Wallpaper & quote sharing full stack platform with OTP auth, admin dashboard, likes, reports, dark mode, JWT security and shareable URLs.
Project features
Public Access (No Login Required)
- Fully responsive, mobile-first UI using Tailwind CSS.
- Light/Dark mode toggle for theme customization.
- Real-time feedback using Toastify notifications.
- Browse publicly available wallpapers and quotes.
- Each post has a unique shareable URL.
- Open Graph meta tags for rich social media previews.
- Like system without login using local storage.
- Like counts are synced with the database.
Logged-In Users
- OTP-based email verification for signup.
- JWT-based secure login and route access.
- Password reset with secure email link or in-session method.
- Create posts with images and optional quotes.
- Edit or delete own posts (image is immutable).
- Like/unlike posts with sync between local storage and DB.
- Report inappropriate posts for moderation.
Admin Dashboard
- Google Analytics integration for traffic insights.
- Manage users (delete accounts, update roles).
- View, suspend, or resolve reported posts.
- Suspend posts (hide from public) without deleting.
- Cannot delete posts (ensures content transparency).
- Role-based admin access protected via JWT.
What I learned
Public Features
- Implemented a fully responsive design using Tailwind CSS.
- Integrated light/dark theme toggle with persistence.
- Enabled like system without login using local storage.
- Used Open Graph meta tags for social sharing previews.
- Real-time notifications via Toastify for better UX.
- Libraries Used: Tailwind CSS, React Toastify.
User Authentication
- Implemented OTP-based email verification on signup.
- Used bcrypt for password hashing and validation.
- JWT used for session management and route protection.
- Enabled password reset via email link or logged-in flow.
- Libraries Used: Nodemailer, bcryptjs, jsonwebtoken.
Post Creation & Management
- Users can upload images and optional quotes.
- Image uploads are immutable; text content can be edited.
- Users can delete only their own posts.
- Used Cloudinary for image hosting and storage.
- Libraries Used: Cloudinary, Multer, fs, Axios, React.js.
Likes System
- Developed like/unlike system using localStorage for guests.
- Synced likes with MongoDB for authenticated users.
- Ensured consistent experience across sessions.
- Libraries Used: React.js, localStorage API, Axios.
Reporting System
- Implemented post reporting feature visible to admins.
- Users can report posts for inappropriate content.
- Admins can suspend posts instead of deleting.
- Admins can delete only resolved or invalid reports.
- Libraries Used: React.js, Axios, Express.js.
Admin Dashboard & Role Control
- Admins can manage users, roles, and reports.
- Google Analytics integration for traffic insights.
- Role-based access control enforced using JWT.
- Libraries Used: React.js, Google Analytics API, jsonwebtoken.
State Management & Routing
- Used React Hooks (useState, useEffect) for managing UI state.
- Next.js used for SSR and optimized performance.
- Implemented protected routes using middleware.
- Libraries Used: React.js, Next.js, Axios, jsonwebtoken.
Security & Best Practices
- Passwords and OTPs are hashed using bcrypt.
- JWTs are securely stored and validated for every request.
- Ensured protected routes for user and admin access.
- Libraries Used: bcryptjs, jsonwebtoken, cookie-parser.
UI/UX and Styling
- Designed a modern UI using Tailwind CSS.
- Implemented dark/light mode toggle with smooth transitions.
- Toast notifications for success, error, and info messages.
- Libraries Used: Tailwind CSS, Toastify.
Quick summary
Wallpaper & quote sharing full stack platform with OTP auth, admin dashboard, likes, reports, dark mode, JWT security and shareable URLs.