Skip to content
Snippets Groups Projects
Commit f10b09d7 authored by Olivier Hugo's avatar Olivier Hugo
Browse files

Une partie du front et quelques changements pour le docker-compose

parent 9c805b90
No related branches found
No related tags found
No related merge requests found
Expand all Show whitespace changes
Inline Side-by-side
Showing
with 1945 additions and 17158 deletions
.gitignore
+ 3
− 1
View file @ f10b09d7
...@@ -2,3 +2,5 @@ ...@@ -2,3 +2,5 @@
.venv .venv
node_modules/ node_modules/
__pycache__ __pycache__
node_modules/
mariadb_data/
bdd/Dockerfile 0 → 100644
+ 15
− 0
View file @ f10b09d7
FROM python:3.12-bullseye
WORKDIR /app
RUN wget https://r.mariadb.com/downloads/mariadb_repo_setup
RUN chmod +x mariadb_repo_setup
RUN ./mariadb_repo_setup
RUN apt install -y libmariadb3 libmariadb-dev
RUN pip install mariadb
CMD ["python"]
\ No newline at end of file
bdd/init.py 0 → 100644
+ 20
− 0
View file @ f10b09d7
# Module Imports
import mariadb
import sys
# Connect to MariaDB Platform
try:
conn = mariadb.connect(
user="root",
password="",
host="mariadb",
port=3306,
database="library"
)
except mariadb.Error as e:
print(f"Error connecting to MariaDB Platform: {e}")
sys.exit(1)
# Get Cursor
cur = conn.cursor()
\ No newline at end of file
docker-compose.yml
+ 14
− 1
View file @ f10b09d7
version: '3' version: "3"
services: services:
react-app: react-app:
build: build:
context: ./front context: ./front
dockerfile: Dockerfile dockerfile: Dockerfile
ports:
- 3000:3000
networks: networks:
- library-network - library-network
depends_on: depends_on:
...@@ -12,12 +14,23 @@ services: ...@@ -12,12 +14,23 @@ services:
mariadb: mariadb:
image: mariadb:latest image: mariadb:latest
volumes:
- ./mariadb_data:/var/lib/mysql
networks: networks:
- library-network - library-network
environment: environment:
MARIADB_ALLOW_EMPTY_ROOT_PASSWORD: 1 MARIADB_ALLOW_EMPTY_ROOT_PASSWORD: 1
MARIADB_DATABASE: library MARIADB_DATABASE: library
initdb:
build:
context: ./bdd
dockerfile: Dockerfile
networks:
- library-network
depends_on:
- mariadb
networks: networks:
library-network: library-network:
driver: bridge driver: bridge
front/Dockerfile
+ 0
− 3
View file @ f10b09d7
...@@ -14,8 +14,5 @@ RUN npm install -g serve ...@@ -14,8 +14,5 @@ RUN npm install -g serve
# Build the React app # Build the React app
RUN npm run build RUN npm run build
# Expose the port the app runs on
EXPOSE 3000
# Command to run the application # Command to run the application
CMD ["serve", "-s", "build"] CMD ["serve", "-s", "build"]
front/app/public/index.html → front/app/index.html
+ 25
− 0
View file @ f10b09d7
...@@ -2,42 +2,24 @@ ...@@ -2,42 +2,24 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" /> <meta name="theme-color" content="#000000" />
<meta <meta
name="description" name="description"
content="Web site created using create-react-app" content="Web site created using create-react-app"
/> />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" /> <link rel="apple-touch-icon" href="/logo192.png" />
<!-- <!--
manifest.json provides metadata used when your web app is installed on a manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/ user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
--> -->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> <link rel="manifest" href="/manifest.json" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title> <title>React App</title>
</head> </head>
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div> <div id="root"></div>
<!-- <script type="module" src="/src/index.tsx"></script>
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body> </body>
</html> </html>
front/app/package-lock.json
+ 1682
− 17046
View file @ f10b09d7
This diff is collapsed.
front/app/package.json
+ 19
− 19
View file @ f10b09d7
...@@ -3,19 +3,28 @@ ...@@ -3,19 +3,28 @@
"version": "0.1.0", "version": "0.1.0",
"private": true, "private": true,
"dependencies": { "dependencies": {
"@testing-library/jest-dom": "^5.17.0", "@emotion/babel-plugin": "^11.11.0",
"@testing-library/react": "^13.4.0", "@emotion/react": "^11.11.1",
"@testing-library/user-event": "^13.5.0", "@emotion/styled": "^11.11.0",
"@fontsource/roboto": "^5.0.8",
"@mui/icons-material": "^5.15.0",
"@mui/material": "^5.15.0",
"@types/node": "^20.10.4",
"@types/react": "^18.2.45",
"@types/react-dom": "^18.2.17",
"@vitejs/plugin-react": "^4.2.1",
"react": "^18.2.0", "react": "^18.2.0",
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
"react-scripts": "5.0.1", "react-router-dom": "^6.20.1",
"typescript": "^5.3.3",
"vite": "^5.0.8",
"vite-tsconfig-paths": "^4.2.2",
"web-vitals": "^2.1.4" "web-vitals": "^2.1.4"
}, },
"scripts": { "scripts": {
"start": "react-scripts start", "start": "vite",
"build": "react-scripts build", "build": "tsc && vite build",
"test": "react-scripts test", "preview": "vite preview"
"eject": "react-scripts eject"
}, },
"eslintConfig": { "eslintConfig": {
"extends": [ "extends": [
...@@ -23,16 +32,7 @@ ...@@ -23,16 +32,7 @@
"react-app/jest" "react-app/jest"
] ]
}, },
"browserslist": { "devDependencies": {
"production": [ "@babel/plugin-proposal-private-property-in-object": "^7.21.11"
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
} }
} }
front/app/src/App.css
+ 0
− 37
View file @ f10b09d7
.App {
text-align: center;
}
.App-logo {
height: 40vmin;
pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
.App-logo {
animation: App-logo-spin infinite 20s linear;
}
}
.App-header {
background-color: #282c34;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}
.App-link {
color: #61dafb;
}
@keyframes App-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
front/app/src/App.js deleted 100644 → 0
+ 0
− 25
View file @ 9c805b90
import logo from './logo.svg';
import './App.css';
function App() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.js</code> and save to reload.
</p>
<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Learn React
</a>
</header>
</div>
);
}
export default App;
front/app/src/App.test.js deleted 100644 → 0
+ 0
− 8
View file @ 9c805b90
import { render, screen } from '@testing-library/react';
import App from './App';
test('renders learn react link', () => {
render(<App />);
const linkElement = screen.getByText(/learn react/i);
expect(linkElement).toBeInTheDocument();
});
front/app/src/App.tsx 0 → 100644
+ 50
− 0
View file @ f10b09d7
/** @jsxImportSource @emotion/react */
import { css } from '@emotion/react';
import './App.css';
import '@fontsource/roboto/300.css';
import '@fontsource/roboto/400.css';
import '@fontsource/roboto/500.css';
import '@fontsource/roboto/700.css';
import TopBar from "./Components/TopBar"
import { Search } from './Components/Search';
import {
createBrowserRouter,
Outlet,
RouterProvider,
} from "react-router-dom";
import { Login } from './Components/Login';
const router = createBrowserRouter([
{
path: "/",
element: <>
<TopBar></TopBar>
<Outlet></Outlet>
</>,
children: [
{
path:"",
element:
<div css={css`padding: 32px;`}>
<Search></Search>
</div>
},
{
path:"login",
element: <Login/>
}
]
},
]);
function App() {
return (
<div className="App">
<RouterProvider router={router} />
</div>
);
}
export default App;
front/app/src/Components/Login.tsx 0 → 100644
+ 29
− 0
View file @ f10b09d7
/** @jsxImportSource @emotion/react */
import Button from "@mui/material/Button";
import TextField from "@mui/material/TextField";
import { css } from '@emotion/react';
import Box from "@mui/material/Box";
export function Login() {
return <Box
component="form"
noValidate
autoComplete="off"
css={css`
display: flex;
flex-direction: column;
gap: 8px;
align-items: center;
margin: 32px;
`}
>
<TextField required label="Username"/>
<TextField required label="Password" type="password"/>
<Button variant='outlined'>Se connecter</Button>
</Box>
}
\ No newline at end of file
front/app/src/Components/Search.tsx 0 → 100644
+ 27
− 0
View file @ f10b09d7
/** @jsxImportSource @emotion/react */
import Autocomplete from "@mui/material/Autocomplete";
import TextField from "@mui/material/TextField";
import { css } from '@emotion/react';
export function Search() {
return <Autocomplete
freeSolo
id="free-solo-2-demo"
disableClearable
options={[]}
renderInput={(params) => (
<TextField
{...params}
label="Trouver une publication"
InputProps={{
...params.InputProps,
type: 'search',
}}
/>
)}
/>
}
\ No newline at end of file
front/app/src/Components/TopBar.tsx 0 → 100644
+ 28
− 0
View file @ f10b09d7
/** @jsxImportSource @emotion/react */
import Button from '@mui/material/Button';
import { css } from '@emotion/react';
import { useLocation, useNavigate } from 'react-router-dom';
export default function TopBar() {
const navigate = useNavigate();
const location = useLocation();
return <div css={css`
padding: 16px;
display: flex;
align-items: center;
height: min(5%, 60px);
gap: 8px;
border-bottom: outset lightskyblue 1px;
`}>
<h1>Librarie</h1>
{location.pathname === "/login" ? null :
<Button
variant='outlined'
css={css`margin-left: auto; height: 40px;`}
onClick={() => navigate("/login")}
>Se connecter</Button>}
</div>
}
\ No newline at end of file
front/app/src/index.js → front/app/src/index.tsx
+ 12
− 0
View file @ f10b09d7
...@@ -2,16 +2,11 @@ import React from 'react'; ...@@ -2,16 +2,11 @@ import React from 'react';
import ReactDOM from 'react-dom/client'; import ReactDOM from 'react-dom/client';
import './index.css'; import './index.css';
import App from './App'; import App from './App';
import reportWebVitals from './reportWebVitals';
const root = ReactDOM.createRoot(document.getElementById('root')); const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);
root.render( root.render(
<React.StrictMode> <React.StrictMode>
<App /> <App />
</React.StrictMode> </React.StrictMode>
); );
// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();
front/app/src/reportWebVitals.js deleted 100644 → 0
+ 0
− 13
View file @ 9c805b90
const reportWebVitals = onPerfEntry => {
if (onPerfEntry && onPerfEntry instanceof Function) {
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
getCLS(onPerfEntry);
getFID(onPerfEntry);
getFCP(onPerfEntry);
getLCP(onPerfEntry);
getTTFB(onPerfEntry);
});
}
};
export default reportWebVitals;
front/app/src/setupTests.js deleted 100644 → 0
+ 0
− 5
View file @ 9c805b90
// jest-dom adds custom jest matchers for asserting on DOM nodes.
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
import '@testing-library/jest-dom';
front/app/tsconfig.json 0 → 100644
+ 20
− 0
View file @ f10b09d7
{
"compilerOptions": {
"target": "ESNext",
"lib": ["DOM", "DOM.Iterable", "ESNext"],
"types": [],
"allowJs": false,
"skipLibCheck": false,
"esModuleInterop": false,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"module": "ESNext",
"moduleResolution": "Node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx"
},
"include": ["src"]
}
\ No newline at end of file
front/app/vite-env.d.ts 0 → 100644
+ 1
− 0
View file @ f10b09d7
/// <reference types="vite/client" />
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment