Communication and Employability Skills – Assignment 4 – Excerpt

Personal Development Diary [P8]

Entry One: Sunday 8th February

I have analysed the directories of the project and read sections of most of the files. I have also used web development tools available on the Chrome web store to analyse in more detail the responses generated by the server running the website when sent particular requests. I have built a mental map of the website, including which elements of it are complete and which parts still require attention. I am also now more aware of the time that particular parts of the website will take to make, meaning I will be able to better judge my progress as I work on the project and to know if I am ahead or behind schedule.

I made some changes to the directory structure of the project as well, moving all images, JavaScript and CSS into an assets folder. I also researched online for a templating system like the popular Liquid, written in the PHP programming language, which I'm already using, rather than Ruby. I found that Liquid has in fact been ported to PHP, and made available in a repository on GitHub. I may decide to use this as part of the email templating system.

Entry Two: Monday 9th February

I have spent time completing the contact form system. I decided against using a Liquid templating library for PHP, and instead implemented as much code as would actually be required by the project. I also spend time changing the front-end JavaScript. Using jQuery, I was able to make animations occur at the right time, and to make the interface overall more user-friendly. As an example, when the form has been completed and submitted; the data has been validated; and the server has responded with a success message, the form fields slowly fade out, and then fade back in after being emptied. The green tick that appears in the submit box, indicating that the message has been sent, also fades out after 5 seconds, returning the form to its original state. The form can be used several times if the user wishes.

Entry Three: Friday 13th February

The gallery page has been completed, and the images can be easily viewed. The gallery page back-end connects to the database that stores information about each of the items (that will show on the shop page). Based on the number of entries in the MySQL table, the PHP script generates the right amount of HTML to show each of the images on the server.

Because this page of the website was completed in a smaller amount of time than I had originally expected, I was able to move onto the next part of the project – the shop pages – earlier than I had planned.

Entry Four: Monday 16th February

The shop section of the website was completed on-time, and it allows users to select items from an extensive list. Items are added to an easily-accessible basket at the bottom of the page, and can be easily removed. As long as at least one item is present in the basket the user is able to proceed to the contact page. The list of items picked from the shop page will be appended to the message, and the subject line of the resulting email will be changed accordingly. The reason behind adding the items to a message rather than processing the bank-card credentials of a user is the nature of the website. The products on sale are hand-crafted, and a sudden demand couldn't necessarily be met. By adding the order to a message, the customer is able to add a more personal message, perhaps adding more information about what they would like to purchase. The prices outlined on the shop page are also subject to change, and are rough to begin with. The ordering system allows the owner of the website to give the customer a more accurate quote as to the final price, and payment can then organised.

Entry Five: Friday 20th February

In order to finish the project and make the website easily accessible, I made some further changes to various parts of the website, and committed them in revision control. I was then able to log in to the webserver using SSH, and pull the new changes to it. Changes included alterations to the gallery page; reorganisation and some reformatting of the source code; minification of HTML, CSS and JavaScript in order to lessen the amount of data downloaded by a visitor; and optimisation of SQL database queries.