Sergioamjr

<form>
  <p>Seu Nome:</p>
  <input type="text" id="nome">
</form>

Sergioamjr

<form>
  <label for="nome">Seu Nome:</label>
  <input type="text" id="nome" />
</form>

Sergioamjr

export const Input = (props) => {
  const { name, label, ...othersProps } = props
  return(
    <div>
      <label htmlFor={name}>{label}</label>
      <input name={name} id={name} {...othersProps} />
    </div>
  )
}

Sergioamjr

Import React from 'react';
import { Input } from './Input';

export default class Form extends React.Component {
  state = {
    nome: '',
    idade: '',
  }

  onChangeHandler = (event) => {

Sergioamjr

<button aria-label="Fechar Modal">X</button>

Sergioamjr

<img src="image.jpg" alt="Deficientes visuais acessando a internet" />

Sergioamjr

import React from "react";

export const initialState = {
  store: {},
  dispatch: () => {}
};

const Context = React.createContext(initialState);

export default Context;

Sergioamjr

import React from "react";
import Context from "./Config";

const Connect = Component => {
  return props => (
    <Context.Consumer>
      {({ dispatch, store }) => {
        return <Component {...store} dispatch={dispatch} />;
      }}
    </Context.Consumer>

Sergioamjr

import React from "react";
import ReactDOM from "react-dom";
import App from "./App";
import Store from "./Store/provider";

ReactDOM.render(
  <Store>
    <App />
  </Store>,
  document.getElementById("root")

Sergioamjr

import React, { useReducer } from "react";
import Context from "./Config";
import counterReducer, { counterStore } from "../Counter";

const Store = props => {
  const [counterState, counterDispatch] = useReducer(
    counterReducer,
    counterStore
  );