Giter Club home page Giter Club logo

cowboy-shop's Introduction

Cowboy-Shop

This is a responsive virtual shop website for buying clothes in your account(not really paying anything).
This repository is for the project's website: https://ryanshop-98e7a.web.app/.

Long Description:

This website sells cowboy outfits, The website allow you to browsing anonymously but you need to login with google account to be able for buying stuff.
When browsing you can add products to the cart by pressing "+" logo, anf after you add things to the cart you need to add your credit card info(not real just for visualization), and once you successfully insert everything right you can order it.
once done you can see it in your "orders list" and you can also cancel it if you want to.
The website is responsive for all screen sizes.

The Goal:

This is my first web development project, i did it for practicing.

Development:

The website is built mainly with ReactJS with Redux for frontend and Firebase tools for backend. If you are not familiar with them, I suggest checking out their documentation.

Install:

First, I started Reacjs project with this command:

npx create-react-app cowboyshop

I used also MUI for frontend stuff, you can install it with this commands:

npm install @mui/material
npm install @mui/icons-material
npm install @emotion/react @emotion/styled

You need also to install reactjs-popup, it is a beautiful library that helped me so much in designing the pop up windoes. Install it with this command:

npm install reactjs-popup –save

Then, you need to install Firebase libraries and tools with this command:

npm install firebase react-firebase-hooks

start:

Once everything is ready you can run the website in the local server http://localhost:3000 and edit it with this command:

npm run start

debloy on firebase:

I think it is a good idea to read the docs here because it may change so often.

Organization:

Components live in src/Components and every component style live in src/componentsStyle.

cowboy-shop's People

Contributors

rayanfarhat avatar

Stargazers

jalaa farhat 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.