├── .gitignore
├── README.md
├── package-lock.json
├── package.json
├── postcss.config.js
├── public
├── favicon.ico
├── index.html
├── logo192.png
├── logo512.png
├── manifest.json
└── robots.txt
├── src
├── App.js
├── components
│ ├── CartItem.js
│ ├── Footer.js
│ ├── Header.js
│ ├── Hero.js
│ ├── Product.js
│ └── Sidebar.js
├── contexts
│ ├── CartContext.js
│ ├── ProductContext.js
│ └── SidebarContext.js
├── img
│ ├── bg_hero.svg
│ ├── logo.svg
│ └── woman_hero.png
├── index.css
├── index.js
└── pages
│ ├── Home.js
│ └── ProductDetails.js
└── tailwind.config.js
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.js
7 |
8 | # testing
9 | /coverage
10 |
11 | # production
12 | /build
13 |
14 | # misc
15 | .DS_Store
16 | .env.local
17 | .env.development.local
18 | .env.test.local
19 | .env.production.local
20 |
21 | npm-debug.log*
22 | yarn-debug.log*
23 | yarn-error.log*
24 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # ecommerce-shop-starter
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ecommerce-shop",
3 | "version": "0.1.0",
4 | "private": true,
5 | "dependencies": {
6 | "@testing-library/jest-dom": "^5.16.5",
7 | "@testing-library/react": "^13.4.0",
8 | "@testing-library/user-event": "^13.5.0",
9 | "react": "^18.2.0",
10 | "react-dom": "^18.2.0",
11 | "react-scripts": "5.0.1",
12 | "web-vitals": "^2.1.4"
13 | },
14 | "scripts": {
15 | "start": "react-scripts start",
16 | "build": "react-scripts build",
17 | "test": "react-scripts test",
18 | "eject": "react-scripts eject"
19 | },
20 | "eslintConfig": {
21 | "extends": [
22 | "react-app",
23 | "react-app/jest"
24 | ]
25 | },
26 | "browserslist": {
27 | "production": [
28 | ">0.2%",
29 | "not dead",
30 | "not op_mini all"
31 | ],
32 | "development": [
33 | "last 1 chrome version",
34 | "last 1 firefox version",
35 | "last 1 safari version"
36 | ]
37 | },
38 | "devDependencies": {
39 | "autoprefixer": "^10.4.13",
40 | "postcss": "^8.4.19",
41 | "react-icons": "^4.6.0",
42 | "react-router-dom": "^6.4.3",
43 | "tailwindcss": "^3.2.4"
44 | }
45 | }
46 |
--------------------------------------------------------------------------------
/postcss.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | plugins: {
3 | tailwindcss: {},
4 | autoprefixer: {},
5 | },
6 | }
7 |
--------------------------------------------------------------------------------
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cristianmihai01/ecommerce-shop-starter/449faca40fb704527fcf732f39b82ea8af2a13e6/public/favicon.ico
--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
12 |
13 |
17 |
18 |
27 |
28 |
29 |
30 |
34 | React App
35 |
36 |
37 |
38 |
39 |
49 |
50 |
51 |
--------------------------------------------------------------------------------
/public/logo192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cristianmihai01/ecommerce-shop-starter/449faca40fb704527fcf732f39b82ea8af2a13e6/public/logo192.png
--------------------------------------------------------------------------------
/public/logo512.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cristianmihai01/ecommerce-shop-starter/449faca40fb704527fcf732f39b82ea8af2a13e6/public/logo512.png
--------------------------------------------------------------------------------
/public/manifest.json:
--------------------------------------------------------------------------------
1 | {
2 | "short_name": "React App",
3 | "name": "Create React App Sample",
4 | "icons": [
5 | {
6 | "src": "favicon.ico",
7 | "sizes": "64x64 32x32 24x24 16x16",
8 | "type": "image/x-icon"
9 | },
10 | {
11 | "src": "logo192.png",
12 | "type": "image/png",
13 | "sizes": "192x192"
14 | },
15 | {
16 | "src": "logo512.png",
17 | "type": "image/png",
18 | "sizes": "512x512"
19 | }
20 | ],
21 | "start_url": ".",
22 | "display": "standalone",
23 | "theme_color": "#000000",
24 | "background_color": "#ffffff"
25 | }
26 |
--------------------------------------------------------------------------------
/public/robots.txt:
--------------------------------------------------------------------------------
1 | # https://www.robotstxt.org/robotstxt.html
2 | User-agent: *
3 | Disallow:
4 |
--------------------------------------------------------------------------------
/src/App.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const App = () => {
4 | return react app
;
5 | };
6 |
7 | export default App;
8 |
--------------------------------------------------------------------------------
/src/components/CartItem.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const CartItem = () => {
4 | return CartItem
;
5 | };
6 |
7 | export default CartItem;
8 |
--------------------------------------------------------------------------------
/src/components/Footer.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const Footer = () => {
4 | return Footer
;
5 | };
6 |
7 | export default Footer;
8 |
--------------------------------------------------------------------------------
/src/components/Header.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const Header = () => {
4 | return Header
;
5 | };
6 |
7 | export default Header;
8 |
--------------------------------------------------------------------------------
/src/components/Hero.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const Hero = () => {
4 | return Hero
;
5 | };
6 |
7 | export default Hero;
8 |
--------------------------------------------------------------------------------
/src/components/Product.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const Product = () => {
4 | return Product
;
5 | };
6 |
7 | export default Product;
8 |
--------------------------------------------------------------------------------
/src/components/Sidebar.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const Sidebar = () => {
4 | return Sidebar
;
5 | };
6 |
7 | export default Sidebar;
8 |
--------------------------------------------------------------------------------
/src/contexts/CartContext.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const CartContext = () => {
4 | return CartContext
;
5 | };
6 |
7 | export default CartContext;
8 |
--------------------------------------------------------------------------------
/src/contexts/ProductContext.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const ProductContext = () => {
4 | return ProductContext
;
5 | };
6 |
7 | export default ProductContext;
8 |
--------------------------------------------------------------------------------
/src/contexts/SidebarContext.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const SidebarContext = () => {
4 | return SidebarContext
;
5 | };
6 |
7 | export default SidebarContext;
8 |
--------------------------------------------------------------------------------
/src/img/bg_hero.svg:
--------------------------------------------------------------------------------
1 |
126 |
--------------------------------------------------------------------------------
/src/img/logo.svg:
--------------------------------------------------------------------------------
1 |
12 |
--------------------------------------------------------------------------------
/src/img/woman_hero.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/cristianmihai01/ecommerce-shop-starter/449faca40fb704527fcf732f39b82ea8af2a13e6/src/img/woman_hero.png
--------------------------------------------------------------------------------
/src/index.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;
4 |
5 | @layer base {
6 | body {
7 | @apply font-primary text-primary;
8 | }
9 | }
10 |
--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import ReactDOM from 'react-dom/client';
3 | import './index.css';
4 | import App from './App';
5 |
6 | const root = ReactDOM.createRoot(document.getElementById('root'));
7 | root.render(
8 |
9 |
10 |
11 | );
12 |
--------------------------------------------------------------------------------
/src/pages/Home.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const Home = () => {
4 | return Homepage
;
5 | };
6 |
7 | export default Home;
8 |
--------------------------------------------------------------------------------
/src/pages/ProductDetails.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 |
3 | const ProductDetails = () => {
4 | return Product Details Page
;
5 | };
6 |
7 | export default ProductDetails;
8 |
--------------------------------------------------------------------------------
/tailwind.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | content: ['./src/**/*.{js,jsx,ts,tsx}'],
3 | theme: {
4 | fontFamily: {
5 | primary: 'Poppins',
6 | },
7 | container: {
8 | padding: {
9 | DEFAULT: '30px',
10 | lg: '0',
11 | },
12 | },
13 | screens: {
14 | sm: '640px',
15 | md: '768px',
16 | lg: '1024px',
17 | xl: '1440px',
18 | },
19 | extend: {
20 | colors: {
21 | primary: '#222222',
22 | secondary: '#F5E6E0',
23 | },
24 | backgroundImage: {
25 | hero: "url('./img/bg_hero.svg')",
26 | },
27 | },
28 | },
29 | plugins: [],
30 | };
31 |
--------------------------------------------------------------------------------