OmarFaruq947 / acornding-to-the-basic-node-server-a-clinte-side-backend-

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Work

1. data fetch from my personal server

const [users, setUsers] = useState([]); useEffect(() => { fetch("http://localhost:5000/users") .then((res) => res.json()) .then((data) => setUsers(data)); }, []);

2. show the data

{users.map((user) => (

{user.name} & {user.email}

))}

3. create a simple form

4. Push the Data

const handleAddUser=(e)=>{ e.preventDefault()

const name = e.target.name.value; const email = e.target.email.value; const phone = e.target.phone.value;

//object create const user = {name,email,phone}

// post data to server fetch('http://localhost:5000/user', { method: 'POST', headers: { 'content-type': 'application/json' }, body: JSON.stringify(user) }) .then(res => res.json()) .then(data => { const newUsers = [...users, data]; setUsers(newUsers); console.log(data) }); }

About


Languages

Language:JavaScript 57.1%Language:HTML 35.4%Language:CSS 7.5%