我们将使用React和Express创建一个登录系统。首先我们创建前端代码，然后创建一个后端应用，最后我们将这两个部分连接起来。

这个任务涉及到的代码相对较多，下面给出的代码仅供参考，你可能需要根据你的实际需求进行修改。

1. 前端部分（React）

在src文件夹中，创建Login.js文件，代码如下：

// src/Login.js
import React, { useState } from 'react';
import axios from 'axios';
import { useHistory } from 'react-router-dom';

function Login() {
    const [username, setUsername] = useState('');
    const [password, setPassword] = useState('');
    const history = useHistory();

    const handleLogin = async () => {
        try {
            // 这里的 URL 地址需要替换为你的服务器地址
            const res = await axios.post('https://your-server.com/login', { username, password });
            if (res.data.status === 'success') {
                history.push('/welcome');
            } else {
                alert('登录失败，请重试');
            }
        } catch (error) {
            console.error(error);
        }
    };

    return (
        <div>
            <input
                type="text"
                placeholder="用户名"
                value={username}
                onChange={(e) => setUsername(e.target.value)}
            />
            <input
                type="password"
                placeholder="密码"
                value={password}
                onChange={(e) => setPassword(e.target.value)}
            />
            <button onClick={handleLogin}>登录</button>
        </div>
    );
}

export default Login;

创建Welcome.js文件，代码如下：

// src/Welcome.js
import React from 'react';

function Welcome() {
    return <div>Hello ~</div>;
}

export default Welcome;

修改App.js文件，加入路由信息：

// src/App.js
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import Login from './Login';
import Welcome from './Welcome';

function App() {
    return (
        <Router>
            <Switch>
                <Route path="/login">
                    <Login />
                </Route>
                <Route path="/welcome">
                    <Welcome />
                </Route>
            </Switch>
        </Router>
    );
}

export default App;

2. 后端部分（Express）

在你的后端项目中，首先创建app.js文件，用于启动服务器和处理请求：

// app.js
const express = require('express');
const bodyParser = require('body-parser');
const loginHandler = require('./loginHandler');
const app = express();

app.use(bodyParser.json());

app.post('/login', loginHandler);

app.listen(3000, function () {
    console.log('App is listening on port 3000');
});

然后创建loginHandler.js文件，用于处理登录请求：

// loginHandler.js
const { checkUserCredentials } = require('./db');

module.exports = async function (req, res) {
    const { username, password } = req.body;
    try {
        const result = await checkUserCredentials(username, password);
        if (result) {
            res.json({ status: 'success' });
        } else {
            res.json({ status: 'fail' });
        }
    } catch (error) {
        console.error

(error);
        res.status(500).json({ status: 'error' });
    }
};

最后，创建db.js文件，用于连接数据库和检查用户凭证：

// db.js
const mysql = require('mysql2/promise');

async function checkUserCredentials(username, password) {
    const connection = await mysql.createConnection({
        host: 'localhost',
        user: 'root',
        password: 'your-password',
        database: 'your-database'
    });
    const [rows] = await connection.execute('SELECT * FROM Users WHERE username = ? AND password = ?', [username, password]);
    connection.close();
    return rows.length > 0;
}

module.exports = {
    checkUserCredentials
};

以上代码中涉及的数据库连接和SQL查询都需要根据你的实际情况进行修改。同时也需要注意安全性的问题，比如防止SQL注入和使用密码哈希等。

这样就完成了一个基本的登录系统的搭建，用户在前端页面输入用户名和密码，点击登录后，前端向后端发送请求，后端再与数据库进行交互，最后返回登录结果给前端。