{"id":29024675,"url":"https://github.com/tasnim29/echo-journal","last_synced_at":"2026-04-12T13:06:07.995Z","repository":{"id":301104719,"uuid":"1008121170","full_name":"tasnim29/echo-journal","owner":"tasnim29","description":"Features include responsive design, dynamic blog creation and updates, category filtering and search, wishlist management, detailed blog pages with comments, featured blogs with sortable data tables, newsletter subscription, and smooth animations with Framer Motion.","archived":false,"fork":false,"pushed_at":"2025-06-25T07:00:20.000Z","size":556,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-06-25T07:27:30.130Z","etag":null,"topics":["crud","express","firebase","framer-motion","mongodb","nodejs","react","tanstack-table"],"latest_commit_sha":null,"homepage":"https://assignment-11-f3a27.web.app/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tasnim29.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-06-25T04:14:43.000Z","updated_at":"2025-06-25T07:00:23.000Z","dependencies_parsed_at":"2025-06-25T07:27:55.557Z","dependency_job_id":"95d7c0f9-3c83-4408-8980-64e411bb42f9","html_url":"https://github.com/tasnim29/echo-journal","commit_stats":null,"previous_names":["tasnim29/echo-journal"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/tasnim29/echo-journal","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tasnim29%2Fecho-journal","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tasnim29%2Fecho-journal/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tasnim29%2Fecho-journal/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tasnim29%2Fecho-journal/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tasnim29","download_url":"https://codeload.github.com/tasnim29/echo-journal/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tasnim29%2Fecho-journal/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":261998013,"owners_count":23242318,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["crud","express","firebase","framer-motion","mongodb","nodejs","react","tanstack-table"],"created_at":"2025-06-26T04:18:36.889Z","updated_at":"2026-04-12T13:06:07.966Z","avatar_url":"https://github.com/tasnim29.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# EchoJournal\n\n# Next-Gen Blog Website\n\n![Blog Website Screenshot](https://i.ibb.co/MyHtzFmR/Screenshot-2025-06-25-105204.png)\n\n---\n\n## 📌 Project Overview\n\nNext-Gen Blog Website is a modern, full-featured, and mobile-responsive blog platform. Users can create, update, and browse blogs, manage wishlists, comment on others' posts, and explore featured blogs with sortable tables. It’s optimized for user experience, performance, and visual design—ideal for showcasing your front-end skills.\n\n---\n\n## 🚀 Live Demo\n\n🔗 [Live Site](https://assignment-11-f3a27.web.app/)\n\n---\n\n## ⚙️ Technology Stack\n\n- **React** – Frontend UI\n- **Firebase** – Auth, hosting, and database\n- **Node.js \u0026 Express** – Backend server and API\n- **MongoDB** – Database for blogs, comments, wishlist\n- **JWT** – Securing private routes\n- **Framer Motion** – UI animations\n- **TanStack Table** – Sortable data tables\n- **Daisy UI** – Component library\n- **React Photo View** – Fullscreen image preview\n- **React Intersection Observer** – Scroll-based animation triggers\n\n---\n\n## ✨ Key Features\n\n- 🔒 Private routes using JWT\n- 📝 Blog creation, update, and category filtering\n- 💬 Blog comments (except on own blog)\n- ❤️ Wishlist add/remove per user\n- 🔍 Blog search with MongoDB full-text search\n- 📊 Featured blogs based on word count, shown in a sortable table\n- 📩 Newsletter input with toast message\n- 🖼️ Fullscreen blog image preview\n- 🌀 Smooth UI transitions with Framer Motion\n- 📱 Fully responsive for mobile, tablet, and desktop\n\n---\n\n## 📦 Dependencies\n\n**Client:**\n\n- `react`, `react-router-dom`, `firebase`, `framer-motion`\n- `@tanstack/react-table`, `react-hook-form`, `axios`\n- `react-photo-view`, `react-intersection-observer`\n- `daisy-ui/react`\n\n**Server:**\n\n- `express`, `cors`, `dotenv`, `mongoose`\n- `firebasetoken`\n\n---\n\n## 🧑‍💻 Getting Started\n\n### ✅ Prerequisites\n\n- Node.js \u0026 npm installed\n- Firebase project set up\n- MongoDB cluster or local DB set up\n\n---\n\n### 📁 Installation\n\n#### Clone the repository:\n\n```bash\ngit clone https://github.com/yourusername/your-blog-repo.git\n\n# Install dependencies for client\ncd echojournal/client\nnpm install\n\n# Install dependencies for server\ncd ../server\nnpm install\n```\n\n---\n\n## 🔐 Environment Setup\n\n#### Client (.env)\n\n```env\nVITE_API_URL=https://your-server-url.com\nVITE_FIREBASE_API_KEY=your_firebase_api_key\nVITE_FIREBASE_AUTH_DOMAIN=your_project.firebaseapp.com\nVITE_FIREBASE_PROJECT_ID=your_project_id\nVITE_FIREBASE_STORAGE_BUCKET=your_project.appspot.com\nVITE_FIREBASE_MESSAGING_SENDER_ID=your_sender_id\nVITE_FIREBASE_APP_ID=your_app_id\n```\n\n#### Server (.env)\n\n```env\nPORT=5000\nMONGO_URI=your_mongodb_connection_string\nJWT_SECRET=your_jwt_secret_key\n```\n\n▶️ Running Locally\n\n#### Start backend server:\n\n```\ncd echojournal/server\nnpm run start\n```\n\n#### Start frontend React client:\n\n```\ncd ../client\nnpm run dev\nThen open your browser and go to 👉 http://localhost:3000\n```\n\n## 🔗 Relevant Links\n\n📑 Beeceptor(CRUD) : https://beeceptor.com/docs/crud-api/\n\n🔥 Firebase Docs: https://firebase.google.com/docs\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftasnim29%2Fecho-journal","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftasnim29%2Fecho-journal","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftasnim29%2Fecho-journal/lists"}