web/src/App.js
// Estado: Informacoes mantidas pelo componente(Lembrar: imutabilidade)
Informacoes mantidas pelo componente(Lembrar: imutabilidade)
Informacoes mantidas pelo componente ( Lembrar : imutabilidade )
function App() {
  const[devs, setDevs] = useState([]);
  useEffect(() => {
    async function loadDevs(){
      const response = await api.get('/devs');
      setDevs(response.data);
    }
    loadDevs();
  },[]);
  async function handleAddDev(data){
    const response = await api.post('/devs', data)
    setDevs([...devs, response.data])
  }
  return (
    <div id="app">
      <aside>
        <strong>Cadastrar</strong>
          <DevForm onSubmit={handleAddDev}/>
        </aside>
      <main>
        <ul>
          {devs.map(dev => (
            <DevItem key={dev._id} dev={dev}/>
          ))}
        </ul>
      </main>
    </div>
  );
}
function App ( ) { const [ devs , setDevs ] = useState ( [ ] ) ; useEffect ( ( ) => { async function loadDevs ( ) { const response = await api . get ( '/devs' ) ; setDevs ( response . data ) ; } loadDevs ( ) ; } , [ ] ) ; async function handleAddDev ( data ) { const response = await api . post ( '/devs' , data ) setDevs ( [ ... devs , response . data ] ) } return ( < div id = "app" > < aside > < strong > Cadastrar < / strong > < DevForm onSubmit = { handleAddDev } / > < / aside > < main > < ul > { devs . map ( dev => ( < DevItem key = { dev . _id } dev = { dev } / > ) ) } < / ul > < / main > < / div > ) ; }
Estado: Informacoes mantidas pelo componente(Lembrar: imutabilidade)
Estado : Informacoes mantidas pelo componente ( Lembrar : imutabilidade )