Bloggie App is a dynamic platform where users can read, share, and interact with blogs on various topics. Whether it's technology, lifestyle, or creative writing, Bloggie provides an engaging space for readers and writers alike. Users can sign up, create their own blogs, and connect with others through comments and likes.
Each of the team members participates in all the project tasks. However, based on each participant's strengths, we assigned the roles. You can find all the project aspects and the main roles for each.
Frontend: React, HTML5, CSS3, JavaScript
Backend: Node.js, Express
Database: MYSQL
Styling: Bootstrap
Version Control: Git, GitHub
After brainstorming with the team, we decided to divide the project into several versions to ensure workflow and timely delivery of the project
Project Roadmap
-
Week 1: Research
- Documentation: Establish key project requirements and technical documentation.
- Prototype Design: Create a mobile-friendly wireframe and visual mockups for the app.
- Find API: Research and choose suitable APIs for blog data or additional features.
- Technologies Research:
- Facet: Research for filtering and faceted search functionality.
- Vanilla CSS: Plan lightweight, CSS-only solutions for styling.
- Algolia: Investigate how to integrate Algolia for fast and advanced search capabilities.
- Backend Platform: Decide on backend infrastructure (Node.js, Express.js, etc.).
-
Week 2: Design
- Figma Design: Complete the design of the homepage, filter options, and individual blog post view.
- Frontend Development:
- HTML/CSS: Build responsive pages based on Figma designs.
- React Code: Start implementing the React components for homepage, blog filtering, and single blog view.
-
Week 3: Coding
- Figma Design: Design user account pages (log-in, sign-up, and user dashboard).
- Frontend Development:
- Continue working with HTML/CSS for user account-related pages.
- Extend React code for user authentication and blog management.
- Database Structure: Define the database schema (e.g., MongoDB or Firestore) for users, blogs, and comments.
-
Week 4: coding
- Authentication:
- Implement user registration and login using email and password.
- Set up Firebase Auth for authentication management.
- Single post Functionality: Build logic for displaying individual blog - posts with ingredients or key information.
-
Week 5: coding
-
Favorite Blogs: Allow users to add blogs to their favorites list.
-
Blog Rating: Implement a rating system where users can rate blog posts.
-
Week 6: Testing, Deployment, and Final Touches
- Objective: Finalize the app and ensure stability and readiness for deployment.
- Tasks:
- Write unit tests for critical components.
- Perform user testing and gather feedback to improve usability.
- Optimize the app for performance like loading images, optimizing database queries
- Set up SEO for the blog (meta tags, social media preview, etc.).
- Deploy the blog app to a cloud provider
- Deliverable: Fully functional and optimized blog app ready for deployment. Upcoming Features
- In the following weeks, further features and improvements will be added based on feedback and testing.
- react-router-dom
- react-quill
- react-share
- context
- axios
- bootstrap
- bootstrap-icons
- MYSQL
- couldinary
- express
- jsonwebtoken
- bcryptjs
- moment
- sweetalert2
- fortawesome