PHP User Login System with Social Account

php_login_system/
├── index.php
├── registration.php
├── account.php
├── edit-account.php
├── settings.php
├── forgotPassword.php
├── resetPassword.php
├── userAccount.php
├── includes/
│   ├── PHPMailer/
│   ├── social_oauth_lib/
│   ├── config.php
│   ├── socialLogin.php
│   ├── User.class.php
│   ├── validateUser.php
│   └── email_functions.php
├── elements/
│   ├── head.php
│   ├── header.php
│   ├── nav_menu.php
│   └── footer.php
├── assets/
│   ├── css/
│   ├── js/
│   └── images/
└── uploads/
    └── profile_picture/

Files Details & Functionality

1. index.php

   Initially index.php file is loaded with login form and registration page link.

2. registration.php

   This file contains registration form HTML and the form is submitted to the userAccount.php file with a signup request.

3. account.php

   After login, the user ID is available in session and the respective user details are shown using the User class. Also, a logout link will appear if the user already logged in.

4. edit-account.php

   This file is used to update the user profile information. On form submit, the update request is submitted to the userAccount.php file.

5. settings.php

   This file is used to update the login password. On form submit, the password update request is submitted to the userAccount.php file.

6. forgotPassword.php

   This file is loaded when user forgot their account password. On form submit, the reset password request is submitted to the userAccount.php file.

7. resetPassword.php

   This file is used to reset the new password. On form submit, the new password update request is submitted to the userAccount.php file.

8. userAccount.php

   This file controls the registration, login, logout, forgot & reset password, email verification, profile update and password update request. These requests are comes from index.php, registration.php, profile.php, settings.php, forgotPassword.php, and resetPassword.php. The User Class is used to get, insert, and update user details to the users table. Also, PHP Sessions are used to hold the login status of the user.

9. includes/

   All the helper files which are used by the main files are stored here.

   1. includes/PHPMailer/

      PHPMailer library is used to send the email via SMTP server from the script.

   2. includes/social_oauth_lib/

      The social login (Facebook, Google, and Twitter) related OAuth libraries are included in this directory.

   3. includes/config.php

      Site, database, email, and other useful settings are defined here.

   4. includes/socialLogin.php

      This file controls the authentication process for Facebook, Google, and Twitter login.

   5. includes/User.class.php

      User Class handles all the database related works, it contains 4 methods, __construct(), getRows(), insert() and update(). __construct() function is used to connect the database, getRows() function is used to fetch the user data from the database, insert() function inserts the user details to the database, and update() function updates the user details to the database. In this file, you need to change $dbHost, $dbUsername, $dbPassword, $dbName variables value with your MySQL database credentials.

   6. includes/validateUser.php

      This file verifies the user's login status and controls the page redirection.

   7. includes/email_functions.php

      This file contains the email helper functions. These functions are used to send email for account activation and reset the password.

10. elements/

    1. elements/head.php

       Holds the HTML for the head section of the web page.

    2. elements/header.php

       Holds the HTML for the header section of the web page.

    3. elements/nav_menu.php

       Holds the HTML for the navigation menu section of the web page.

    4. elements/footer.php

       Holds the HTML for the footer section of the web page.

11. assets/

    1. assets/css/

       The stylesheet files are placed in this directory.

    2. assets/js/

       The jQuery files are placed in this directory.

    3. assets/images/

       All the image files are placed in this directory.

12. uploads/

    1. uploads/profile_picture/

       User's profile picture are stored in this directory.