add: script start and dokerfile

This commit is contained in:
dorian melenotte 2024-07-31 20:14:18 +02:00
parent efda7eaf33
commit 4140a77ce3
6 changed files with 69 additions and 0 deletions

12
dokerfile Normal file
View File

@ -0,0 +1,12 @@
FROM thecodingmachine/nodejs:16-bun AS build
WORKDIR /app
COPY package.json bun.lockb .
RUN bun install
COPY . .
RUN bun run build
FROM nginx:stable-alpine AS production
COPY --from=build /app/dist /usr/share/nginx/html
COPY nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

18
nginx.conf Normal file
View File

@ -0,0 +1,18 @@
server {
listen 80;
server_name localhost;
root /usr/share/nginx/html;
index index.html;
location / {
try_files $uri $uri/ /index.html;
}
error_page 404 /index.html;
location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg)$ {
expires max;
log_not_found off;
}
}

View File

@ -5,6 +5,7 @@
"type": "module",
"scripts": {
"dev": "vite",
"start": "vite",
"build": "vite build",
"lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
"preview": "vite preview"

3
src/component/Button.jsx Normal file
View File

@ -0,0 +1,3 @@
export function Button(argv) {
return <button onClick={argv.clicked}>{argv.title}</button>;
}

20
src/component/Card.jsx Normal file
View File

@ -0,0 +1,20 @@
import { Button } from "./Button";
export function Postcard(argv) {
return (
<h1
style={{
backgroundColor: argv.color,
imageRendering: 20,
}}
>
{argv.name} <img src={argv.img} />
<Button
title="likes"
clicked={() => {
window.alert("t pd");
}}
/>
</h1>
);
}

View File

@ -4,12 +4,27 @@ import { App } from "./component/App.jsx";
import { Navbar } from "./component/Navbar.jsx";
import { Body } from "./component/Body.jsx";
import { Footer } from "./component/Footer.jsx";
import { Postcard } from "./component/Card.jsx";
import { Button } from "./component/Button.jsx";
import chat from "./assets/chat_sex.jpg";
function buttoncaller(argv) {
console.log(argv);
}
ReactDOM.createRoot(document.getElementById("root")).render(
<>
<Navbar />
<App />
<Body />
<Postcard name="dorian" img={chat} color="red" />
<Postcard name="Jesussamere" img={chat} color="blue" />
<Button
title="click"
clicked={() => {
buttoncaller("coucou");
}}
/>
<Footer />
</>
);