Online Shopping Webpage Development Using PHP and MySQL - Assignment Example

Report On My Online Shopping Webpage Development Using PHP and MySQL Report On My Online Shopping Webpage Development Using PHP and MySQL Objective The objective of this project is to learn the steps of the development of online shopping websites and then design an online shopping website system that allows users browse the content in the website and purchase them at the comfort of their homes. Requirements Wampserver 2.5 Text editor such as notepad Log book of daily performance of the website development Date Activity Check 17/06/2014 Learn PHP, MySQL and JavaScript basics 18/06/2014 Continue with project development 19/06/2014 Start writing the report 20/06/2014 Start developing php code and the GUI 21/06/2014 Testing the code 22/06/2014 Implementing the system 23/06/2014 Testing the system 24/06/2014 Presenting the project INTRODUCTION Online shopping (E-commerce) is the fastest growing business paradigm in the 21st century. Businesses are embracing websites that provide functionality for doing commercial transactions over the internet. It is true that online shopping is a common place activity. The objective of this report is to come up with an online shopping store that uses php and MySQL to help consumers shop over the internet at the comfort of their homes. They will browse the catalogue and choose the products they want to buy. Then items chosen will then be collected in a shopping cart. There will be a checkout point where the selected items will be presented as an order. At this point, more information from the buyer will be needed to complete the transaction. The customer will fill the billing address, shipping address, and their preferred payment option. Setting up the environment (wamp server) After successfully installing wamp server start it by clicking start programs then wamp server services and click on start all services. Then ensure that the wamp server icon is green. Now open the browser and type http://localhost and hit enter Now code a program to test if the installation was successful by running the code. The project directory should be created in the directory of the installation of the wamp server in my case C:\wamp\www\first_project. In the first project create a test file say hello and name it with the extension .php making sure that you select the all file types in your text editor. Torun the file goes to the browser and type http://localhost/first-project/ ( About Us, 2014).   Project design For this project to be successful, the relational database must be created first. The conceptual design will be divided into two parts i.e. data model and the process model. The data model will deal with the data to be stored in the database. The process model will in turn deal with the processing of the data. The data model is used in designing the relational tables whereas the process model is used in designing the queries that will access and manipulate data on the tables. Data model This is an abstract representation of the data structures contained in the database. The starting point of designing a database is to come up with an Entity-Relation diagram (ERD). The diagrams serve as an outline from which the relational database will be constructed. Relations are designed. The relations include one to one, one to many, and many to many. 1:1 1:1 1:1 0:M 1:1 1:1 0:M 1:1 1:1 1:M 1:1 0:M 0:M 0:M 0:1 1:1 There are three types of relationships one to one, one to many and many to many. If an entity A matches only one record in another entity B and similarly one record in the entity B matches one record in entity B then the relationship is one to one. A one to many relationship arises when all the records in A matches zero or more records in B with every record in B matching only one record in A. Database design In this phase, the database structure is shown. Primary and foreign keys are then shown. The customer details are stored in the following fields Process model In this stage, we model how data processing occurs and show how the data will flow from the tables when the user attempts to obtain information. We need to construct a functional decomposition diagram and data flow diagram. Functional decomposition diagram This diagram is used to break the system into smaller parts that are more manageable. It is a top-down decomposition of the system. Dataflow diagram This diagram will be used to show the data flowing from external sources into the system and the data flowing into the processes within the system. product name, price and quantity product name and price product name review product name, review and manufacturer CUSTOMER BROWSING DARTA FLOW DIAGRAM SHOPPING CART DATA FLOW DIAGRAM User credentials, shopping_cart_Id, date User Id price inventoryId, productName, Price and manufacturer USER AUTHENTICATION DATA FLOW DIAGRAM userId and password userId and password price userId User interface design Just before the actual design of the project is implemented the user interfaces must be designed to help us envision user interaction with the system when the user browses our catalogue, generate a shopping cart and do the online shopping. It will be based on the Functional decomposition diagram. The first user interface to be designed was the registration user interface. This interface is used to collect the users email address, name, and the password the user wants to use. PHP coding To start coding we need to create the MySQL table that will hold all the information about our products. A table called “products” is created, and the product details are inserted into the table using PhpMyAdmin (Stobart and Parsons).   id Product_code Product_name Product_description Product_image price 1 Pd100 T_shirt1 Product_image1 2000 2 Configuration A configuration file was then created to store the various information that was needed for the scripts. MySQL details were entered into the configuration file Product List (Index.php) The index.php file is used to display the products to be sold to the customers. On the right of the page, we put the shopping cart that will be used to track of the items the buyer will buy later (Creating Simple Shopping Cart with PHP, n.d). Because this is dependent on sessions we first activate the php session in the script by putting the following line; session_start() on top of the code.   Listing the products from the table The items in the table will be fetched from the database and displayed in the user interface. HTML form with the adds to cart button will be created to add the items. Each of the items contained forms with product code and the return URL which are sent to the cart_update.php file.  Shopping Cart Box The shopping cart box will display small shopping cart box to keep track of the user items. Its main job will be to look for the $_SESSION [“products”], which keeps all the items in an array. Updating Cart The cart_update.php file adds and deletes products from the shopping cart. When the customer clicks on the adding button, the form sends the hidden values to the cart_update.php by the use of the POST method, that is meant to get the items from the table verifying that the item exists and then the $_SESSION[‘products’) is created or updated. Deleting items in the table works in a similar way. The pagination.php file groups the products into pages according to their similarities. This makes it look cleaner and avoids overcrowding. The right side of the page there will be a shopping cart box where the users can drop the items they wish to buy. Viewing the summary of the items From this point everything is ready and working. Now we create the page where the users can see the items and pay. Payment Adding paypal to the third party shopping cart This project integrates the third party shopping cart to the PayPal payment flow. This is done by passing the details of the selected products to PayPal. This requires additional scripts to be created on the website. The third partyshopping cart is configured to pass individualitems to payapal. The HTML form elements are posted to a new version of paypal’s shopping cart flow. The following codes are involved Set the “cmd” variable to “_cart” and the line is replaced with the line . Another variable, upload is then created and the line is added between the and tags. The item details are then defined with their numbers appended to the right side of the name e.g “tshirt_x” where x is the number of the item. Repeat for alltyhe itrems in the cartb Processing PayPal Payment The payment.php file receives the user’s product data and processes it for payment. Three PayPal methods are executed setExpressCheckout, DoExpressCheckoutand GetExpressCheckoutDetails. At the SetExpressCheckout the buyers send the product to the checkout and the payment.php file obtains the PayPal token with SetExpresscheckout method using the seller’s PayPal API details. When the token is received a session variable is set (itemprice, totalamount, itemName, itemNo, itemQTY) for later use. The customer is then directed to the PayPal order summary page when the payment is done. At the DoExpressCheckoutPayment the customer is redirected backtopayment.php with the payID values. These value is sent back to PayPal upon which pay pal verifies them and then transfers the payment to the seller. At the GetExpressCheckoutDetails the buyer details are saved Login and logout In the admin section login and logout scripts are created. The login script will take input from the user then validate it by comparing it with other entries in the database (Noabeb, 2014). The login script has two fields the username and password. After the user enters their details and the script checks that the fields are not empty it goes on to check whether they march with the details in the user table. Logout The logout script destroys the created sessions. The user registration script adds three forms into the login script. It then matches them to the user table fields and then adds an insert query to add the user as a new member. The website consists of the following webpages, login.php,logout.php, payment.php. When the user inputs the web address of the system in the browser the following screenshot is seen. This page contains the website’s general information. Demo of the testing works with internet explorer and Mozilla firefox. Up Internet explorer view of the homepage Internet explorer view of the search page (users use this page to search for the products) Skill development and measurement This project has helped me understand how interactive websites are built and the technologies involved. Before engaging in this project i only knew how to code static HTML pages. The design also included the data model and the process model that were vital in the understanding of how databases are made with different tables, and how the data in the tables are accessed and manipulated from the tables. It was also important as it included new technologies and ideas such as JavaScript, php and Mysql. I have also learnt how php connects to the database to access the data in the tables and how the data is manipulated to give the users the shopping cart application. RECOMENDATIONS This system has many limitations. These limitations are as follows and can be corrected as follows 1. The system does not support multiple users but in the future we can use the concept of transaction. 2. Credit card validation is not done but in the future third party proprietary can be employed to check for the validation. 3. The administrator will be given more jobs like looking at the user’s profile. 4. Multiple shopping carts can be given in the future CONCLUSION The internet has gained popularity over the years and thus online shopping has been the preferred over the traditional approaches by both the buyers and sellers. This is because it creates more business opportunities for the sellers. To the customers it allows them to shop throughout the day as well as gives them a wider variety to choose from. In this project the users are provided with an online shopping website that can be used to buy items online. To implement this we used php that has numerous advantages such as enhanced performance, scalability and simplicity. JavaScript was also used to provide authentication and other feature. Wamp server 2.5 was used as the webserver because it is free and easy to use. It also had the needed features such as MySQL and made it easier for us to create and manipulate the database. MySQL was used as the back end database in this project because it is an open source software, data access is faster and it is easy to install and simple to learn. Good online shopping websites must have good and user friendly shopping cart application cart logic. This project created a user friendly shopping cart that enabled users to easily add items to the cart as well as delete items they wished to drop. It thus made the users more comfortable. Bibliography About UsTechieRoophttp://techieroop.com/installing-wamp-server-in-windows-7-8/#.RlDOZUCunLI Build a Shopping Cart Admin Tool for Your PHP Online Store2014webreferencehttp://www.webreference.com/programming/php/Shopping_04/index.html Creating Simple Shopping Cart with PHPsanwebe.comhttp://www.sanwebe.com/2013/06/creating-simple-shopping-cart-with-php/comment-page-2 Dynamic Web ApplicationCengage Learning EMEA2008 http://www.visual-paradigm.com/tutorials/data-flow-diagram-dfd.jsphttp://www.visual-paradigm.com/tutorials/data-flow-diagram-dfd.jsp TorleifPHP Tutorial: PayPal Instant Payment Notification (IPN)Software Developmenthttp://www.geekality.net/2011/05/28/php-tutorial-paypal-instant-payment-notification-ipn/ Read More