Skip to content

This is an e-commerce web-site that will enable customers to be able to access the farm products from the farm to table

License

Notifications You must be signed in to change notification settings

ANNGLORIOUS/Pro-coder

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

26 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

PROJECT WEEK: SMART SOKO :

Create a repository on your GitHub account.

Use JavaScript,CSS and Html to wire down the solution.

Push the solution to the above repository once done.

Submit the repository link for grading.

Ensure your repository has a well written README.

By {List of contributors}

This project was created and is sole property of Annglorious mueni.

Project overview

Smart Soko is an e-commerce web application designed to provide users with a convenient platform to purchase various farm products directly from farmers. The MVP (Minimum Viable Product) focuses on essential functionalities such as browsing products, adding them to a cart, and a simple checkout process.

Features Implemented

  1. Navigation: Users can navigate through sections like Home, About Smart Soko, Products, Contact Us, and Subscribe using the navigation bar.
  2. Product Display: Farm products are dynamically fetched from a mock server and displayed as cards, each showing product details and an "Add to Cart" button.
  3. Cart Functionality:
    • Users can add products to the cart by clicking "Add to Cart" buttons.
    • The cart icon displays the number of items added and allows users to toggle a sidebar to view cart contents.
    • Cart items show product names, prices, and a total amount.
  4. Checkout and Clear Cart: Users can proceed to checkout or clear the cart entirely.
  5. Rating System: A simple star rating system allows users to rate their experience, triggering an alert with the selected rating.

MVP Implementation Details

  1. Product Display: Products are fetched via a simulated API call (fetchProducts function) and displayed dynamically using JavaScript DOM manipulation.
  2. Cart Management: Cart functionality (updateCart, clearButton) manages the addition of products, updates the cart display, and allows clearing the cart.
  3. Responsive Design: Basic responsive design is achieved using CSS Flexbox, ensuring usability on different screen sizes.
  4. Rating Functionality: Users can rate the platform with a star rating system that provides feedback.

Future Enhancements

  • Backend Integration: Replace simulated API calls with actual backend services for real-time data handling.
  • User Authentication: Implement user authentication and user-specific functionalities like order history and profiles.
  • Advanced Styling: Enhance UI/UX with more sophisticated CSS animations and design elements.
  • Payment Integration: Integrate secure payment gateways to enable real transactions.
  • Admin Panel: Develop an admin dashboard for product management, order tracking, and analytics.

Conclusion

Smart Soko's MVP demonstrates foundational e-commerce features with a focus on simplicity and functionality. Future iterations will expand capabilities, improving user experience, security, and scalability. This project aims to provide a seamless online shopping experience for farm products while supporting local farmers and ensuring product quality and customer satisfaction.

hosted site.

The live site: https://sicily-code.netlify.app

Setup/Installation Requirements

  • One would need either linux or wsl for window users
  • A copy of visual basic code installed
  • A github account
  1. Open your terminal and go to the directory you wish to work from.
  2. Go to the following url using ur github account https://github.com/ANNGLORIOUS/Pro-coder
  3. Go to the code tab and clone the ssh key
  4. Go back to the termina and type git clone <-followed by the ssh key you copied /cloned ->
  5. Enter your new cloned repository and type in code .
  6. On the visual studio code that has now opened, go to the the run tab and hit start debugging.

Technologies Used

  1. Frontend: HTML, CSS (with Flexbox for layout and basic styling), JavaScript
  2. Backend: Placeholder for API calls (simulated with fetch to a local server)
  3. External Libraries: Font Awesome for icons

Support and contact details

For any issues please email me at [email protected]

License

Apache License 2.0

About

This is an e-commerce web-site that will enable customers to be able to access the farm products from the farm to table

https://sicily-code.netlify.app

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published