Compare commits

..

No commits in common. "master" and "frontend" have entirely different histories.

5 changed files with 34 additions and 38 deletions

View File

@ -1,12 +1,6 @@
# Singleboard Forum
A 4ch ripoff, coded as an exercise in learning full stack development with React
and FastAPI.
# Forum App with FastAPI
Model is after 4chan
## Demo
Start the Docker containers:
```
docker compose up -d
```
Interact with the backend API to add some posts by browsing to http://localhost:8000/docs,
then browse to the frontend at http://localhost:3000.
Board: has threads, unique counter for posts
Thread: Collection of related posts
Post: post_id, thread_id, title, content

View File

@ -5,7 +5,7 @@ services:
context: ./backend
dockerfile: Dockerfile
ports:
- '8000:8000'
- '8001:8000'
restart: unless-stopped
frontend:
@ -13,7 +13,7 @@ services:
context: ./frontend
dockerfile: Dockerfile
ports:
- '3000:3000'
- '8000:8000'
restart: unless-stopped
depends_on:
- backend

View File

@ -1,22 +1,4 @@
# Forum Frontend
The frontend for the forum is written in React.
Should be extremely simple to start with no styling.
**Note**: Before running, update the `apiUrl` in `app/src/App.js` to point your backend.
## Development
To start the frontend in development mode and serve on http://localhost:3000:
```shell
npm run start
```
## Production
```shell
# Install serve
npm install -g serve
# Build for production
npm run build
# Serve
serve -s --no-clipboard build
```
Node.js with a nice framework should be the ultimate goal, but could just do simple HTML and JS by hand for now.

View File

@ -3,13 +3,11 @@ import {useEffect, useState} from "react";
import axios from "axios";
import PostList from "./components/Post/PostList";
const apiUrl = "http://localhost:8000";
function App() {
const [postList, setPostsList] = useState([]);
const fetchPosts = async () => {
await axios.get(apiUrl + "/catalog")
await axios.get("http://localhost:8000/catalog")
.then((response) => { setPostsList(response.data)})
}

22
frontend/conf/nginx.conf Normal file
View File

@ -0,0 +1,22 @@
events {
worker_connections 1024;
}
http {
server {
listen 8000 default_server;
listen [::]:8000 default_server;
root /app;
index index.html;
server_name _;
location / {
try_files $uri $uri/ =404;
}
location /api {
proxy_pass http://backend:8000/;
}
}
}