Blog Home Page

Pre-Reqs

In this step we are going to work on the blog pages for the site. The blog pages will get their content from the database, so we'll start off by setting it up in PHPMyAdmin. We'll also have to create a few other files before we start on the blog home page. Up until now, we have used the procedural style of programming in PHP. Now we'll start using classes and objects in our code. (I debated on whether or not to use inheritance right away, but decided not to, just to keep things simple).

Setting Up The Database

  1. Open PHPMyAdmin and create a new database called my-new-site
  2. In the 'my-new-site' databse, run the SQL statements here. You should be able to copy the entire contents of the file and run all the queries at once. The SQL queries will create two tables, pages and categories. They also insert some 'dummy' data into the database for us. We'll discuss the tables and columns. Note that the 'path' column in the 'pages' is a bit of a mystery now, but it will be used to greatly improve our SEO in the future. Note that the SQL adds two 'test' blog posts, just to give us something to work with.

Add code to the config file to connect to the database

We'll add some code that connects to the database. And since a few of our pages will use this code, we'll put it in the config file.

  1. Add the following constants to the config file: DB_HOST, DB_USER, DB_PASSWORD, DB_NAME. Note that they will be set to different values on the dev and live environments. The code should look like this. For the dev settings, you should be able to use the same values for each of the constants that are in the screen shot. Later, we'll set up the database on the live site, and you'll change the values for connecting the the live database later.
  2. Add this code to the bottom of the config file. We'll discuss this code in class, but for now just note that the function will initialize the $link variable (which represents our connection to the database), if it has not already been initialized.

Create the PageDataAccess class

Note that our book duplicates a lot of code when it comes to accessing the database. We are going to take a turn toward object-oriented PHP now. Instead of putting SQL queries directly in our web pages (as the book does), we will put all SQL queries regarding blog pages into a class. This will make our code more flexible, re-usable, maintainable, modular, and testable. When we add a new page to our site that needs to access the database, we'll use this class rather than duplicate the code in each page.

  1. Create a file in the includes folder called PageDataAccess.inc.php. Note that the file name starts with a capital P, which indicates that this is a class. This is the code you should put in it.

    Study this code (maybe I should have forced you to copy it from a screen shot)! If you don't understand any of it, please ask questions in class. Note that there is no closing php tag (?>) because this is an include file. We may need to discuss the DATE_FORMAT() function in MySQL (the %e shows the month number without leading zeros). We should discuss why I use OR handleError() instead of die() - when your dead your dead! By using handleError() we can do things such as redirect to our friendly error page.

    We will test this code in the next page that we create.

  2. Create a new folder called tests and put it inside the my-new-site folder.
  3. Inside the tests folder, create a file named page-data-access-tests.php Then put this code into the page.
  4. Open the test page in the browser, and make sure it's properly fetching the data from the database. Now we have the confidence to know that our data access code is working properly before we use it in the blog home page. This is a very crude form of unit testing.

Hooking up the Blog Home Page

  1. Open the blog home page (blog/index.php)
  2. Add this code just under the link to the config file.
  3. Add this function to the bottom of the page.
    Study the function, make sure you understand its parameter, its return value, and the code inside it.
  4. Finally, let's invoke the function we just created and echo out the html string that it returns. The PHP code should go just under the the H3 tag on the page. You can remove the P tag that is currently under the H3 tag. Your code should look like this.
  5. Open the blog home page in the browser. Note that the blog post links to a page that we have not yet created. We'll create that page in the next step of the project. Also note that the html code generated by createBlogList() includes links that have query string variables in the URL. The variable is named pageId and it's value is the associated blog post id in the pages table. Also note that URL query string variables are also called url parameters.

Follow Up Questions:

  1. How do you create a constructor function in PHP 7?
  2. Your book uses OR die(mysqli_error()) to handle database errors. What's the problem with this approach?
  3. How does the getDBLink() function ensure that no matter how many times it's invoked, it will only ever create a link/connection one time?
  4. What is the purpose of the DATE_FORMAT() function in MySQL?
  5. Explain the difference between this date format specifier: %m/%e/%Y and this one %m/%d/%Y
  6. What is the purpose of the optional parameter in the getPageList() method?
  7. Describe the $pageList variable that gets returned from the getPageList() method.
  8. What is an XSS attack? And how can you prevent one from happening?