Giter Site home page Giter Site logo

afek-sakaju / gold-pharma-shop Goto Github PK

View Code? Open in Web Editor NEW
3.0 1.0 0.0 135.57 MB

Web app created to offer users the best pharmaceutical shopping experience. Switch between two modes: Customer Mode for browsing and shopping, and Admin Mode to manage data within the shop.

JavaScript 97.89% HTML 1.25% CSS 0.87%
craco eslint media-queries react-router-dom reactjs redux-toolkit storybook javascript shop pharma pharmacy removebg styled-components web-application

gold-pharma-shop's Introduction

Gold Pharma Shop

An online application created to offer users the best pharmaceutical shopping experience with an incredible UI, thanks to an intuitive interface and robust functionality.

You can choose between two modes when entering the app:

1. Customer Mode: shopping, browsing products, adding to your cart, and making purchases.

2. Admin Mode: manage, create, and delete product data within the shop.

Command lines:

  • npm install
    Install all the necessary packages for running and developing the project.
  • npm run json-server
    To run the project's database.
  • npm run start
    For running the project.

Get a glimpse of the app in action

Short-Demo.mp4

The technologies used in this project include:

  • ReactJS : the project is built on the ReactJS framework.
  • JSON-Server used to work with the database as a JSON file, sending API requests to retrieve, edit, create, or delete data.
  • Styled-Components : the project's styling is implemented using styled-components.
  • Redux-toolkit : by employing Redux-toolkit, the project achieves resilient state management, enabling seamless data flow and heightened functionality.
  • React-router-dom : enabling the creation of multiple pages and configuring different page for each path.

Additional technologies used as development tools include:

  • ESLINT : the project adheres to the ESLint guidelines and follows the best practices recommended by airbnb.

In addition, the project incorporates the following features:

  • Responsiveness: the application is intentionally designed to adapt to screens of various sizes by utilizing media queries within its components. This ensures that the user interface adjusts seamlessly to different screen dimensions.
  • Integration with remove.bg API: for background removal of uploaded products’ images to enhance the UI and overall aesthetics.

A brief illustration showcasing how the app appears on various screens

Short-Demo-MQ.mp4

Author

:octocat: Afek Sakaju

gold-pharma-shop's People

Contributors

afek-sakaju avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.