memeVerse is a multi-page, highly interactive website where users can explore, upload, and interact with memes. This project demonstrates frontend development skills, including UI/UX, animations, state management, performance optimization, API handling, and advanced React techniques.
- Display trending memes dynamically (Fetched from an API).
- Interactive animations & transitions.
- Dark mode toggle.
- Infinite scrolling or pagination.
- Meme categories filter (Trending, New, Classic, Random).
- Search functionality with debounced API calls.
- Sort memes by likes, date, or comments.
- Upload memes (image/gif format).
- Add funny captions using a text editor.
- Option to generate AI-based meme captions.
- Preview before uploading.
- Dynamic routing (/meme/:id).
- Display meme details, likes, comments, and sharing options.
- Comment system (Local storage for now).
- Like buttons with animation and local storage persistence.
- Shows user-uploaded memes.
- Edit profile info (Name, Bio, Profile Picture).
- View liked memes (saved in local storage or API).
- Top 10 most liked memes.
- User rankings based on engagement.
- A fun, meme-based 404 error page for non-existent routes.
- Frontend: Next.js/React (Pages & App Router)
- Styling: Tailwind CSS
- Animations: Framer Motion / GSAP
- State Management: Redux Toolkit / Context API
- Caching: Local Storage / IndexedDB
- API Handling: Meme APIs (for fetching memes)
- Image Uploads: Cloudinary / Firebase
- Performance Optimization: Lighthouse / React Profiler
- Imgflip API - Generate and fetch popular memes
- Meme Generator API - Create memes dynamically
- ImgBB API - Free image hosting for meme uploads
- Clone the repository:
git clone https://github.com/your-repo/memeverse.git cd memeverse - Install dependencies:
npm install
- Create an
.envfile and configure API keys (if needed). - Start the development server:
npm run dev
The app is deployed on Netlify. To update:
- Push changes to GitHub.
- Netlify will automatically deploy the latest version.
For manual deployment:
npm run buildThis project is licensed under the MIT License - see the LICENSE file for details.
Contributions are welcome! Feel free to submit a pull request or open an issue.
💡 Enjoy memeverse & Spread the Laughter! 😆