Assignment 7: List/View Pages. Due Monday, August 2nd.
For this assignment you will need to build custom (meaning personalized) list & view pages, modeled after the 'muffins' example from the List/View lesson. These pages could be adjusted to match the final goal of your site, in which the items featured will appear. Download List/View Package
To get the most out of this class, I recommend thinking of using your database to store items that can be thought of as an inventory. If you plan to sell or display things, for example, you could build a table of pictures, CDs, books, articles, artwork or crafts.
A prior student of the class built a list/view application on bicycle hazards
You will need to build this table in MySQL, and feature the data (items) on your "list" and "view" pages.
All pages (however) must have the entire look and feel of your site design, in that the pages must include your custom nav, header and footer as appropriate.
All "view" pages need to feature a "custom" (unique) image! Customers need to know when they are on a different page, and a custom image is a good way to let them know. If you are doing a calendar site, you could use number "images" to indicate the date, etc.
YOU MUST HAVE AT LEAST 20 TOTAL ITEMS FEATURED. If you don't have 20 items, fabricate believeable material, that can be deleted later!
Once your list/view pages are functional, link your list page on your "final" website.
All your site documentation pages need to be updated! BLOG ENTRY REQUIRED EVERY WEEK NOW OR POINTS OFF!
Assignment 6: Functional Includes. Due Monday, July 26th.
This assignment will have us re-configure our structural include files and add functional includes to create a unified site architecture.
Doing so will allow us to store DB credentials, error & session handling and PHP configuration settings and apply these sitewide. Install the pages as described in the handout below:
nmCommon
Once you have these application pages installed, be sure to swap the header, footer and stylesheets for your own. This will include a bit of surgery. Follow the handout closely on this point.
All of the involved files must show up in your page descriptions.
Once done, link a database page such as model_mysql.php (with your include files applied) as Assignment 6 on your construction page.
From this point on, all documentation, including your blog, must be kept up - every project from now on expands upon the same final project.
Extra credit? Install the phpDocumentor to bring your page documentation to life for 40 extra points!
Assignment 5: phpMinAdmin. Due Wednesday, July 21st.
This assignment will have us install a PHP application designed for developers to interface with MySQL. Right click and download the following file:
phpMinAdmin
View the word document for installation instructions.
Once you have the application installed, test it, and then link it on your construction page.
Having this application linked on your construction page will allow you to work with MySQL from what could become your 'home base' for development.
Once the application is built, you can supply your MySQL credentials (username, password, database) to edit your data.
Access to this application is controlled by sessions stored on the server. We'll cover sessions and state maintenance more completely in the coming weeks.
If you are going to be building your final project on Zephir, note the reference to 'sessions on zephir' in the instructional word document.
Anyone NOT installing on Zephir will NOT need to follow the 'sessions on zephir' instructions. However, to do so is to increase security on your shared hosting site.
Assignment 4: reCAPTCHA Email Contact Form. Due Monday, July 19th.
This assignment will be to build a contact form to allow users to contact the owner of your website. This contact form will consist of a single page postback application designed to integrate the reCAPTCHA system to prevent form spam. Please download the following ZIP file and read the word document inside it for installation details:
reCAPTCHA Email Contact Form
Most websites need a way to allow users to contact the site’s owners. It’s no longer advisable to place an email on a website, as emails can be harvested and their owners become targets for spam.
To avoid the email spam problem we can build a contact form for users to contact our clients. Using a form instead of placing an email on a website is both safer and more convenient.
CAPTCHA is a type of challenge-response test used on web pages to ensure that a form response is not generated by a machine. A typical CAPTCHA requires a user type letters or digits presented via a distorted image.
reCAPTCHA is a free CAPTCHA web service that helps to digitize books, newspapers and old time radio shows. The website owner must download an API file that will contact the reCAPTCHA server that will both serve up the image and provide feedback to ensure a human is entering data in our contact form.
For this assignment you will integrate the reCAPTCHA system in the contact.php page per the instructions. Once this form is working, you will need to incorporate the 'look and feel' of your template by adding your header and footer to this file.
All involved files must show up on your file description spreadsheet.
Remember to also update your blog!
Assignment 3: Troubleshooting Exercise. Due Monday, July 14th.
This assignment will be to troubleshoot a PHP page called "adder.php". Before the errors were added to it, the page was designed to add 2 numbers via a form field, and produce the correct answer. Here is a link to the repaired version:
adder "repaired"
In the attached word doc, you will find some instructions, and the "damaged" version of "adder.php". Please print this word doc, (if you have not already done so) and follow the directions on the sheet. Copy the code from the word doc to begin troubleshooting.
When you are done, you will be linking the finished product to your construction page. If you are unable to complete the troubleshooting, track all of the functional errors you find, and detail them on a word document (etc), for partial credit. Be sure to track the errors you find right away when you start troubleshooting, in case you can't find all of them!!
IMPORTANT: Resist the urge to troubleshoot without allowing PHP to 'help' show you errors. It's much more important that you learn how PHP attempts to help you find errors and where that fails.
Below is a link to the word document with the damaged code, and instructions for the assignment:
Assignment 3: Adder word doc
HINT: For troubleshooting techniques refer to Troubleshooting Lesson!
Assignment 2: HTML & PHP Templates. Due Monday, July 12th
For this assignment you will need to decide on the look and feel for your site (at least temporarily).
You will first create an HTML 'template' page, that will carry the basic look and feel of your website, and will function properly in all browsers you choose to support.
Be sure your template 'behaves' in at least Internet Explorer and Firefox! You need to fix ALL html errors before going to the next step!
Once you have your HTML template, you will split that file up into functional include files, based on work in class and the includes lesson page. The page thus created will be the 'starting point' (or model) for all your other pages.
This 'starting point' we'll call the PHP Template (since we'll keep the HTML template as well for reference).
Your PHP Template must be functional, and feature at least 2 include files. At a minimum, these would be a header and a footer. The footer must feature a dynamic copyright.
Design Challenged? (I know I am!) Feel free to use an open source design for example from oswd.org or openwebdesign.org!
As a last resort, feel free to use the following PHP template as a starting point. Remember to at least change the colors to make it your own look & feel: PHP Template
Update all applicable documentation, most specifically the 'page description' and 'weblog'.
Please link the assignment as target="_blank" on your construction page (this is the default for google docs).
So what is ACTUALLY due for Assignment 2?:
- A HTML template page (images, css?) featuring the look and feel of your website, that functions consistently in IE/FF
- A PHP template page that must be composed using at least 2 include files
- All involved pages (HTML Template, PHP Template, include files) must show up on your Page Description (spreadsheet)
- One of the include files must feature a dynamic copyright (PHP Fundamentals lesson)
- All documentation (page desc., etc.) must be up to date
I will start taking points off for lack of documentation. Keep those documents up to date!
What to blog?
- Time spent!
- Tasks achieved!
- Problems/observations!
Assignment 1 : Developer Documentation Due Wednesday, June 30th
Assignment 1 will lay the groundwork for your final project, a dynamic web site.
Benefits: Developers benefit from tracking work they have done. By knowing how long things take to build, we can bill our time. By detailing the work we have done, others can make updates and changes to our work.
For this assignment you will develop documentation resources so you can keep them up to date, and online so I may follow your progress. These resources will be linked to a construction/homework page. Only the Blog will be updated, initially.
The type of file is not as important as the data that will later be stored in it. With the exception of the blog, You may use text files, spreadsheets or HTML pages for each All resources should be linked to your homework page as target="_blank". The resources will be as follows:
A) Blog: Create a blog in which you are to document your daily progress as you plan, design and build your dynamic website. Here you will:
- Make daily updates of your progress and time spent on assignments & tasks
- Document problems encountered and what you learned
- Document next steps in your project, and courses of action you are considering
This blog may include code snippets, etc. The blog must:
- Be setup for public comment, so that I may easily respond to your posts.
- Be kept up to date, with time spent on each assignment (time on task) every time you work, or points may be deducted
If you are unfamiliar with setting up a blog use the following: Blogger Instructions
B) Project Plan: This resource will define the main goals, functionality and potential obstacles of your final project. the Project Plan is important because it:
- Forms a referential starting point for the project
- Protects developer & client by defining expectations
- Identifies execution strategies on difficult or important project aspects
Typically the Project Plan follows the Cient Survey, and forms the basis for commencing work for the client. For more, here's a sample chapter from 'Web ReDesign 2.0 Workflow That Works': Define The Project
Besides identifying the purpose and audience of the site, you can use the Project Plan as a development resource to:
- Identify functionality to be implemented
- Specify naming conventions
- Define database tables and SQL statements
- Identify design issues such as styles or colors
- Identify third party software or APIs to be used
I recommend using the Project Plan as a place to store any important ideas related to your project. As such an online tool such as a google doc is a good choice for this resource. Sample Project Plan
C) File Description: Once we begin building web applications we'll find we'll see many related files such as images, stylesheets, JavaScript file and include files participate in creating what we view as a 'web page'. If we keep track of each of these files as we add them, we can build a reference to hand our customer or to give developers to help us maintain the site. A spreadsheet (google doc, excel, etc.) makes a great format for describing site files. Each line of a File Description could include:
- File Name: The name of the file
- Description: A description of the file's purpose
- Related Files: An indication of potentially related files
- Notes: Interesting file details or state of the file
The 'Notes' field above is a great place to indicate a file that needs work, etc., thereby turning the File Description into a reference to be used during developement.
A completed File Description is a significant part of a client packet, wherein copies of a CD of all site files, assets (images, PDF files) and documentation of the completed project are be kept by the developer and delivered to the client. Sample File Description Spreadsheet
D) Construction Page: Build a "construction" (homework) page that provides convenient links to your resources as described above as well as links to "user viewable" pages as you complete them. This "page" could be a simple web page such as you may have build for your WEB110 class, or even a google doc.
If you decide to use a web page, name it something like 'const.php' to avoid a customer useable page name. This page will allow me to quickly view your blog, site pages, Project Plan and assignments. All should be clearly identified and linked from this single page. Any information I need to know about your work should accompany your links. All resources should be linked to your construction page as target="_blank".
When you are done building and linking the files above to your construction page, please login to the class site, (at the top right on the home page) click the 'Update Profile' link, and change the address to reflect the absolute web address (URL) of your 'const.php' page in the Construction Page URL field, which will allow me to find your work. Sample construction/homework page
So what is ACTUALLY due for Assignment 1?:
- Your construction page needs to be operational, with links to the resources as outlined above
- Your profile needs to be updated to reflect the link to your construction page
- The Blog needs to be updated with the time spent on these tasks
IMPORTANT: All of the files above, with the exception of the blog, will be virtually empty, at this point. As we go forward, and you build your pages, I will be expecting you to update your resources regularly.
