Git Product home page Git Product logo

saminkirigaya / ecommerce_web_app_frontend_with_react_js_-stripe_pay- Goto Github PK

View Code? Open in Web Editor NEW
0.0 1.0 0.0 982 KB

A complete authentication and authorization based ecommerce web app for clients business with all exclusive features.

HTML 0.39% CSS 13.60% JavaScript 86.01%
axios-react ecommerce-website react-components react-js-pagination react-router-dom reactjs router-dom sandbox api-rest dotenv react-hooks react-props react-state react-node react-stripe-checkout stripe-js

ecommerce_web_app_frontend_with_react_js_-stripe_pay-'s Introduction

Ecommerce Web FrontEnd With React Js.

The main concern of our project is to creat full responsive, reactive, authentication, authorization based Ecommerce web service with React js latest version.

Features

  • Full Responsive
  • Authentication & Authorization
  • Fullscreen mode
  • Class and Object based state and hook system
  • State and Hook based system
  • Stripe payment sandbox api and same time cash on delivery system added
  • Image are processed before saving with Jimp in backend
  • Tokenized system with Hashing of user password
  • User or Seller account creation are controlled with otp and verifying
  • Verification with mail

Lessons Learned

  • React Js
  • State Handle
  • Hook System
  • React Star Rating Module
  • React Countdown Timer
  • React Js Pagination Module
  • React Router Dom
  • Axios
  • Props Handling

Important Note

The Project has three segment of login (User, Seller, Employee). If a seller does registration before login as the seller make sure to verify it using employee user id .... Employee can log in at Employee page. Employee admin id : email : [email protected] pass : iamgoku

Design And Demo

EShopBD com - Google Chrome 8_21_2023 6_38_02 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_37_36 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_37_44 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_38_02 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_38_09 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_38_19 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_38_23 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_38_26 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_38_29 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_38_47 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_38_58 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_39_16 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_40_40 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_40_45 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_40_50 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_40_54 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_41_00 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_41_27 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_41_44 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_41_54 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_58_13 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_59_40 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_58_19 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_58_24 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_58_33 PM

EShopBD com and 3 more pages - Personal - Microsoft​ Edge 8_21_2023 5_58_36 PM

Environment Variables

In order to run it make sure to remember .... Inside Index.js there are two setting I did for Rest Api handling ...

  • axios.defaults.baseURL = 'http://localhost:8000';
  • axios.defaults.headers.common['Authorization'] = 'Bearer '+localStorage.getItem('token');

Here, i ran it in my localhost and my backed rest api was in this url. So, i used this base url so change it when you host it.

Run Locally

Clone the project

  git clone https://github.com/SaminKirigaya/Ecommerce_web_app_FrontEnd_with_REACT_JS.git
  

Go to the project directory

  cd my-project // You project directory

Install dependencies

  npm install

Start the server

  npm start

ecommerce_web_app_frontend_with_react_js_-stripe_pay-'s People

Contributors

saminkirigaya 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.