Skip to content

Commit

Permalink
Merge pull request #11 from mesutcifci/react-ecommerce-v2
Browse files Browse the repository at this point in the history
React ecommerce v2
  • Loading branch information
mesutcifci authored Jan 5, 2025
2 parents 72210db + 3a09b64 commit 8f0a9e4
Show file tree
Hide file tree
Showing 273 changed files with 16,151 additions and 47,324 deletions.
Binary file added .DS_Store
Binary file not shown.
8 changes: 1 addition & 7 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,7 +1 @@
# React-Projects

A repository containing the projects I made by using ReactJS

[Todo App](https://github.com/mesutcifci/React-Projects/tree/main/todo-app)

[React E-Commerce App](https://github.com/mesutcifci/React-Projects/tree/main/react-e-commerce-app)
# WORK IN PROGRESS
4 changes: 4 additions & 0 deletions client/.env.example
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
VITE_API_BASE_URL=http://127.0.0.1:8000
VITE_API_PATH=/api/v1
VITE_CLOUDINARY_CLOUD_NAME=abcdd

29 changes: 29 additions & 0 deletions client/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*

node_modules
dist
dist-ssr
*.local
.yarn

# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

.env
.env.development
.env.production
1 change: 1 addition & 0 deletions client/.yarnrc.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
nodeLinker: node-modules
50 changes: 50 additions & 0 deletions client/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
# React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh

## Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:

- Configure the top-level `parserOptions` property like this:

```js
export default tseslint.config({
languageOptions: {
// other options...
parserOptions: {
project: ['./tsconfig.node.json', './tsconfig.app.json'],
tsconfigRootDir: import.meta.dirname,
},
},
})
```

- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
- Optionally add `...tseslint.configs.stylisticTypeChecked`
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config:

```js
// eslint.config.js
import react from 'eslint-plugin-react'

export default tseslint.config({
// Set the react version
settings: { react: { version: '18.3' } },
plugins: {
// Add the react plugin
react,
},
rules: {
// other rules...
// Enable its recommended rules
...react.configs.recommended.rules,
...react.configs['jsx-runtime'].rules,
},
})
```
28 changes: 28 additions & 0 deletions client/eslint.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import js from '@eslint/js'
import globals from 'globals'
import reactHooks from 'eslint-plugin-react-hooks'
import reactRefresh from 'eslint-plugin-react-refresh'
import tseslint from 'typescript-eslint'

export default tseslint.config(
{ ignores: ['dist'] },
{
extends: [js.configs.recommended, ...tseslint.configs.recommended],
files: ['**/*.{ts,tsx}'],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
plugins: {
'react-hooks': reactHooks,
'react-refresh': reactRefresh,
},
rules: {
...reactHooks.configs.recommended.rules,
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
},
},
)
13 changes: 13 additions & 0 deletions client/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + React + TS</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
47 changes: 47 additions & 0 deletions client/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
{
"name": "client",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc -b && vite build",
"lint": "eslint .",
"preview": "vite preview",
"test": "vitest"
},
"dependencies": {
"@cloudinary/react": "^1.13.1",
"@cloudinary/url-gen": "^1.21.0",
"@reduxjs/toolkit": "^2.4.0",
"framer-motion": "^11.15.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-redux": "^9.1.2"
},
"devDependencies": {
"@eslint/js": "^9.15.0",
"@testing-library/dom": "^10.4.0",
"@testing-library/jest-dom": "^6.6.3",
"@testing-library/react": "^16.0.1",
"@testing-library/user-event": "^14.5.2",
"@types/jest": "^29.5.14",
"@types/node": "^22.10.1",
"@types/react": "^18.3.12",
"@types/react-dom": "^18.3.1",
"@types/react-redux": "^7.1.34",
"@vitejs/plugin-react": "^4.3.4",
"autoprefixer": "^10.4.20",
"eslint": "^9.15.0",
"eslint-plugin-react-hooks": "^5.0.0",
"eslint-plugin-react-refresh": "^0.4.14",
"globals": "^15.12.0",
"jsdom": "^25.0.1",
"postcss": "^8.4.49",
"tailwindcss": "^3.4.15",
"typescript": "~5.6.2",
"typescript-eslint": "^8.15.0",
"vite": "^6.0.1",
"vitest": "^2.1.6"
}
}
6 changes: 6 additions & 0 deletions client/postcss.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
export default {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}
11 changes: 11 additions & 0 deletions client/src/App.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import { Navigation } from "@components/Navigation";

function App() {
return (
<div>
<Navigation />
</div>
);
}

export default App;
16 changes: 16 additions & 0 deletions client/src/api/api.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
const baseUrl = import.meta.env.VITE_API_BASE_URL;
const apiPath = import.meta.env.VITE_API_PATH;

export const fetchApi = async (endpoint = "", options = {}) => {
const url = `${baseUrl}${apiPath}${endpoint}`;

console.log("URL: ", url);

const response = await fetch(url, options);

if (!response?.ok) {
throw Error(`Request failed to ${url}: ${response.statusText}`);
}

return response.json();
};
12 changes: 12 additions & 0 deletions client/src/app/hooks.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
// This file serves as a central hub for re-exporting pre-typed Redux hooks.
// These imports are restricted elsewhere to ensure consistent
// usage of typed hooks throughout the application.
// We disable the ESLint rule here because this is the designated place
// for importing and re-exporting the typed versions of hooks.
/* eslint-disable @typescript-eslint/no-restricted-imports */
import { useDispatch, useSelector } from "react-redux";
import type { AppDispatch, RootState } from "./store.ts";

// Use throughout your app instead of plain `useDispatch` and `useSelector`
export const useAppDispatch = useDispatch.withTypes<AppDispatch>();
export const useAppSelector = useSelector.withTypes<RootState>();
36 changes: 36 additions & 0 deletions client/src/app/store.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
/***
* This template is taken from the vite-template-redux repository
* https://github.com/reduxjs/redux-templates/tree/master/packages/vite-template-redux
*/

import type { Action, ThunkAction } from "@reduxjs/toolkit";
import { combineSlices, configureStore } from "@reduxjs/toolkit";

// `combineSlices` automatically combines the reducers using
// their `reducerPath`s, therefore we no longer need to call `combineReducers`.
const rootReducer = combineSlices();
// Infer the `RootState` type from the root reducer
export type RootState = ReturnType<typeof rootReducer>;

// The store setup is wrapped in `makeStore` to allow reuse
// when setting up tests that need the same store config
export const makeStore = (preloadedState?: Partial<RootState>) => {
const store = configureStore({
reducer: rootReducer,
preloadedState,
});
return store;
};

export const store = makeStore();

// Infer the type of `store`
export type AppStore = typeof store;
// Infer the `AppDispatch` type from the store itself
export type AppDispatch = AppStore["dispatch"];
export type AppThunk<ThunkReturnType = void> = ThunkAction<
ThunkReturnType,
RootState,
unknown,
Action
>;
Binary file added client/src/assets/fonts/Inter18pt-Bold.woff
Binary file not shown.
Binary file added client/src/assets/fonts/Inter18pt-Bold.woff2
Binary file not shown.
Binary file added client/src/assets/fonts/Inter18pt-Regular.woff
Binary file not shown.
Binary file added client/src/assets/fonts/Inter18pt-Regular.woff2
Binary file not shown.
Binary file added client/src/assets/fonts/Inter18pt-SemiBold.woff
Binary file not shown.
Binary file added client/src/assets/fonts/Inter18pt-SemiBold.woff2
Binary file not shown.
Binary file added client/src/assets/fonts/SpaceGrotesk-Bold.woff
Binary file not shown.
Binary file added client/src/assets/fonts/SpaceGrotesk-Bold.woff2
Binary file not shown.
Binary file added client/src/assets/fonts/SpaceGrotesk-Light.woff
Binary file not shown.
Binary file not shown.
Binary file added client/src/assets/fonts/SpaceGrotesk-Medium.woff
Binary file not shown.
Binary file added client/src/assets/fonts/SpaceGrotesk-Medium.woff2
Binary file not shown.
Binary file added client/src/assets/fonts/SpaceGrotesk-Regular.woff
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
2 changes: 2 additions & 0 deletions client/src/assets/fonts/fonts.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
@import "./spaceGrotesk.font.css";
@import "./inter.font.css";
26 changes: 26 additions & 0 deletions client/src/assets/fonts/inter.font.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
@font-face {
font-family: "Inter 18pt";
src: url("Inter18pt-SemiBold.woff2") format("woff2"),
url("Inter18pt-SemiBold.woff") format("woff");
font-weight: 600;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: "Inter 18pt";
src: url("Inter18pt-Regular.woff2") format("woff2"),
url("Inter18pt-Regular.woff") format("woff");
font-weight: normal;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: "Inter 18pt";
src: url("Inter18pt-Bold.woff2") format("woff2"),
url("Inter18pt-Bold.woff") format("woff");
font-weight: bold;
font-style: normal;
font-display: swap;
}
44 changes: 44 additions & 0 deletions client/src/assets/fonts/spaceGrotesk.font.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
@font-face {
font-family: "Space Grotesk";
src: url("SpaceGrotesk-Light.woff2") format("woff2"),
url("SpaceGrotesk-Light.woff") format("woff");
font-weight: 300;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: "Space Grotesk";
src: url("SpaceGrotesk-Bold.woff2") format("woff2"),
url("SpaceGrotesk-Bold.woff") format("woff");
font-weight: bold;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: "Space Grotesk";
src: url("SpaceGrotesk-Medium.woff2") format("woff2"),
url("SpaceGrotesk-Medium.woff") format("woff");
font-weight: 500;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: "Space Grotesk";
src: url("SpaceGrotesk-Regular.woff2") format("woff2"),
url("SpaceGrotesk-Regular.woff") format("woff");
font-weight: normal;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: "Space Grotesk";
src: url("SpaceGrotesk-SemiBold.woff2") format("woff2"),
url("SpaceGrotesk-SemiBold.woff") format("woff");
font-weight: 600;
font-style: normal;
font-display: swap;
}
3 changes: 3 additions & 0 deletions client/src/assets/images/bag.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions client/src/assets/images/chevron-down.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions client/src/assets/images/chevron-left.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 4 additions & 0 deletions client/src/assets/images/chevron-right.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions client/src/assets/images/close.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions client/src/assets/images/email.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions client/src/assets/images/facebook.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 4 additions & 0 deletions client/src/assets/images/hamburger.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions client/src/assets/images/instagram.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit 8f0a9e4

Please sign in to comment.