Welcome to the Macy's Website Clone! This project is a replica of the Macy's website built using React and Chakra UI, with routing managed by React Router.
Ensure you have the following installed on your local machine:
- Node.js (v14 or higher)
- npm (v6 or higher) or Yarn (v1 or higher)
-
Fork the repository:
- Go to the GitHub repository page and click the "Fork" button in the upper right corner.
-
Clone the repository:
- Open your terminal or command prompt.
- Run the following command to clone the repository to your local machine:
git clone https://github.com/YOUR_USERNAME/MACYS_WEBSITE_CLONE.git
Replace
YOUR_USERNAME
with your GitHub username andMACYS_WEBSITE_CLONE
with the name of your forked repository.
-
Navigate to the project directory:
cd MACYS_WEBSITE_CLONE
-
Install dependencies:
Using npm:
npm install
Or using Yarn:
yarn install
-
Start the development server:
Using npm:
npm run dev
Or using Yarn:
yarn dev
Open
http://localhost:3000
in your web browser to view the application.
MACYS_WEBSITE_CLONE/
├── node_modules/
├── public/
│ └── index.html
├── src/
│ ├── components/
│ │ └── Navbar.jsx
│ ├── pages/
│ │ ├── Home.jsx
│ │ ├── Women.jsx
│ │ ├── Men.jsx
│ │ ├── Baby.jsx
│ │ └── Login.jsx
│ ├── App.jsx
│ ├── main.jsx
│ ├── AllRoutes.jsx
│ ├── ProtectedRoute.jsx
├── .gitignore
├── package.json
├── vite.config.js
└── README.md
- Add a shopping cart and checkout functionality
- Integrate a product catalog with search and filter options
- React Documentation
- React Router Documentation
- Chakra UI Documentation
- Axios Documentation
- Vite Documentation
To set up a Vite project:
-
Create a new Vite project:
npm create vite@latest macy-website-clone
Or using Yarn:
yarn create vite macy-website-clone
-
Navigate to the project directory:
cd macy-website-clone
-
Install dependencies:
Using npm:
npm install
Or using Yarn:
yarn install
-
Start the development server:
Using npm:
npm run dev
Or using Yarn:
yarn dev
Your Vite project structure will look like this:
macy-website-clone/
├── node_modules/
├── public/
│ └── index.html
├── src/
│ ├── assets/
│ ├── components/
│ ├── pages/
│ ├── App.jsx
│ ├── main.jsx
├── .gitignore
├── package.json
├── vite.config.js
└── README.md