Authentication App

Solution for a challenge from Devchallenges.io.

Solution | Challenge

Table of Contents

• Overview
  • Built With
• Features
• How to use
• Contact
• Acknowledgements

Overview

ETC: ~75h

Built With

• Create React App
• Express
• mongoose
• React
• Redux
• Redux Toolkit

Features

This application/site was created as a submission to a DevChallenges challenge. The challenge was to build an application to complete the given user stories:

• User story: I can register a new account
• User story: I can log in
• User story: I can log in or register with at least one of the following services: Google, Facebook, Twitter or Github
• User story: I can sign out
• User story: I can see my profile details
• User story: I can edit my details including: photo, name, bio, phone, email and password
• User story: I can upload a new photo

How To Use

To clone and run this application, you'll need Git and Node.js (which comes with npm) installed on your computer. From your command line:

Run the project

Authentication app holds two main folders server and client.

server

create .env inside ./server file with data (check .env.example)

# install packages
cd server && npm install

# start server
npm start

client

From another terminal window:

# install packages
cd client && npm install

# start React app
npm start

Acknowledgements

• ::first-letter
• Detect click outside React component
• Handling Thunk Errors
• How to start node app with development flag?
• How to validate formik & Yup validation with file type and size?
• material-ui, findDOMNode is deprecated in StrictMode
• Mocha, Arrow Functions
• modify password with expressjs mongoose passport-local
• node-oauth-example
• On css: if text line is break show dots
• Passing variables to the next middleware using next() in Express.js
• Thoughts on User Passwords in REST APIs
• Troubleshooting authorization request errors
• Updating Documents in Mongoose
• Using HttpOnly cookies in React & Node | Storing JWT Tokens or SessionID Securely
• Validate phone number with Yup?
• What HTTP error code to return for name already taken?
• What's a good way to extend Error in JavaScript?
• Yup, I want either an email or an empty string

Contact

• GitHub @RauboLuk
• Stack Overflow @RauboLuk