Home > Back-end >  Creating a login page for users in react
Creating a login page for users in react

Time:02-24

Im new to react but have some experience with php/wordpress, I have created a login form, its currently not got any user to login to, with wordpress you add a connection to a database and the users data is stored in a database (e.g mysql) and you can use logic to allow user to login, would you do the same with react.

import React, { Component } from "react";


export default class Login extends React.Component
{
    constructor(props)
    {
        super(props);
        this.state ={email:"", password:""};
    }
    render()
    {
        return <div className="col-lg-9">
            <h4 className="m-1 p-2 border-bottom">Login</h4>
            <div className="form-group form-row">
                <label className="col-lg-4">Email:</label>
                <input type="text" className="form-control" value={this.state.email}
                onChange={(event)=>{this.setState({email:event.target.value}); console.log(this.state.email);}}/>
            </div>
            <div className="form-group form-row">
                <label className="col-lg-4" value={this.state.password} 
                onChange={(event)=>{this.setState({password:event.target.value}); console.log(this.state.password);}} >Password:</label>
                <input type="password" className="form-control"/>
            </div>
            <div>
                <button className="btn btn-primary" onClick={this.onLoginClick}>Login</button>
            </div>
        </div>;
    }
    onLoginClick = () =>
    {
    };
}

CodePudding user response:

The function onLoginClick function will send email and password to the server and will receive the return results, from which we will process if the results return true and false.

CodePudding user response:

I will recommend you to use MongoDB [using mongoose library] here

Whereas if you want to use MySQL then Checkout : MySQL with NodeJs

For MongoDB one You might need to create a backend server

For eg. with express.js you can create a RESTFul API to interact with Database

You Can Checkout some Online Courses for Express and MongoDB

Some Useful Links

  • Related