Web Design Lab #5: MySQL/PHP Login System

Two classes ago, you followed a tutorial to build a basic login system for a website. You created a MySQL table and then copied in the code for an HTML page using the Bootstrap framework so that someone can create an account, login to it, and logout.

The code utilized a PHP USER class and PDO for the database connections.

The purpose of this lab is to extend upon what you've done to create a more functional and useful website that allows for:

  1. Login Tracking
  2. Password Changing
  3. Blog Posting

Project Description

  1. Login Tracking
    1. Will need a MySQL table - in PHPMyAdmin, copy/paste/run the query below to create the table.
      2. CREATE TABLE `dblogin`.`logins` ( `login_id` INT UNSIGNED NOT NULL AUTO_INCREMENT , `user_id` INT UNSIGNED NOT NULL , `timestamp` TIMESTAMP NOT NULL , `ip_address` VARCHAR(15) NOT NULL , PRIMARY KEY (`login_id`), INDEX `user_id` (`user_id`)) ENGINE = InnoDB;
    2. Insert this info at time of login
      - update the login function in the USER class (class.user.php) to insert the user_id and IP Address into the table. ($_SERVER['REMOTE_ADDR'])
  2. Password Changing
    • Create a new page (change_pword.php) that is linked to HOME.php for someone to change the password
    • Confirm current/enter new one twice
      Via JQuery, confirm that the new one (and its confirmation) are the same
      If YES, post the data.
      First - confirm (via MySQL) that the current one matches what was typed
      Second - if yes, make the update, if no, do not change Pword and show an alert
    • OPTIONAL EXTENSION (If done with the blog post) - Research AJAX and using a $.post() function call to check the current password withOUT a page refresh
  3. User blogs
    • Create a new page (make_blog_post.php) that is linked to HOME.php
    • Create a table for the blog posts
      CREATE TABLE `dblogin`. blogpost ( `ID` INT UNSIGNED NOT NULL , `user_id` INT UNSIGNED NOT NULL , `title` VARCHAR(60), `user_posting` LONGTEXT NOT NULL , `post_timestamp` TIMESTAMP NOT NULL , PRIMARY KEY (`ID`), INDEX `user_id` (`user_id`)) ENGINE = InnoDB;
    • Make blog post
      Have a standalone text field at the top for the 'Post Title'
      Use https://www.tinymce.com/ as the editor
      Save the post, updating the title, user_id and user_posting (ID and post_timestamp are auto-generated)
    • Create a new page (blog_posts.php) that is linked to HOME.php
    • When viewed, it should show a table of blog posts in DESC date order showing the date, Author, Title
    • Clicking on any part of any row should load a page called 'show_blog_post.php' that displays at the top the Title, Author, Blog Post Date, and then the post.
    • Optional Extensions - IF Looking for more/have time
      • Edit blog post - Button to load post in editor for editing
      • First paragraph 'free' -- additional content behind 'login-wall' (therefore check if viewer of post is logged in)
      • Track views

Grading - 60 pts