logo

Grocers

undefined image
AWS image AWS
Angular image Angular
Bootstrap image Bootstrap
MongoDB image MongoDB
Node image Node
Word image Word
  • Project Overview: Grocers is an e-commerce website for online grocery shopping developed in response to the increasing trend of businesses moving online due to the Covid-19 pandemic.
  • Key Technologies: VS Code, Angular, NodeJS, MongoDB or MySQL, AWS cloud services, bcrypt, cors, express, mongoose, nodemon, validator, fontawesome-free, chart.js, mdb-angular-ui-kit, rxjs, tslib, zone.js.
  • Major Features: User authentication, session management, real-time updates, responsive design, admin and user portals with comprehensive functionalities.
  • Challenges and Solutions: Integrating frontend and backend seamlessly, setting up an effective MVC framework, maintaining session persistence, and providing a smooth user experience. Agile methodology and iterative testing helped address these challenges.

Case Study

Project Motivation

  • Reason for undertaking the project: Developed as a master's computer science project.
  • Context or background information: E-commerce website.
  • Specific events or trends that triggered the need for the project: Increasing trend of businesses moving online due to the Covid-19 pandemic.

Objectives

  • Main goals of the project: Lead and develop a dynamic website for online purchase of groceries.
  • Specific targets or metrics you hoped to achieve:
    • Create a rich frontend.
    • Create admin and user portals.
    • Add functionalities for admin portal such as adding, updating, and deleting items and users.
    • Add functionalities for user portal such as registration, sign-in, purchasing items, adding to cart, and wish-listing items.
    • Create a database for storing all application-related information.

Challenges

  • Technical challenges faced: Integrating frontend and backend seamlessly.
  • Operational or logistical challenges: Setting up an effective MVC framework and deploying on AWS.
  • User-related or market-related challenges: Maintaining session persistence and providing a smooth user experience.

Approach and Process

  • Initial steps taken to start the project: Started with database creation.
  • Methodologies or frameworks used: Agile methodology.
  • Key phases or steps in the project development:
    • Requirement analysis.
    • Prototyping.
    • Iterative development.
    • Testing.
    • Deployment.

Technologies Used

  • Development Tools: VS Code.
  • Frontend: Angular, Bootstrap.
  • Backend: NodeJS.
  • Database: MongoDB or MySQL.
  • Deployment: AWS cloud services.
  • Grocers-API: bcrypt, cors, express, mongoose, nodemon, validator.
  • Grocers-UI: fontawesome-free, chart.js, mdb-angular-ui-kit, rxjs, tslib, zone.js.

Implementation

  • Key milestones or phases in the development process:
    • Database setup.
    • Frontend development.
    • Backend integration.
    • Deployment on AWS.
  • Important features or components developed:
    • User authentication and session management.
    • Real-time comment updates.
    • Responsive design.
  • Major achievements or breakthroughs during development:
    • Completed within the deadline.
    • Integrated all required features for the course.

Results

  • Quantifiable outcomes: User numbers and transactions are still being evaluated.
  • Qualitative outcomes: Positive user feedback and potential market impact.
  • Awards or recognitions received: None yet.

Lessons Learned

  • Key takeaways from the project:
    • Importance of thorough planning and documentation.
    • Effectiveness of the Agile methodology.
    • Need for continuous user feedback.
  • What went well and what could have been improved:
    • Achieved primary objectives.
    • UI/UX refinement and backend optimization needed.
  • Insights on project management or technical aspects:
    • Agile methodology and iterative testing were beneficial.

Future Improvements

  • Planned features or enhancements:
    • Integrate payment system with Stripe.js.
  • Areas for improvement identified during or after the project:
    • Refine UI/UX and optimize backend processes.
  • Long-term vision or goals for the project:
    • Host and deploy the application to the public.

Screenshots

0 image
1 image
2 image
3 image

Links

2024
Updated: 1 month ago