Sign In - Sign Up App

This is a small app or a project which you can fork on your future Apps , it contains the Login process with a Database and Google - Facebook - Github (LinkedIn and other platforms are on demand) , also it alows to create a normal user in db With an email address

Table of contents

• Overview
  • How To Use
  • The Challenge
  • Screenshot
  • Links
• My process
  • Built with
• Author
• Acknowledgments

Overview

How To Use

• First of all , After Foring the project ,you should create a .env file on the following path ( server/config ) for the Secret Keys of each platform and link to your DB, then fill in the following Form and past it on the file

---

PORT= your port number
MONGO_URL= Your MongoDB Url
GOOGLE_CLIENT_ID     = Google Client ID  (Check bellow for more informations)
GOOGLE_CLIENT_SECRET = Google CLient Secret  (Check bellow for more informations)
CookieSecret         = your coockie secret , it can be any chossen word
GITHUB_CLIENT_ID     = Github Client ID  (Check bellow for more informations)
GITHUB_CLIENT_SECRET = Github Secret ID  (Check bellow for more informations)
FACEBOOK_APP_ID      = Facebook App ID  (Check bellow for more informations)
FACEBOOK_APP_SECRET  = Facebook App secret  (Check bellow for more informations)

---

• Google Client ID = Click Me !
• Google Client Secret = Click Me !
• Github Client ID = Click Me !
• Github Client Secret = Click Me !
• Facebook App ID = Click Me !
• Facebook App Secret = Click Me !

The challenge

Users should be able to:

• Login in using Email and Password ( from Database)
• Login Using Social Media Platforms Like ( Google , Facebook,Twitter...)
• Sign up an account on the Database
• Edit Informations like UserName,Password,Avatar...

Screenshot

Sign In Page :

Sign UP Page :

Home Page :

Error Page :

Links

• Solution URL: Click me !!

Built with

• Semantic HTML5 markup
• CSS custom properties
• Bootstrap
• Flexbox
• JavaScript
• NodeJs
• ExpressJs
• Body Parser
• PassportJS
• DotEnv - Encryption
• MongoDB - Database
• Mongoose - Database Library
• FontAwesome - Icons Library

Author

• Github UserName : AymenDev1
• Portfolio : Click me !
• LinkedIn Profile :Click Me !