mirror of
https://github.com/Dannecron/parcel-example-neko.git
synced 2025-12-25 15:22:37 +03:00
initial commit
This commit is contained in:
2
.dockerignore
Normal file
2
.dockerignore
Normal file
@@ -0,0 +1,2 @@
|
||||
/.parcel-cache/
|
||||
/node_modules/
|
||||
3
.gitignore
vendored
Normal file
3
.gitignore
vendored
Normal file
@@ -0,0 +1,3 @@
|
||||
/.parcel-cache/
|
||||
/dist/
|
||||
/node_modules/
|
||||
15
Dockerfile
Normal file
15
Dockerfile
Normal file
@@ -0,0 +1,15 @@
|
||||
FROM node:18.12.1-alpine as build
|
||||
|
||||
COPY package.json /opt/neko/
|
||||
COPY package-lock.json /opt/neko/
|
||||
|
||||
WORKDIR /opt/neko
|
||||
RUN npm ci --no-dev
|
||||
|
||||
COPY src /opt/neko/src
|
||||
RUN npm run-script build
|
||||
|
||||
FROM nginx:1.23.2 as runtume
|
||||
|
||||
COPY ./nginx/templates /etc/nginx/templates
|
||||
COPY --from=build /opt/neko/dist /opt/neko/dist
|
||||
17
nginx/templates/default.conf.template
Normal file
17
nginx/templates/default.conf.template
Normal file
@@ -0,0 +1,17 @@
|
||||
server {
|
||||
listen *:80;
|
||||
root /opt/neko/dist;
|
||||
index index.html;
|
||||
|
||||
client_max_body_size 100m;
|
||||
|
||||
access_log /var/log/nginx/access.log;
|
||||
error_log /var/log/nginx/error.log;
|
||||
|
||||
sendfile off;
|
||||
|
||||
location / {
|
||||
root /opt/neko/dist;
|
||||
index index.html;
|
||||
}
|
||||
}
|
||||
4076
package-lock.json
generated
Normal file
4076
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
18
package.json
Normal file
18
package.json
Normal file
@@ -0,0 +1,18 @@
|
||||
{
|
||||
"name": "parcel-example-neko",
|
||||
"version": "1.0.0",
|
||||
"description": "Test project",
|
||||
"source": "src/index.html",
|
||||
"scripts": {
|
||||
"start": "parcel",
|
||||
"build": "parcel build"
|
||||
},
|
||||
"author": "dannc",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"parcel": "2.8.2",
|
||||
"process": "0.11.10",
|
||||
"react": "18.2.0",
|
||||
"react-dom": "18.2.0"
|
||||
}
|
||||
}
|
||||
15
src/index.html
Normal file
15
src/index.html
Normal file
@@ -0,0 +1,15 @@
|
||||
<!doctype html>
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<title>nekos.best integration</title>
|
||||
|
||||
<link rel="stylesheet" href="styles/styles.css" />
|
||||
<script type="module" src="js/app.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1>Hello, World!</h1>
|
||||
<div id="nekos-container"></div>
|
||||
</body>
|
||||
</html>
|
||||
53
src/js/Nekos.jsx
Normal file
53
src/js/Nekos.jsx
Normal file
@@ -0,0 +1,53 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
/**
|
||||
* @param {function} setNeko
|
||||
*/
|
||||
const getNeko = ({ setNeko }) => {
|
||||
fetch('https://nekos.best/api/v2/neko')
|
||||
.then((response) => response.json())
|
||||
.then((json) => setNeko(json.results[0]));
|
||||
};
|
||||
|
||||
const nekoBlockStyles = {
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
};
|
||||
|
||||
/**
|
||||
* @link https://docs.nekos.best/index.html
|
||||
* @returns {JSX.Element}
|
||||
* @constructor
|
||||
*/
|
||||
const Nekos = () => {
|
||||
/**
|
||||
* neko object example:
|
||||
* {
|
||||
* "artist_href":"https://www.pixiv.net/en/users/47065875",
|
||||
* "artist_name":"かえで",
|
||||
* "source_url":"https://www.pixiv.net/en/artworks/88682108",
|
||||
* "url":"https://nekos.best/api/v2/neko/0427.png"
|
||||
* }
|
||||
*/
|
||||
const [neko, setNeko] = useState(null);
|
||||
|
||||
useEffect(() => {
|
||||
getNeko({ setNeko });
|
||||
}, [setNeko]);
|
||||
|
||||
return (
|
||||
<div>
|
||||
{(neko === null) && (<p>загрузка ...</p>)}
|
||||
{neko && (
|
||||
<div style={nekoBlockStyles}>
|
||||
<img src={String(neko.url)} width="500px" alt="neko" />
|
||||
<a href={neko.artist_href}>artist: {neko.artist_name}</a>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Nekos;
|
||||
9
src/js/app.js
Normal file
9
src/js/app.js
Normal file
@@ -0,0 +1,9 @@
|
||||
import { createRoot } from "react-dom/client";
|
||||
|
||||
import Nekos from './Nekos';
|
||||
|
||||
window.document.addEventListener('DOMContentLoaded', () => {
|
||||
const container = document.getElementById('nekos-container');
|
||||
const root = createRoot(container);
|
||||
root.render(<Nekos />)
|
||||
});
|
||||
4
src/styles/styles.css
Normal file
4
src/styles/styles.css
Normal file
@@ -0,0 +1,4 @@
|
||||
h1 {
|
||||
color: hotpink;
|
||||
font-family: cursive;
|
||||
}
|
||||
Reference in New Issue
Block a user