Sports Warehouse is a retail company that would like to start selling sports equipment online. The project will be delivered in four stages.
A Photoshop file which contains the desktop design and mobile design for the website.
The company already has web hosting, which is a Linux server running Apache (v2.4+), PHP (v7.3+) and a MySQL database (v5.7+).
The project will be delivered in 4 separate stages. Each deliverable will contain some practical creation of an aspect of the project along with documentation.
Create a one-page website showing the company logo and a message indicating they will be selling sports equipment online soon. The page must contain a contact form that can be filled out by the visitors of the website to ask questions.
Create the contact page. This page will display the company logo and the following text: “Sports warehouse is coming soon. If you have any questions, we would love to hear from you, please complete the following information. “ The form you create gathers the following data from the user:
- First name - required
- Last name - required
- Contact number
- Email address – required
- Question
When the form is submitted the required data needs to be validated using PHP.
Use the provided Photoshop design to create the website home page using HTML and CSS. It will be given to the design manager for approval before it is converted to a PHP website.
For this deliverable the application enables customers to view featured items on the home page, browse, search for items and contact sports warehouse using the contact page. A database needs to be created with the correct tables, columns and relationships. The products and categories are stored in the database.
Click here to visit the website
The home page for the website displays the store’s featured items. These are items that have been marked as featured in the database. Use SQL to retrieve the data. For each item display the item photo, price, sale price (if applicable) and product name.
The items for sale are organised into categories. An item belongs to just one category and categories can have many items. The categories displayed in the website are stored in the database. Use SQL to retrieve the data. These categories are displayed towards the top of the page and in the footer.
The contact page was created in deliverable A – pre-launch. This deliverable involves editing the page layout so it fits with the rest of the site. The contact page can be accessed by clicking on the “Contact Us” link in the top navigation, and at the bottom of the page.
The user can browse the site to view the items for sale. The items can be browsed by selecting the category. When a category is selected all the items that belong to the category are displayed. For each item, display:
- Item name
- Price and sale price if applicable
- Photo of item
The user can search for an item by providing the item name or part of the name. Use SQL to retrieve the data. For each item, display:
- Item name
- Price and sale price if applicable
- Photo of item
When an item is displayed the user can click on the item to view the items:
- Item name
- Price and sale price if applicable
- Photo of item – display a larger photo for the item
- Description of the item
Use SQL to retrieve the data.
- A MySQL database is setup, and the PHP code connects to it with the correct credentials.
- Data for the database is imported into the tables
- Test the database connection works on both the local web server (XAMPP) and the remote web server (Web host)
- Create a class which will handle the database connection and retrieval of data.
- Create a layout template which contains the common elements of the web pages.
- Identify and create templates to separate the user interface from the programming logic.
Create a wireframe /storyboard to demonstrate the customer purchasing functionality.
Add functionality to the website to allow customers to purchase products and to allow staff to maintain products.
Click here to visit the website
Items can be added to a shopping cart for purchase. The customer may purchase as many items as they like.When the customer is checking out, they will need to fill out some personal and payment details. The form data validated using a client-side programming language(JavaScript). Once payment is completed the customer will receive an order number to keep for future reference. We will not be using a payment gateway. The credit card details will instead be stored in the database.
- Staff members can login using their username and password.
- Staff members can update their own password.
After a user logs in, a session variable stores the user's credentials so they don't need to sign in every time to access all the protected pages. Shopping cart items are saved in a session variable, updates, deletes are made to it, and the session data is saved for the checkout.
- Staff members can add, delete and modify categories.
- Staff members can add, delete and modify items.
- The website functions well in edge and Chrome
- The website validates against W3C HTML 5 validation tool: https://validator.w3.org/
- The website validates against W3C CSS validation tool: https://jigsaw.w3.org/css-validator/
- The website is uploaded to the allocated web server and tested
Documentations for each stage will be attached to document folder.