SWA-Project/SWA-frontend
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

WIP: API with 401

Browse Source
This commit is contained in:
Pete Gerlach
2024-06-10 00:55:13 +02:00
parent f36ea7a34b
commit 743bb06c00
6 changed files with 52 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
package-lock.json generated
View File

@@ -14,6 +14,7 @@
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"axios": "^1.7.2",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.23.1",
@@ -5506,6 +5507,29 @@
"node": ">=4"
}
},
"node_modules/axios": {
"version": "1.7.2",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.7.2.tgz",
"integrity": "sha512-2A8QhOMrbomlDuiLeK9XibIBzuHeRcqqNOHp0Cyp5EoJ1IFDh+XZH3A6BkXtv0K4gFGCI0Y4BM7B1wOEi0Rmgw==",
"dependencies": {
"follow-redirects": "^1.15.6",
"form-data": "^4.0.0",
"proxy-from-env": "^1.1.0"
}
},
"node_modules/axios/node_modules/form-data": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
"integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
"dependencies": {
"asynckit": "^0.4.0",
"combined-stream": "^1.0.8",
"mime-types": "^2.1.12"
},
"engines": {
"node": ">= 6"
}
},
"node_modules/axobject-query": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-3.2.1.tgz",
@@ -14885,6 +14909,11 @@
"node": ">= 0.10"
}
},
"node_modules/proxy-from-env": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
"integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="
},
"node_modules/psl": {
"version": "1.9.0",
"resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz",

1
package.json
View File

@@ -9,6 +9,7 @@
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"axios": "^1.7.2",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.23.1",

17
public/index.html
View File

@@ -9,22 +9,7 @@
name="description"
content="Web site created using create-react-app"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
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/
-->
<link rel="manifest" href="%PUBLIC_URL%/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>Jodel Klon</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>

25
public/manifest.json
View File

@@ -1,25 +0,0 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}

4
src/App.js
View File

@@ -5,6 +5,7 @@ import Modal from './components/Modal';
import './App.scss';
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
import {faCaretDown, faCaretUp} from "@fortawesome/free-solid-svg-icons";
import {postApi} from "./api/posts.api";
const App = () => {
const [posts, setPosts] = useState([]);
@@ -76,7 +77,8 @@ const App = () => {
return (
<div className="app">
<h1>Jodel Clone</h1>
{console.log(postApi.getPostsByCoords(48, 9), process.env.REACT_APP_AUTH_USERNAME, process.env.REACT_APP_AUTH_PASSWORD)}
<h1>SWA - Jodel</h1>
<NewPostForm addPost={addPost} />
<PostList
posts={posts}

18
src/api/posts.api.js Normal file
View File

@@ -0,0 +1,18 @@
import axios from "axios"
const path = "https://api.jodel.anxietyprime.de/post";
const config = {
headers: {
auth: {
username: process.env.REACT_APP_AUTH_USERNAME,
password: process.env.REACT_APP_AUTH_PASSWORD,
}
}
}
export const postApi = {
async getPostsByCoords (lon, lat) {
return (await axios.get(`${path}/${lon}/${lat}`, this.config)).data;
}
}