This application keeps track of a person's job history, references, educational history, and skillset. I wrote it to demonstrate a LAMP application built with an MVC architecture.
I developed the application on an EeePC running a version of Debian linux, an Apache 2 webserver, a MySQL database server, and PHP 5. The code was written using the ee linux editor.
The model is a MySQL relational database consisting of two tables so far: jobs, and organizations. The plan for the database includes three additional tables: persons, education, and skills. Each table has a unique primary key. All data can be referenced using either the primary key or a foreign key.
The view consists of xhtml compliant markup and stylesheets. To increase accessibility for text-based browsers and reader applications for the blind, tables are not used for the layout. For such browsers, the webpages remain usable and logical.
To increase legibility for the near-sighted, all dimensions are given in ems rather than pixels or other units. This ensures that all proportions remain correct if the user has a larger default character size set, or increases (or decreases) the character size.
To provide maximum compatibility for differing monitor sizes, the width of the browser page is set to 40ems. This provides a readable width for the screen while still fitting on most monitors without horizontal scrolling.
The plan calls for additional stylesheets for printing and for mobile devices.
I use PHP utitlities files to access and manipulate the database tables. A table object class is set up for each table, consisting of an element for each field in the corresponding table, and three methods corresponding to three types of SQL queries.
The php files that create the markup pages feed information about the table data into the markup as well as the data itself. The table name may be passed as a css class for a div, p or other tag. The field name may also be passed as another css class. And especially for input fields on forms, the value of the primary key for the data element may be passed as a css id. In addition, the data item may also be tagged with a css class identifying it as a fieldname or a fieldvalue.
List page example: each row from the database jobs table is wrapped in paragraph tags set to a class of "job_row" and an id of the value of the primary key for that row. Each field from that row is wrapped in a span tag set to a class named for the fieldname. This allows the actual sequence of the field values and the width of each column to be set separately using stylesheets.
Information page example: this page displays field information for a single record from the jobs table, and provides the options of inserting a new job, updating an existing job, or simply viewing the information for a job. In the markup, the each field's values are provided in two formats: a span tag set to a class of "fieldvalue" and an id set to the field's name; and an input field tag. The body tag id's name is based on the type of form desired for a given object method.
Based on the body tag id, The style sheet can then determine whether the fieldvalue class and the input tags should be shown or not based on the body tag id. Again, the exact placement of the data on the page and what fields should be shown or not can all be set from the stylesheet.