How to generate JWT token in react js

I'm new to JWT concept. I have a signup form and login. Signup.js: I have created signup form

import React, { Component } from 'react';
import { Button } from 'react-bootstrap';
export class SignUp extends Component {
constructor() {
    super();
    this.state = {
        name: '',
        Password: '',
        confirmPassword: ''
    }
    this.name = this.name.bind(this);
    this.Password = this.Password.bind(this);
    this.confirmPassword = this.confirmPassword.bind(this);
    this.SignUp = this.SignUp.bind(this);
  }

name(event) {
    this.setState({ Email: event.target.value })
}

Password(event) {
    this.setState({ Password: event.target.value })
}

confirmPassword(event) {
    this.setState({ confirmPassword: event.target.value })
}
SignUp(event) {
     fetch(' api/sign_up', {
        method: 'post',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',      
        },

        body: JSON.stringify({
            Password: this.state.Password,
            name: this.state.name,
        })

    }).then((Response) => Response.json())
            .then((Result) => {
            if (Result.Status === 'Success')
               this.props.history.push("/Home");
            else
                alert('Sorrrrrry !!!! Un-authenticated User !!!!!')
        })
}
  render() {
     return (
         < div>
            < form >
                < div class="row">
                    < div  >Sign Up </div >
                </div >

                < input type="text" onChange={this.name} placeholder="Enter username" />
                <br /><br />
                < input type="password" onChange={this.Password} placeholder="Enter Password" />
                <br /><br />
                <input type="password" onChange={this.state.confirmPassword} placeholder="ReEnter Password" />
                <br /><br />
                < Button onClick={this.SignUp}> Create Account</Button >
                <br /><br />
            </form >
    </div >
    );
  }
 }

Login.js

  import React, { Component } from 'react';

  import { Button } from 'react-bootstrap';
 export class Login extends Component {
  constructor() {
    super();
    this.state = {
        name: '',
        Password: ''

    }
    this.Password = this.Password.bind(this);
     this.name = this.name.bind(this);
    this.login = this.login.bind(this);
}
name(event) {
    this.setState({ name: event.target.value })
}
Password(event) {
    this.setState({ Password: event.target.value })
}

login(event) {
      fetch('url', {
       method: 'post',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({
            name: this.state.name,
             Password: this.state.Password
        })
     }).then((Response) => Response.json())
        .then((result) => {
            console.log(result);
            if (result.Status == 'Invalid')
                alert('Invalid User');
            else
                this.props.history.push("/home");
            })
  }

   render(){
      return (
        <div>
            <form>
                <div class="row">
                    <div>Login </div>
                </div>
                <br /><br />
                <input type="text" onChange={this.name} placeholder="Enter username" />

                <br /><br />
                <input type="password" onChange={this.Password} placeholder="Enter Password" />
                <br /><br />

                <Button onClick={this.login} >Login</Button>  
            </form>
        </div>
    );
 }
 }

When the user signs up, data will be stored in the server. I use rest api to post the data to the server. Now I have to send the data using jwt token. When the user logs in authorization should be performed using this token.

I'm not understanding how to generate jwt tokens and use it to authorization.Using JWT, I have to do authorization when user logs in. Please help me . Thanks in advance.