ReactForms.jsx

<div className="container">
        <h2>Purchase Order Item form</h2>
        <div className="row">
          <div className="col-md-6">
            <div className="form-group">
              <label>Title:</label>
              <input type="text" className="form-control" placeholder="Enter Title" name="Title" />
            </div>
          </div>
          <div className="col-md-6">
            <div className="form-group">
              <label >Full Name:</label>
              <input type="text" className="form-control" placeholder="Enter Full Name" name="fullName" />
            </div>
          </div>
        </div>
        <div className="row">
          <div className="col-md-9">
            <div className="form-group">
              <label >Street Address:</label>
              <input type="text" className="form-control" placeholder="123 Main Street" name="street" />
            </div>
          </div>
          <div className="col-md-3">
            <div className="form-group">
              <label >Appartment/Room #:</label>
              <input type="text" className="form-control" placeholder="Appartment #" name="Appartment" />
            </div>
          </div>
        </div>

        <div className="row">
          <div className="col-md-4">
            <div className="form-group">
              <label >City:</label>
              <input type="text" className="form-control" placeholder="Enter City" name="city" />
            </div>
          </div>
          <div className="col-md-4">
            <div className="form-group">
              <label >State:</label>
              <select className="form-control" name="state">
                <option value="">Select State --</option>
              </select>
            </div>
          </div>
          <div className="col-md-4">
            <div className="form-group">
              <label>Zip Code:</label>
              <input type="text" className="form-control" placeholder="Zip Code" name="zip" />
            </div>
          </div>
        </div>
        <div className="row">
          <div className="col-md-12">
            <div className="checkbox">
              <label><input type="checkbox" name="remember" checked /> Is Billing Address Same</label>
            </div>
          </div>
          <div className="col-md-12 hidden">
            <div className="form-group">
              <label >Billing Address:</label>
              <textarea className="form-control" rows={3} name="billing" placeholder="Billing Address"></textarea>
            </div>
          </div>

          <div className="col-sm-12">
            <button type="submit" className="btn btn-primary float-right">Submit</button>
            <button type="submit" className="btn btn-secondary float-right">Cancel</button>
          </div>
        </div>
      </div>