adamklingbaum

export default function ValidatedForm() {
  ...
  
  const handleChange = (event) => {
    const newFormData = { ...formData };
    newFormData[event.target.name] = event.target.value;
    setFormData(newFormData);
  };
  
  ...

adamklingbaum

<Form.Group className="mb-3" controlId="first">
  <Form.Label>First name</Form.Label>
  <Form.Control
    type="text"
    name="first"
    placeholder="Enter your first name"
    value={formData.first}
  />
  </Form.Group>

adamklingbaum

import React, { useState, useCallback } from 'react';
import { Container, Form, Button } from 'react-bootstrap';

export default function ValidatedForm() {
  const [formData, setFormData] = useState({
    first: '',
    last: '',
    email: '',
    password: '',
    confirmPassword: '',

adamklingbaum

import React, { useState, useCallback } from 'react';
import { Container, Form, Button } from 'react-bootstrap';

export default function ValidatedForm() {
  return (
    <Container>
      <h1>Sign up</h1>
      <Form>
        ...
        <Form.Group className="mb-3" controlId="email">

adamklingbaum

import React, { useState, useCallback } from 'react';
import { Container, Form, Button } from 'react-bootstrap';

export default function ValidatedForm() {
  return (
    <Container>
      <h1>Sign up</h1>
      <Form>
        <Form.Group className="mb-3" controlId="first">
          <Form.Label>First name</Form.Label>

adamklingbaum

import React from 'react';
import ReactDOM from 'react-dom';
import ValidatedForm from './components/ValidatedForm';
import 'bootstrap/dist/css/bootstrap.min.css';

ReactDOM.render(<ValidatedForm />, document.getElementById('root'));

adamklingbaum

module: {
    rules: [
      ...,
      {
        test: /\.css$/,
        use: ['style-loader', 'css-loader'],
      },
      ...,
    ],
},

adamklingbaum

import React, { useState, useCallback } from 'react';
import { Container, Form, Button } from 'react-bootstrap';
import 'bootstrap/dist/css/bootstrap.min.css';

export default function ValidatedForm() {
  
}