randomlist App.js

App.js

import { useState, useEffect } from 'react'
import './App.css';
import axios from 'axios';
axios.defaults.baseURL = "http://localhost:5000/"

const App = () => {
	const [list, setList] = useState([]);

	useEffect(() => {
		axios.get('/list')
			.then((res) => { setList(res.data) })
			.catch((err) => { alert(err) })
	}, [])

	const onSubmit = (e) => {
		e.preventDefault();
		axios.post("/list/item", { item: e.target.itemName.value })
			.then((res) => {
				var temp = [...list];
				temp.push({ name: e.target.itemName.value });
				setList(temp);
			})
			.catch((err) => {
				alert(err);
			})
	}

	return (
		<div className="App">
			<form onSubmit={onSubmit}>
				<input type="text" name="itemName" />
				<input type="submit" />
			</form>
			<h3>LIST: </h3>
			{list.map((item) => {
				return (
					<div>{item.name}</div>
				);
			})}
		</div>
	);
}

export default App;