CREATING A PHP CMS

with Dreamweaver using jQueryMobile

Introduction

Below are some links to general information about this tutorial:

  1. Prerequisites
  2. Overview of Structure
  3. Executive Summary
  4. Overriding Principles and Best Practices
  5. Techniques Used In Training

Prep, SSI and Database

Prep (Check Components):

  • Check Server
  • Check Database
  • Check PHP
  • Turn On Debugging
  • Setup Error Reporting

Create Server Side Includes (SSI) and Pages:

  • Create Ordinary Page
  • Create Include Files
  • Create Template
  • Create Home Page
  • Create All Other Pages

Database (Create/Connect/Communicate):

  • Create Database
    • Install XAMPP
    • Normalize Data (Info Only)
    • Create Database
    • Create Tables
      • Create First Table
      • Create Other Tables
      • Relate Tables
      • Populate Tables
      • Create A User And Set Privilege
    • Export Database (Backup)
      • Review *.SQL File
    • Import Database
  • Connect To Database
    • Setup Server
    • Connect To Database Server
    • Handle Errors
    • Select A Database
      • Close Connection
  • Communicate With Database
    • Test Database
    • Create Connection Script

Resource Links


Images Used In Tutorial (Zip file)
jQuery Framework (Zip file: may not be the latest versions)
Final Project (Zip file: will need to config for your local system or ISP)

CMS Pages

The following CMS pages will be created. Click on a panel's link to see details for page.

1. Add Page

  • PART A: CREATE STATIC CONTENT
    • Create Static Form and Form Elements
  • PART B: ADD DYNAMIC SCRIPTS
    • Add SQL INSERT Recordset Script
    • Add Redirect User To Another Page Script
  • Option 1: Validate Form Elements
  • Option 2: Populate Menu Dynamically

2. Master Page

  • PART A: CREATE STATIC CONTENT
    • Create Static Button
    • Create Static Listview
  • PART B: ADD DYNAMIC SCRIPTS
    • Add SQL SELECT Recordset Script
  • PART C: REPLACE STATIC CONTENT WITH DYNAMIC CONTENT
    • Make Query String And Tooltip Dynamic
    • Make Department Name Dynamic
    • Make Image Reference Dynamic
  • OPTION 1: Display Total Records
  • OPTION 2: Add A Dynamic Time And Date
  • OPTION 3: Provide An Avatar
  • OPTION 4: Create a Pagination Scheme
  • OPTION 5: Display Message If No Record Is Found

3. Detail Page

  • PART A: CREATE STATIC CONTENT
    • Create Static Image
    • Create Static Table
    • Create Static Button
  • PART B: ADD DYNAMIC SCRIPTS
    • Add SQL SELECT Recordset Script
  • PART C: REPLACE STATIC CONTENT WITH DYNAMIC CONTENT
    • Make Image Dynamic
    • Make Dynamic Table
    • Make Button Button
    • Make Confirmation Dialog Box Dynamic
  • Option 1: Create Non User Data
  • Option 2: Provide An Avatar
  • Option 3: Create Alternating Row Colors

4. Delete Page

  • ADD DYNAMIC SCRIPTS
    • Add SQL DELETE Recordset Script
    • Add Redirect User Scrip

5. Edit Page

  • PART A: CREATE STATIC CONTENT (From Add Employee Page)
    • Create Static Image
    • Create Static Table
    • Create Static Button
  • PART B: ADD DYNAMIC SCRIPTS
    • Add SQL SELECT Recordset Script
    • Add Dynamic Variables Script
    • Add SQL UPDATE Recordset Script
  • PART C: REPLACE STATIC CONTENT WITH DYNAMIC CONTENT
    • Make Department Combo Box Dynamic

6. Search Page

  • PART A: CREATE STATIC CONTENT
    • Create Static Form
    • Create Static Message Paragraph
    • Create Static jQuery Listview
  • PART B: ADD DYNAMIC SCRIPTS
    • Add Conditional Script
  • PART C: REPLACE STATIC CONTENT WITH DYNAMIC CONTENT
    • Make Total Record Dynamic
    • Make Query String and Tooltip Dynamic

7. Login Page

  • PART A: CREATE STATIC CONTENT
    • Create Static Login Form
  • PART B: ADD DYNAMIC SCRIPTS
    • Add Login Script
    • Add Error Message Script
    • Add Server Variables Script
    • Add Logout Script
    • Add Restrict Admin Pages Script
    • Add Session Variables Script
  • OPTION 1: Forgot Password
  • OPTION 2: Remember Me Checkbox
  • OPTION 3: Registration Link

8. Registration Page

  • PART A: CREATE STATIC CONTENT
    • Create Static Form and Form Elements
  • PART B: ADD DYNAMIC SCRIPTS
    • Add Sticky Form Script
    • Add Validate Form Fields Script
  • Option 1: Send Confirmation Email
  • Option 2: Check for Unique Username
Preview Final Project

Enhancements

BASIC

Accessibility:

  • Add Language Attribute
  • Add Alternative Text

Nice To Have

  • Create a Paging Navigational Scheme (IMPORTANT)
  • Return Total Number of Records (COMPLETED)
  • Add A Dynamic Time and Date (COMPLETED)

Best Practices

  • Output Buffering (COMPLETED)
  • Provide an Avatar Icon (COMPLETED)
  • Upload Image (IMPORTANT)
  • Use Multiple Tables (IMPORTANT)
  • Create Sticky Form (pg. 214) (COMPLETED)
  • Remove Recordset ()
  • Alternate Row Colors (COMPLETED)

ADVANCED

Automation:

  • Add a Dynamic Year (COMPLETED)
  • Send Confirmation E-mail (PHP Third Edition page 222-226)
  • Dynamically Populate A Menu (COMPLETED)

Validation:

  • Validate Form itself (COMPLETED)
  • Validate Certain Input Form Elements (IMPORTANT)

Security

  • Prevent SQL Injection (IMPORTANT)
  • Prevent XSS Attack (See w3School for example) (IMPORTANT)
  • Use Cookies and SESSION Variables
  • Forget Password link
  • Create Remember Me Checkbox
  • Check for Unique Username
  • Restrict File Access (Locking file)
  • Secure Query Data (pg. 368)
  • Create Logout Function

Miscellaneous:

  • Use Dynamic Radio Buttons
  • Use Dynamic Check Boxes
  • Delete Images in  Folder
  • Display Non User Data (COMPLETED)