More on React forms.

import React from "react";

class App extends React.Component {
    constructor() {
        super();

        this.state = {
            firstName: "",
            lastName: "",
            age: "",
            gender: "",
            location: "",
            dietaryRestrictions: {
                vegetarian: false,
                kocher: false,
                lactoseFree: false
            }
        }

        this.handleChange = this.handleChange.bind(this);
    };

    handleChange(event) {
        const {name, value, checked, type} = event.target;
        type === "checkbox" ?
            this.setState((prevState) => {
                return {
                    dietaryRestrictions: {
                        ...prevState.dietaryRestrictions,
                        [name]: checked
                    }
                }
            })
            :
            this.setState({ [name]: value })
    }

    render() {
        return(
            <div>
                <form>
                    <input
                        placeholder="First Name"
                        name="firstName"
                        value={this.state.firstName}
                        type="text"
                        onChange={this.handleChange}
                    /> <br/>

                    <input
                        placeholder="Last Name"
                        name="lastName"
                        value={this.state.lastName}
                        type="text"
                        onChange={this.handleChange}
                    /> <br/>

                    <input
                        placeholder="Age"
                        name="age"
                        value={this.state.age}
                        type="number"
                        onChange={this.handleChange}
                    /> <br/>

                    <label>Male
                        <input
                            type="radio"
                            name="gender"
                            value="male"
                            checked={this.state.gender === "male"}
                            onChange={this.handleChange}
                        />
                    </label>

                    <label>Female
                        <input
                            type="radio"
                            name="gender"
                            value="female"
                            checked={this.state.gender === "female"}
                            onChange={this.handleChange}
                        />
                    </label>

                    <br/>

                    <select
                        value={this.state.location}
                        name="location"
                        onChange={this.handleChange}>
                        <option value="">--Choose country of destination--</option>
                        <option value="china">China</option>
                        <option value="japan">Japan</option>
                        <option value="south korea">South Korea</option>
                    </select>

                    <br/>

                    <label>
                        Vegetarian:
                        <input
                            type="checkbox"
                            name="vegetarian"
                            checked={this.state.dietaryRestrictions.vegetarian}
                            onChange={this.handleChange}/>
                    </label>

                    <br />

                    <label>
                        Kocher:
                        <input
                            type="checkbox"
                            name="kocher"
                            checked={this.state.dietaryRestrictions.kocher}
                            onChange={this.handleChange}/>
                    </label>

                    <br />

                    <label>
                        Lactose free:
                        <input
                            type="checkbox"
                            name="lactoseFree"
                            checked={this.state.dietaryRestrictions.lactoseFree}
                            onChange={this.handleChange}/>
                    </label>

                </form>

                <br/>

                <h1>Name: {this.state.firstName} {this.state.lastName}</h1>
                <h1>Age: {this.state.age}</h1>
                <h1>Gender: {this.state.gender}</h1>
                <h1>Destination: {this.state.location}</h1>
                <h1>Dietary restrictions:
                    <p>Vegetarian: {this.state.dietaryRestrictions.vegetarian ? "Yes" : "No"}</p>
                    <p>Kosher: {this.state.dietaryRestrictions.kocher ? "Yes" : "No"}</p>
                    <p>Lactose-free: {this.state.dietaryRestrictions.lactoseFree ? "Yes" : "No"}</p>
                </h1>
            </div>
        );
    };

}

export default App