Hello Developers
Today I am sharing an example application for user login/registration and secure pages like member area for profile and other sections.
You can find this application full source code at following url...
https://bitbucket.org/deepaksinghkushwah/react-express-login/src/master/
Application is divided in 2 parts, frontend is create in react app using "npx create-react-app" and contain login/registration/member area pages. I have used localStorage for handling login session.
Backend is created using NodeJS+Express+MongoDB. All get started information is added in readme file. This application is example application for new developers who want to learn react/express and want a ready to use sample application.
You need to create .env file in react frontend application with following content...
REACT_APP_SERVER_HOST="http://localhost:5000/api/v1"
This is api url. You can change it in backend and set it in .env file at backend.
There is a seeder for mongodb to populate user table. You can use it with "node seeder.js -i" to import sample data or "node seeder.js -d" to delete user data. Users will be created with "test<1-100>@localhost.com" and password will be "123456". Or you can update seeder as per your need.
Few screenshots....
Home Page
After Login
Registration Page
This may contain bugs so do not use it for production. It's just for showing how login/registration work with react and how to maintain session.
Hope you like it. Happy Coding.
Top comments (1)
Looks good!