Livecoding JWT

SELECT * FROM table1
——
- Creation d’un repo avec un back NodeJS/Express et un front React
- Creation d’une connection MySQL
- Installer des dépendances aka Bodyparser??? etc
———
- Creation d’un composant Login avec un formulaire 2 input, import to App.js
- Expliquer les States
- Expliquer le HandleSubmit (bouton type=submit)
- Le fetch
- PreventDefault?
———
-  Faire la route
-  Reception DB
-  // attention Axios avec leur Post {User} a bien faire la bonne réception
- Bcrypt


——
- Faire Login
- Faire le Axios Login
- Faire le JWT/ installer le délire
- Renvoyer et LocalStorage
- Bimbim
———

— Faire un routine JWT?







import React, {Component} from 'react';
import axios from 'axios'

class SignUp extends Component {

    state = {
        email: '',
        password: '',
    }

    // Update on Changes

    UpdateField = event => { this.setState({ [event.target.name]: event.target.value })}

    // Handle Submit


    Submit = (event) => {
        event.preventDefault();
        console.log('testest')
        const user = this.state
        console.log(user)
        axios.post(`http://localhost:3030/login`, {user})
          .then(res => {
            console.log(res);
            console.log(res.data);
          })
      }


    render() {
        return (
            <div>
                <form>
                <div>
                  <input type="text" name="email" placeholder="Email" id="email" onChange={this.UpdateField} />
                  <input type="password" name="password" placeholder="Password" id="password" onChange={this.UpdateField} />
                </div>
                <button onClick={this.Submit} type="button">Confirm</button>
                </form>
            </div>



        )
    }
}

export default SignUp;

----------------------------------------------------------
const express = require('express')
const router = express.Router()
const db = require('../database.js')
const mysql = require('mysql')

const connection = mysql.createConnection({
    host: 'localhost',
    user: 'root',
    password: 'password',
    database: 'mydb'
  })

connection.connect(function(err) {
    console.log("connection to DB sucessful")
  if (err) throw err

});


router.get('/', (req, res) => {
    res.json('A SUCCESFUL FETCH on /')
})

router.post('/reg', (req, res) => {

        const email = req.body.user.email
        const password = req.body.user.password
        console.log(email)
        console.log(password)
        let sql = `INSERT INTO table1 (Username, Password) VALUES ('${email}', '${password}')`

        connection.query(sql, function (err, result) {
            if (err)
                throw err;
            console.log("1 record inserted");
            res.send(JSON.stringify(result));
        });

    })

module.exports = router