A WEB BASED ONLINE SHOP MANAGEMENT SYSTEM Abstract: Internet marketing, also referred to as I-marketing, web-marketing, online-marketing, Search Engine Marketing (SEM) or e-Marketing, is the marketing of products or services over the Internet. At present time, Internet marketing plays a big roll in our life. The goal of an e-commerce site is not only to sell goods but also to provide services through online. This project deals with developing an online shopping website for online products sale. It provides the user with a catalog of different products available for purchase in the store. Our system is implemented using a 3-tier approach, a backend database, a middle tier of Apache and php, and a web browser as the front-end client. In order to develop an e-commerce website, a number of technologies must be studied and understood. These include multitiered architecture, server and client side scripting techniques, implementation technologies such as, programming language, relational databases (such as MySQL). Objective of this project is to develop a basic website where we used a database system for storing all information rather than file system. Administrator will be able to create new categories, add products, add user, update order status, enable/disable user from the system and user has the access buy to their different types of products. User can pay the payment by Paypal or “Cash on Delivery�. Website visitor only has the access to visit the website and they can have all the information from the site. ACRONYMS PHP HTML CGI FTP MySQL ASP RDBMS HTTP SSI SSL JSP ISP DNS IP TCP URL PERL ITS HCI E-R SSH XML WSAPI DDL UCD CSS
Hyper Text Processor Hyper Text Markup Language Common Gateway Interfaces File Transfer Protocol Structured Query Language Active Server Page Relational Database Management System Hypertext Transfer Protocol Server Side Includes Secured Socket Layer Java Server Page Internet Service Provider Domain Name Server Internet Protocol Transfer Control Protocol Uniform Resource Locator Practical Extraction and Reporting Language Information Technology Human Computer Interaction Entity-Relationship Secure Shell Extensible Markup Language Web Site Application Programming Interface Data Definition Language User Centered Design Cascading Style Sheet
1.1 Introduction Online system revolutionary changes in our day to day life as well as peoples depend on it because it brings more flexibility in our life. Online shopping is one of them, where one can buy and sell everything from his/her house within a few times. So, no need to go anywhere and one can choose the best product from a reasonable price and easily sell allowance for his product. That’s why, Online shopping day by day more popular in our busy life. We observed and analyzed this present situation and selected a project topic and made it based on Online Shopping Management System. 1.2 Objectives of the Project The Online Shop management system provides product information and selling to Seller, Buyer and Visitor. The goal of this report are given below
To Learn Internet Marketing Plans.
Give a general idea of the proposed web development model.
Propose modifications and addition of certain features of the web site.
Getting idea about web-related research.
Getting Knowledge about E-commerce.
Getting Knowledge about the programming.
Get an overall idea of designing the relevant database.
To Learn about software tools.
Get a broad discussion of the proposed and implemented features of the whole program.
Analyze the security measurement of the web site.
To learn payment security systems.
1.3 Research Methodology There is concerned with the methodological problem of how to integrate qualitative and quantitative insights in developing an agent-based model of the ecommerce case study. 1.3.1
Procedure
In this project Linear Sequential Model or Waterfall model has been used for development. The linear sequential model suggests a systematic, sequential approach to software development that begins at the system level and progresses through analysis, design, coding, testing, and support. The linear sequential model is the oldest and the most widely used paradigm for software engineering. As we had developed this project in a conventional way and all the requirements were taken at a time for analysis, for this reason Waterfall Model was chosen for to use in our project.
1.3.2
Techniques
In the time of e-shopping having an ecommerce website has become a common thing. Most of the E-commerce systems techniques are almost similar. As a result, the similar techniques are used in the context of project development. Extra additional techniques are used by someone to develop the popularity of websites. This main product-selling-system is almost same for all website. For this reason, we have developed our project by using this customized technique. Before using this technique we have studied it very minutely and have completed our project by followings all standard system of online shopping. 1.3.3
Tools
Designs tools are very important to develop any software and without these tools it is not possible to develop any software. These tools are related to each other very closely. We have used these tools PHP, Mysql, JavaScript, CSS, HTML and XHTML to develop our software which is briefly mentioned below:
•
PHP: PHP is a server-side scripting language designed specifically for the Web. Within an HTML page; user can embed PHP code that will be executed each time the page is visited.The user PHP code is interpreted at the web server and generates HTML or other output that the visitor will see. PHP originally stood for Personal Home Page but was changed in line with the GNU recursive naming convention (GNU = Gnu’s Not Unix) and now stands for PHP Hypertext Preprocessor.
•
Mysql: MySQL is a open source Relational Database Management System. MySQL is very fast reliable and Flexible Database Management System. It provides a very high performance and it is multi threaded and multi user Relational Database Management System.
•
Javascript: Javascript is a programming language that is used to make web pages interactive. It runs on user visitor's computer and so does not require constant downloads from the user web site. It is a scripting language.
•
CSS: CSS is an abbreviation for Cascading Style Sheets. Style sheets are a very powerful tool for the Web site developer. They give to user the chance to be completely consistent with the look and feel of user pages, while giving the user much more control over the layout and design than straight HTML ever did.
•
HTML: Hyper Text Mark language” is used to write web pages, combining plain text and special tags that tell a browser how to treat that text. We use HTML to describe how element in a web page should be displayed, how pages should be linked, where to put images, and so on.
1.3.4
Documentation Aids
This document helps in understanding the creation of an interactive web page and the technologies used to implement it. The design of the project which includes Data Model and Process Model illustrates how the database is built with different tables, how the data is
accessed and processed from the tables. The building of the project has given us a precise knowledge about how php is used to develop a website, how it connects to the database to access the data and how the data and web pages are modified.
1.3.5
Project Assumptions and Potential Risks
Assumptions: Te project is a web application. A web application has to be tested and implemented in web server and web browsers intensively. Apart from functional requirements there are non-functional and pseudo requirements have to be met. The User Interface has to be user friendly and attractive enough to fulfill user expectations. Potential risks: This is a group project of two team members. There are some potential risks like software delivery on time, project collaboration project reports write up etc.
1.4 Project Development We have studied the subject matters of the project in respect of developing our selected project. As a result we have drawn the project development flowchart which is shown as below:
Study Existing System
New Idea and Requirement Analysis
Study Software Tools, Language and Database
Database Design
User Interface Design
Programming
Integration
Testing
Testing
Project Submit
Fig 1.1: Project Development Model
1.5 Duration of Work The Constructive Cost Model (COCOMO) is an algorithmic software cost estimation model developed by Barry Boehm. The model uses a basic regression formula, with parameters that are derived from historical project data and current project characteristics. We have used COCOMO model to estimate our project. As two people was in this project, we will express our total estimation in man-hour. Total line of Code: 20 k Total man-hour: 462 hours Total resource: 2 Total Duration: 6 Months (3 hours per-day, 20 days a month)
1.6 Organization of the Book This report is organized in seven chapters which reflect various topics related to the features of used project tools, designing database, implementation and security issues. First chapter introduces the overall work and it states the motivation behind this exertion mentions the objectives of this report and specifies related context and issues. The rest of the report is organized as follows. Chapter 2 describes about Existing System and Requirement Elicitation. In Chapter 3, the proposed system has been covered and deals with database design. The designing phase, E-R model, functions definition have been discussed in this chapter. And the total database that has been used in this project is also being described here. Chapter 4 discussed about the Web Engineering as well as its need and characteristics. We introduce our project Simulation, Implementation, Integration & Maintenance in Chapter 5. The next chapter, Chapter 6, describes about the application design. Finally Chapter 7 concludes the report and outlines the future work. Future work suggests the enhancement of this project in terms of including more features in the actual web site. Existing System and Requirement Elicitation
2.1 Introduction:
Similar works in the past has already been witnessed like the present project on Online shopping system. Its online work has been done in this sector. This chapter deals with the discussion of the existing system structure and requirement analysis.
2.2 Existing System: The system that we made is known as E-commerce shopping cart system. The objects and process of this system are almost same. We have reviewed a lot of such type of systems in our country and got the process and features these systems. Besides, we have also explored the facilities and limitation from this system. The web address, process, features and limitations of some existing system are described in this chapter.
2.3 Some of Existing Online Shop in Our Country • • • • • • •
www.bdbazar.com www.bengalcommerce.com www.sonarmarketplace.com www.upoharbd.com www.bdgift.com www.cellbazaar.com www.clickbd.com
2.4 Existing System Architecture Web address: http://www.bdbazar.com/ Features and Drawbacks: • This system made by OsCommerce framework. • Used XHTML and CSS for styling. • • • • • • • • • • • • • • • • • • • • •
No one can easily find this website. Text too small. This site load slowly. User Interface not so good. Broken links. SEO is not working. Category/Product procedure is not user friendly. Poor customer service options Poor overall web design. Lack of compatibility with more than one browser. Wasting the customer’s time. The buying process is very long. Customers are experiencing difficulties when they want to pay. The user buying confirmation process is standard or deficient. Site’s product searching option is not working properly. So that needed product doesn’t show in search. Some images are not displayed on this website. Doesn’t have any discount feature. Reasonable shipping costs. This site dosen’t have any information page such as “How to order”, so that a new customer can’t understand about the site order procedure. Product delivery system works faster. Javascript errors having.
• • • •
Error messaging is shown good. Used Google Analytics tools. Under estimating security concerns of customers. Open 24 x 7, 365 days of the year.
Web address: www.bengalcommerce.com Features and Drawbacks: • This system made by JSP framework. • Used XHTML and CSS for styling. • • • • • • • • • • • • • • • • • • • • •
Most of the time server down. Site design does not load properly. This site load slowly. User Interface not so good. Bad spelling. Broken links. SEO is not working. Poor customer service options Lack of compatibility with more than one browser. Wasting the customer’s time. The buying process is very long. Customers are experiencing difficulties when they want to pay. The user buying confirmation process is standard or deficient. Site’s product searching option is not working properly. So that needed product doesn’t show in search. Some images are not displayed on this website. This site dosen’t have any information page such as “How to order”, so that a new customer can’t understand about the site order procedure. Category/Product procedure is not user friendly. Error messaging are shown good. Used Google Analytics tools. Under estimating security concerns of customers. Open 24 x 7, 365 days of the year.
Web address: www.sonarmarketplace.com Features and Drawbacks: • This system made by PHP framework. • Used XHTML and CSS for styling. • • • • • • • • • • •
Poor customer service options Site design does not loking good. Lack of compatibility with more than one browser. Wasting the customer’s time. The buying process is very long. Some images are not displayed on this website. Doesn’t have any discount feature. This site doesn’t have any information page such as “How to order”, so that a new customer can’t understand about the site order procedure. Category/Product procedure is not user friendly. Error messaging is shown good. Not used Google Analytics tools.
• •
Under estimating security concerns of customers. Open 24 x 7, 365 days of the year.
Web address:www.upoharbd.com Features and Drawbacks: • This system made by PHP framework. • Used XHTML and CSS for styling. • Used to many Javascript library. • No one can easily find this website. • This site load slowly. • User Interface not so good. • Broken links. • SEO is not working. • Poor customer service options • Lack of compatibility with more than one browser. • The buying process is very long. • Customers are experiencing difficulties when they want to pay. • The user buying confirmation process is standard or deficient. • Some images are not displayed on this website. • Low shipping costs. • Not used Google Analytics tools. • Product delivery system works faster. • Category/Product procedure is not user friendly. • Javascript errors having. • Error messaging are shown good. • Under estimating security concerns of customers. • Open 24 x 7, 365 days of the year. Web address: www.bdgift.com Features and Drawbacks: • This system made by OsCommerce framework. • Used XHTML and CSS for styling. • No one can easily find this website. • Text too small. • This site load slowly. • User Interface not so good. • Broken links. • SEO is not working. • Poor customer service options • Poor overall web design. • User can not see proper bengali fonts. • Lack of compatibility with more than one browser. • Wasting the customer’s time. • The buying process is very long. • Customers are experiencing difficulties when they want to pay. • The user buying confirmation process is standard or deficient. • Site’s product searching option is not working properly. So that needed product doesn’t show in search. • Some images are not displayed on this website. • Doesn’t have any discount feature.
• • • • • • • • •
Low shipping costs. Used Google Analytics tools. This site doesn’t have any information page such as “How to order”, so that a new customer can’t understand about the site order procedure. Product delivery system works faster. Category/Product procedure is not user friendly. Javascript errors having. Error messaging are shown good. Under estimating security concerns of customers. Open 24 x 7, 365 days of the year.
Web address: www.cellbazaar.com Features and Drawbacks: • This system made by ASP.NET framework. • Used XHTML and CSS for styling. • This site load slowly because using Ajax. • User Interface so good. • This site owner Grameenphone Ltd. • SEO is not working. • Not compatibility with Google chorome, Internet Explorer etc. • Wasting the customer’s time. • No buying process in here. • This site just for sharing product information. • Product buying process manually. Buyer provides his cell phone number and address. Customer contact with buyer manually. • Site’s product searching option is not working properly. So that needed product doesn’t show in search. • Some images are not displayed on this website. • Many garbage data in here. • Javascript errors having. • Used Google Analytics tools. • Error messaging are shown good. • Open 24 x 7, 365 days of the year.
2.5 Requirement Analysis Various type of system contains different facilities and limitations. After studying the process, feature and limitation of some online shopping web site. Now that’s why we need some requirements. These are given below: Web design must be fixed in all browsers well. Discount coupon code must be added. Product options like color, size etc must be added. It is very necessary to add user interface. More improvement need in customer service. Site link should be well constructed. Better loading system must be added in site loading issue. Site activity measurement must be need for better service. How to order information page should be add because its help for a new customer. SEO must be added SSL technology must be required for security.
2.6 Conclusion As a matter of fact neither of the above discussed models and approaches have been thoroughly followed to the development work of this related field. In the next chapter, there will be discussion on proposed system which is related to the combination of approaches discussed above. The Proposed System 3.1 Introduction Since the development of the Internet many things that were pretty hard to obtain or to do, like information on a large variety of topics or communication with distant friends have become so simple that anyone can have access to them just by using a computer. Among the many advantages that the Internet gives us, one of the main ones is online shopping, an activity that many have become addicted to. Shopping is a necessity for all of us, some of us really enjoys it, and others try to keep it as simple and short as possible. Well, online shopping is the best solution for both those who consider it a chore that they try to avoid and for those who do it on a daily basis. This chapter deals with the discussion of the proposed system. 3.2 System Overview After the user browse around user will see that the basic flow of our shop is: • A customer visit the site • Customer browse the pages, clicking her way between categories •
View the product details that she found interesting
•
Add products to shopping cart.
•
Need login if customer has to not log in.
•
Checkout ( entering the shipping address, payment info )
•
Thank you page and go to payapal for payment.
The customer does need to register for an account. Customer can not buy without login. 3.3 System Methods We have explored that our system is the best system or updated system. We have followed the below methods: •
We have fully done our system by using php programming language and mysql. But it would be very diffcult for customization if we use other frameworks like Joomla, Magento, Wordpress, Opencart etc.
•
We have used XHTML/CSS for form design.
•
We have used our website font standard size.
•
We have used Jquery javascript library for form validation.
•
Our website compatibility with all browsers like.
•
We have made the User Interface(UI) of the site very simply as it were users can find out very easily.
•
Our site is comparatively fast than any other sites because we didn’t add any extra function more than what is necessary.
•
All of the links in our site is very user friendly.
•
Anyone can easily find our website.
•
Category Sub category Product thus we have created the category and product sections in to our system.
•
We have explored the Search Engine Optimization (SEO) by using the web admin tools; as a result, this site shows in the first page of the google search page.
•
We used google analytic tools.
•
We have added some extra pages in this site for which members can know how to order and so on.
•
Our customer service option too much high.
•
Customer can enjoy the convenience of shopping at any hour and anywhere in the world. Product delivery system is faster then any other site. The orders which are based on cash on delivery will be delivered quickly. And the orders which are based on paypal payment will be activated the delivery process after payment immediately.
•
3.4 Features of the Proposed System On proposed system we relate to the combination of User-Centered Design and with existing approach. And also to overcome the facets of user experience our proposal is on the model of user-experienced honeycomb. It is based on the qualities:
Fig 3.1: User experienced honeycomb
• • • • • •
Useful: One must have the courage and creativity to ask whether the products and systems are useful, and to apply the deep knowledge of craft and medium to define innovative solutions that are more useful. Usable: Ease of use remains vital, and yet the interface-centered methods and perspectives of human-computer interaction do not address all dimensions of web design. In short, usability is necessary but not sufficient. Desirable: The quest for efficiency must be tempered by an appreciation for the power and value of image, identity, brand, and other elements of emotional design. Findable: One must strive to design navigable web sites and locatable objects, so users can find what they need. Credible: The beginning to understand the design elements that influence whether users trust and believe what we tell them. Valuable: The sites must deliver value to our sponsors. For non-profits, the user experience must advance the mission. With for-profits, it must contribute to the bottom line and improve customer satisfaction.
3.5 Usability of the Proposed System The following principle is important for the success of a web site. • Make it unique - One often compare building web sites to building homes, and I look at myself as a custom home builder. • Keep it simple - One firmly believe in keeping a web site simple, both from an aesthetic point of view, and more importantly, from an engineering point of view. Aesthetically, the user to be able to see the message and be able to act on it. No need for flashing text or cheesy animations. For reliability, cost, and search engine issues, one try to keep as much of the site in plain HTML. This makes the site easier to index, quicker to load, and easier to bookmark. • Make it easy to navigate - This is probably the most import item on this list because once users find a site, they need to quickly find the information they're after or they will be returning to the search engine to click on the competitor's site. Many of existing sites use a left hand menu that has become sort of a standard in web site design. This immediately lets the visitor see what the main topics are, and they can easily jump from section to section on any page of the site. They don't have to remember the trail that got them to where they are and they don't have to make return trips to the home page. • Make it easy to bookmark - Once users find what they are looking for, they often want to bookmark it so that they can return to that point later. By avoiding frames and dynamic pages, the site guarantee that when a user bookmarks a page in the site, they will be returned to the exact page that they bookmarked. This is also very important if people want to create links to the user content rather than just the home page. • Make it easy to expand - Publishing on the web is one of the most cost effective ways to get information to the potential and existing users. Because of this one often find that a client will start with a five page site and once they see how well it is working they want to add more to it. The design is used to make it easy to expand the site without having to tear it apart and start over. This is one reason left hand navigation model is favorable.
• •
Code by hand - Coming from a programming background, coding HTML by hand was a natural way to do it. Also being a programmer, one have the discipline to create very efficient coding which makes for more stable pages that download quicker. Make it compatible – One have to really aware of how many web sites are built that aren't compatible. Part of the compatibility issue is also making sure the design is flexible. The designer has to realize that on the web there is no control over how the work will be viewed. Monitor size, choice of browser, choice of default fonts and many other issues all affect how the page will render. A good design must be flexible so that it displays well for a broad range of users. It may not be perfect for everyone, but it should be readable. The examples shown below illustrate how this page looks at the same resolution on a Macintosh running Mozilla (left) and on a PC running Internet Explorer 6(right).
3.6 Proposed System After requirement analysis and constructing design phase the content of the site arranged as: • • • • • •
•
Home Page: This is where the customers will go. They will browse around and view the products and hopefully if they're interested enough they'll put some products in the cart. Category Page: Just to add some navigation so the customer can browse around. Product Page: Display detailed information about a product. Add to Cart Page: All interesting goodies go here. View Cart Page: Customer can view what's in her shopping cart. Probably modifying the product quantity or dump some products (or even abandon the whole cart). Checkout Page: There are three steps to complete the checkout o Fill out the shipping and payment info o Confirm the ordered items, shipping and payment info and enter the payment method. o Save the order information to the database. If the payment method is COD (cash on delivery) go straight to the thank you page. If the customer chooses to pay with paypal submit the payment info to paypal server. Register: In this page the registration form has been given for the user to register and get the extra facilities from the web sites.
3.7 Use Case Diagram and Process
Fig 3.2 : Use Case Diagram (Admin) for shopping site
Fig 3.3 : Use Case Diagram (Register User) for shopping site
Fig 3.4 : Use Case Diagram (Visitor) for shopping site
3.8 Database Management System The Database is implemented in MySQL Database Management System (DBMS). This project is medium software. Most of its interface is done with PHP files. That is why it is logical to implemented the database with MySQL rather than any enterprise DBMS. MySQL is a free software and robust enough to handle the web requests for our project.
3.9 Database Tables and Description According to the Software Specification and Software Analysis phase, the relational database is designed with the following relations Table Name
Description
tbl_category
Storing all product categories
tbl_product
tbl_order
Storing the products When the shopper decided to put an item into the shopping cart we'll add the item here This is where we save all orders
tbl_order_item
The items ordered
tbl_user
Store all shop user account Contain the shop configuration like name, address, phone number, email, etc Storing the currency item
tbl_cart
tbl_shop_config tbl_currency
Table 3.1: Database Table and Description All relations have been normalized and query optimized. All Entity Integrity Constraints and Referential Integrity Constraints are strictly checked. 3.10 Database Relation Schemas tbl_category : This table store the product categories. From the Next topic ER diagram the user can see that our current database design enables a category to have a child category and for the child category to have another child category and so on. But we make a restriction that the category will only two level deep like this "Top Category > Laptop > Asus". The reason is to reduce the number of clicks required by a visitor when browsing a category. Field Name
Data Type
Key
Description
cat_id
int(10)
Primary
Category id
cat_parent_id
int(11)
-
Parent category id
cat_name
varchar(50)
-
Category name
cat_description
varchar(200)
-
Category description
cat_image
varchar(250)
-
Category image
Table 3.2: Table tbl_category tbl_product : In this table we store the product's name, category id, description, featured, price, quantity, image and thumbnail. For now a product can only have one image. It may not be enough if the user want to show a picture of user product from multiple angles so i plan to improve this on future version.
When adding a product image in the admin page we don't need to upload the thumbnail too. The script will generate the thumbnail from the main image. The thumbnail size is defined in library/config.php ( THUMBNAIL_WIDTH ) and currently it is set to 75 pixels. Field Name
Data Type
Key
Description
pd_id
int(10)
Primary
Product id
cat_id
int(10)
-
Category Id
pd_name
varchar(100)
-
Product name
Featured
int(11)
-
Featured Product
pd_description
text
-
Product description
pd_price
decimal(9,2)
-
Product price
pd_qty
smallint(5)
-
Product quantity
pd_image
varchar(200)
-
Product Main image
pd_thumbnail
varchar(200)
-
Product thumbnail image
pd_date
timestamp
-
Date of the Product add
pd_last_update
timestamp
-
Product last update
Table 3.3: Table tbl_product tbl_cart : This table will store all items currently put by the customer. Here we have ct_session_id to save the id of a shopping session. Field Name
Data Type
Key
Description
ct_id
int(10)
Primary
Cart id
pd_id
int(10)
-
Product id
ct_qty
mediumint(8)
-
Number of quantity
ct_user_id
int(10)
-
User id
ct_session_id
char(32)
-
The id of a shopping session
ct_date
timestamp
-
Date of cart
Table 3.4: Table tbl_cart tbl_order : Finally when the customer finally places the order, we add the new order in this table. The shipping and payment information that the customer provided during checkout are alos saved in this table including the shipping cost. Field Name
Data Type
Key
Description
od_id
int(10)
Primary
Order id
od_date
datetime
-
Order date
od_last_update od_status
datetime enum('New', 'Paid',
-
Order Last Update Order status
od_memo
'Shipped', 'Completed', 'Cancelled') varchar(255)
-
Order memo
order_user_id
int(99)
-
Order User id
od_shipping_first_name
varchar(50)
-
First name of Shipping
od_shipping_last_name
varchar(50)
-
Last name of Shipping
od_shipping_address1
varchar(100)
-
Shipping address 1
od_shipping_address2
varchar(100)
-
Shipping address 2
od_shipping_phone
varchar(32)
-
Shipping phone no.
od_shipping_city
varchar(100)
-
Shipping city
od_shipping_state
varchar(32)
-
Shipping state
od_shipping_postal_code
varchar(10)
-
Shipping postal code
od_shipping_cost
decimal(5,2)
-
Shipping cost
od_payment_first_name
varchar(50)
-
First name of Payment
od_payment_last_name
varchar(50)
-
Last name of Payment
od_payment_address1
varchar(100)
-
Payment address 1
od_payment_address2
varchar(100)
-
Payment address 2
od_payment_phone
varchar(32)
-
Payment phone no.
od_payment_city
varchar(100)
-
Payment city
od_payment_state
varchar(32)
-
Payment state
od_payment_postal_code
varchar(10)
-
Payment postal code
Table 3.5: Table tbl_order tbl_order item : All ordered items are put here. We simply copy the items from the cart table when the customer places the order. Field Name
Data Type
Key
Description
od_id
int(10)
Primary
Order id
pd_id
int(10)
Primary
Product id
od_qty
int(10)
-
Number of order quantity
Table 3.6: Table tbl_order_item tbl_user : This table saves the entire user. Currently only admin type user is an admin panel and all can do everything to the shop. I'm planning to add permission level only when a user type admin. So one admin can do everything. Admin can add/update category, add / update product, manage orders, manage users, etc. And also all front-end user can view a product, add to cart, and purchase product etc.
Field Name
Data Type
Key
Description
user_id
int(10)
Primary
User id
user_email
varchar(255)
-
User email
user_name
varchar(20)
-
User name
user_first_name
varchar(255)
-
User first name
user_last_name
varchar(255)
-
User last name
user_password
varchar(32)
-
User password
user_regdate
timestamp
-
User register date
user_last_login
timestamp
-
User last login date & time
Table 3.7: Table tbl_user tbl_shop_config : This table stores the shop information. For now it only have the shop name, address, phone number, contact email, shipping cost, the currency used in the shop and a flag whether we want to receive an email whenever a customer place an order. Field Name
Data Type
Key
Description
sc_name
varchar(50)
-
Shop name
sc_address
varchar(100)
-
Shop address
sc_phone
varchar(30)
-
Shop phone number
sc_email
varchar(30)
-
Shop email address
sc_shipping_cost
decimal(5,2)
-
Shipping cost
sc_currency
int(10)
-
Shop currency
sc_order_email
enum('y','n')
-
Send order email
Table 3.8: Table tbl_shop_config tbl_currency : This table stores the currency information. For now it has the currency code and currency symbol. Field Name
Data Type
Key
Description
cy_id
int(10)
Primary
Currency id
cy_code
char(3)
-
Currency code
cy_symbol
varchar(8)
-
Currency symbol
Table 3.9: Table tbl_currency 3.11 Entity Relationship Diagram
Fig 3.5 : ER Diagram for Shopping site Form Design 4.1 Introduction Form design is very important for this project. After completing database design we have planned for form design. Firstly for this design we have been used photoshop. Here we have been used layer, color and decide how will be our page looks like. The first page or Home Page of any website is the gateway page from where internet users take decision to go further for visit site or not. Home Page is considered as most important and essential page in website. Web designers / graphic designers spend lots of time in preparing home page. Many web design companies spend lots of money for giving exclusive look to their home page in compare to their competitor’s website. Even small companies have also started to pay more attention in design of their home page. Attractive and informative home page will build any
company’s strong impression. So we have been taken a decision and design our pages. Here we will now describe how many pages we designed; we will show how they are looks like and which page containing what information. 4.2 Detailed Front-end Logical Design of the Proposed System 4.2.1 Shop: The Main Page Following picture is the home page (front page). There are five main parts here. Those parts are: header part, Navigation part, Banner part, Container part and Footer part. At the very top and bottom have the common header and footer. Header part contains logo. Search option for searching any products. Shopping cart portion show how many products we add to my cart. Navigation part contains some menu link for going those pages and the banner part contains some product galleries image.
Fig 4.1: Home page layout Container part contains three columns. Left column has the category browser module. The shopper can click here way through categories to find the product. And also have a login form. User can login their account by putting username and password. The right side is where we put the mini shopping cart module. If the visitor adds a product, this mini cart will show the item. And also have a featured product module. User can see the featured product item in here. Middle part is the main body for this project. For all action middle part will be changed according to its action. Here we show the product categories and products. The visitor will (hopefully) find her way through the shop, find the item she want, put it into the shopping cart and then buy. What we show in the main area depends on the visitor action. When user first time arrives to main page user get the category list. If the user clicks on one of the category then we show the product list for that category. And if the user clicks on a product from the list we show the product detail. The bottom area is used for displaying the store information (copyright, address, email, phone number). 4.2.2 Shop: Browse Category On the left side of the shop pages we show the category list. When the customer clicks on a category on the left side customer can see all products in that category. The shop main page include this navigation from include/leftNav.php and as mentioned before, the one responsible to get the list of categories for this navigation is the formatCategories() function in library/category-functions.php In summary here is what formatCategories() do : 1. Get all the children categories 2. Get the parent category and other categories on the same level as the parent 3. Keep looping to get the parent's parent until we reach the top level category
Fig 4.2 : Categories List 4.2.3 Shop: View Product List
When the user click one of the categories from the left navigation the main content area will show all product contained in that category. For example if the user click on Laptop then all products in this category will be shown. Actually "Laptop" doesn't have any product. Those products are belonging to its children categories (Asus and Dell).
Fig 4.3: Product List 4.2.4 Shop: View Product Details When the user clicks on any one of the product from the product list, the product detail page will show up and for each product the software will display the full-sized image, name, details, price and 'Add to cart' button. Here is the snapshot of the product detail page. We have full size image on top left corner, the description at the bottom, then the product name, price and an 'Add To Cart' button on the right. There's one more important thing about the 'Add To Cart' button. We only show this if we still have this product in stock. After we run out of this product we just display 'Out Of Stock'.
Fig 4.4: Product Details Page 4.2.5 Shop: Cart Page If a registered user click on the 'Add To Cart' button on the product detail page or latest product module or featured product module one will be redirected to the shopping cart page ( cart.php ). For example if any one want to buy “Dell Inspiron 11z” then he or she will need to go: cart.php?action=add&p=19. Here is the list of product which is carted. Now if there are already items in the cart we have presented it to the customer like shown below. Each row shows the product thumbnail name, unit price, quantity and sub total. On each row we have a delete button so the customer can easily remove the item from cart. Since we have “action=add” in the query string the addToCart() function will be called. In short the function will do these: 1. Check if the product exist in database 2. Check if we still have this product in stock ( quantity > 0 ) 3. If the product is already in cart increase the quantity 4. If not add the product to cart If the user comes to this page and the shopping cart is still empty there is a chance that user goes there by accident or feeling confused. So now we present her with simple instruction on how to buy stuff in our shop. "Your shopping cart is empty" Continue shopping link goes to home page. And proceed to checkout link goes to checkout page.
Fig 4.5: Cart Page – view option When a user updates the quantity then cart table will update in database. And also update every price portion in the cart view.
Fig 4.5: Cart Page – update quantity option When a user delete the cart item then it delete from database.
Fig 4.6: Cart Page – delete option After adding the product and removing all abandoned carts we don't send the customer to the shopping cart page. Customer will stay on the product detail page. But this time the mini cart on the right side will show the product in his/her shopping cart. It also shows the total amount after the shipping cost. If the shopping cart is still empty there so now we present "Your shopping cart is empty"
Fig 4.7: Mini Cart Page This behavior (sending the customer to product page after adding a product) is actually depends on what kind of shop we're running. If it is a shop where people usually buy more than one kind of product then its better then we should skip showing the shopping cart page and display the product page. But if people on this kind of shop usually only buy one product in a shopping session then it's best if we display the shopping cart page.
4.2.6 Shop: Checkout Page There are three steps to complete the checkout
1. Fill out the shipping and payment info and select the payment method. 2. Confirm the ordered items, shipping and payment info and the payment method. 3. Save the order information to the database. If the payment method is COD (cash on delivery ) go straight to the thank you page. If the customer chooses to pay with paypal submit the payment info to paypal server. Step : 1 Here the customer fills out his shipping address. It is required on every input field except Address2 field.
Fig 4.8: Checkout Page Step 1 – Shipping Information Also here is the customer fill out his payment address. It is required on every input except Address2. If the user shipping info and payment info are same then check the Same as shipping information checkbox. Otherwise customer manually put the payment information.
Fig 4.9: Checkout Page Step 1 – Payment Information
PayPal : www.paypal.com This payment method allows automatic Order Status Updates. There's a file which is called notify.php. The user will need to enter the appropriate URL (web address) for the script file in PayPal’s control panel. When a customer finishes the Payment, the PayPal server connects to this script on the user server. When the transaction AND the payment have been successful, the order status is automatically updated to the status of user have set in the PayPal configuration form. Cash on delivery No business logic needed for this kind of payment. Cash on delivery, also known as COD, is a method of payment for goods received, which will be delivered. Payment is given at the time delivery is accomplished. Cash on delivery doesn’t always mean “cash” as a payment, but certainly can also mean cashier’s check, credit card or personal check. It really depends upon the establishment from which user purchasing something, as to what forms of payment are acceptable.
Fig 4.10: Checkout Page Step 1 – Payment Methods
Step : 2 Fig 4.11: Checkout Page Step 2 – Confirm Order View From Confirm Order view the customer will see, his previous submitted order items, shipping and payment information. If everything ok then he goes to confirm order. Step : 3 When the customer click the confirm order button then goes to step 3. The order information store to database and see a message “Processing Transaction”. After that its redirect to paypal site.
Fig 4.12: Checkout Page Step 3 4.2.7 Shop: Login This is a login form in left sidebar. User can login their account by putting username and password.
Fig 4.13: Login View If username and password does not match when submit the form the we will see a message like below
If anyone does not fill up the use name field and try to login then he/she will get an error message like below
If anyone does not fill up the password field and try to login then he/she will get an error message like below
4.2.8 Shop: Registration page Below figure is registration page and here if any one wants to be a user for this system then he/she can fill up this form and submit.
Fig 4.14: Registration Form Like submit the form like below figure.
Fig 4.15: Submitted Registration Form If user is already exists in this system then we will see a message like below
If anyone does not fill up the form and try to register then he/she will get an error message like below
If there is no user already exists with the same name which is trying to registration and all box are fill up successfully then user will see a message and registration will be successful and page redirects to home page.
4.3 Detailed Backend logical designed of the proposed system Our Online Shop Backend admin page consist the following: 4.3.1
Admin Login
Fig 4.16: Admin Login 4.3.2
Category o
Add Category Add a new category.
o
View Category List all the category we have. We can also see all the child categories and show many products in each category
o
Modify Category Update a category information, the name, description and image
o
Delete Category Remove a category. All products in it will be set to have cat_id = 0.
Fig 4.17: Admin Category View 4.3.3
Product o
Add Product: Insert an item into our store. We also need to supply the product image and we'll create a thumbnail automatically from this image
o
View Product: View all the products we have. Since our online shop can have many products we can view the products grouped by category.
o
Modify Product: Modify product information. We can also remove the product image from this page
o
Delete Product: Remove a product from the shop
Fig 4.18: Admin Product View 4.3.4
Order o
View Orders: Here we can see all the orders we have and their status. When the user click the "Order" link on the left navigation user will go straight to the "Paid" orders. The reason is so the user can respond immediately upon of customers that already paid for their purchase.
o
Modify Orders: Sometimes a customer might contact us saying that she made the wrong order like specifying the wrong product quantity or simply want her order cancelled so she can repeat the buying process again. This page enables the admin to do such a thing.
Fig 4.19: Admin Order View 4.3.5
Users o
Add User: Insert a new user in this these view.
o
View User: View all the users we have.
o
Modify User: Modify User information. We can also change the password from this page
o
Delete User: Remove a User from the shop.
Fig 4.20: Admin Users View 4.3.6
Shop Configuration
This is where we can set and change our online shop appearance, behavior and information (like the shop name, main url, etc).
Fig 4.21: Shop Configuration 4.4 Conclusion
In this chapter we have given a detailed overview of the individual format of different pages and also the different forms for different purpose .We have given the authentication and integrity message of designing the application. Implementation, Integration & Maintenance 5.1 Overview Incremental approach has been taken for integration of this project. PHP pages have been created incrementally and integrated accordingly. Database functions are created and embedded in PHP files for database connectivity. All necessary integration testing has been conducted to fulfils its functional, non-functional and pseudo-requirements. 5.2 Paypal Integration •
Pay pal is a payment procedure where one can securely store all payment options.
•
PayPal is a safer, faster, more secure way to pay online.
•
In our project, we implemented the paypal on checkout process for perfection.
•
Any register customer uses their paypal card and easily buys their product.
•
For the benefit of consumer, within a minute they can check their pament details on paypal site.
5.2.1 Handling Paypal Instant Payment Notification (IPN) When a customer reach the payment detail page on paypal site and click the "Pay" button paypal will send a POST message to our server. Our script then send a confirmation back to paypal to verify this POST. Here is that flow diagram again.
Fig 5.1: IPN Process 5.2.2 Paypal Configuration File
The script that processes the notification is located in include/paypal/ipn.php. But before talking about that file let's see the paypal configuration first. Source code: paypal.inc.php <?php $paypal = array(); $paypal['business'] $paypal['site_url'] $paypal['image_url'] $paypal['success_url'] $paypal['cancel_url'] $paypal['notify_url'] $paypal['return_method'] $paypal['currency_code'] $paypal['lc'] = "US";
= =
=
"admin@rokonboss.com"; "http://www.rokonboss.com/shop/"; = ""; = "success.php"; = "error.php"; = "include/paypal/ipn.php"; "2"; //1=GET 2=POST = "USD";
//$paypal['url'] = "https://www.paypal.com/cgi-bin/webscr"; $paypal['url'] = "https://www.sandbox.paypal.com/cgi-bin/webscr"; $paypal['post_method'] = "fso"; //fso=fsockopen(); $paypal['curl_location'] = "/usr/local/bin/curl"; // ... other "not so important" settings down here ?> Here is the description for each configuration: $paypal['business']: The email add that shown as the recipient when the user pay $paypal['site_url']: The store's main url. It is NOT ALWAYS the same as the site's homepage url $paypal['image_url'] : I'm not using any images to display on paypal site during the checkout process so i just left this blank $paypal['success_url']: When paypal can verify the customer's credit card and everything gone smoothly the customer will be sent back to this url $paypal['cancel_url']: And if something went wrong the customer are taken to this one $paypal['notify_url']: This is the main script that check the verification message sent by paypal. It also update the database if the payment is successful $paypal['return_method']: It sets the http method used by paypal to send the verification message
$paypal['currency_code']: What currency will the customer be paying. Other currencies supported are GBP,JPY,CAD, and EUR $paypal['lc']: The language ( locale ) $paypal['url']: We send all payment information to this url. For testing we use the
sandbox url : https://www.sandbox.paypal.com/cgi-bin/webscr But when the store goes live https://www.paypal.com/cgi-bin/webscr
we'll
use
the
real
paypal
url
:
$paypal['post_method']: The function fsockPost($url,$data) can use several method to send transaction data. They are fso ( fsockopen() ), curl ( curl command line), and libCurl ( php compiled with libCurl support ). We're using fso because a hosting company may not provide PHP with curl support $paypal['curl_location']: If the user using curl as the post method user must supply the path to the curl command on user server 5.2.3 Submitting the Payment Information From the second step on the flowchart above we post some form values to paypal server so they can process the payment. Below the user can see the variables sent from payment.php and their description Business: The merchant's email address. The payment will be sent to the paypal account identified by this email address. The value for this variable is taken from the configuration file ( $paypal['business'] ) Amount: The amount of payment that the customer must pay. Invoice: The order id. We need this so we can know which order is being paid item_name: Since the customer can buy multiple items i just hard code this one to "Plaincart purchase". Return: The url where the user want to send the customer to after the payment is complete ( $paypal['success_url'] ) cancel_return: When the payment fails the customer is redirected here ( $paypal['cancel_url'] ) notify_url: The url of the script that checks the IPN notification from paypal and send back a confirmation to paypal ( $paypal['notify_url'] ) rm: The return method. The available values are 1 ( GET ) and 2 ( POST ). Since we use POST in this example the value of rm is 2. currency_code: In what currency user want to be paid in ( $paypal['currency_code'] ) . lc: The language ( $paypal['lc'] )
ď&#x192;&#x2DC; cmd: The value is _xclick which is hardcode. Paypal provides several kinds of payment processing services so we need to tell them what kind of service we're using. ď&#x192;&#x2DC; no_shipping: Since we already ask the shipping address during checkout. We don't need to ask it again on the paypal site. So we set this value to 1. Use 0 ( zero ) if the user want paypal to ask the shipping address instead. 5.2.4 Processing the Payment Here is the code for the IPN script: Source code: include/paypal/ipn.php <?php if
(strpos($_SERVER['REMOTE_ADDR'],
'66.135.197.')
===
false)
{ exit;
} require_once './paypal.inc.php'; // repost the variables we get // for validation $result = fsockPost($paypal['url'], $_POST); //check if
the ipn result (eregi("VERIFIED",
to
received back $result))
require_once //
check
that $sql
the
paypal
invoice =
site purpose
from {
paypal
'../../library/config.php'; has
not
been previously "SELECT FROM
processed od_status tbl_order
WHERE od_id = {$_POST['invoice']}"; $result = dbQuery($sql); //
if if
no
invoice with such (dbNumRows($result)
number ==
}
process
this if
found, 0)
else $row
//
is
=
order only if the ($row['od_status']
exit { exit; {
dbFetchAssoc($result); status !==
is
still 'New')
'New' { exit;
} else { //
check
that
the
buyer
sent
the
right
amount
of
money
$sql
=
"SELECT SUM(pd_price * od_qty) AS subtotal FROM tbl_order_item oi, tbl_product p WHERE oi.od_id = {$_POST['invoice']} AND oi.pd_id = p.pd_id GROUP by oi.od_id"; $result = dbQuery($sql); $row = dbFetchAssoc($result); $total
=
if
$subTotal $subTotal +
= $row['subtotal']; $shopConfig['shippingCost'];
($_POST['payment_gross'] }
!=
$total) else
{ exit; {
$invoice = $_POST['invoice']; $memo = $_POST['memo']; if (!get_magic_quotes_gpc()) { $memo = addslashes($memo); } $sql = "UPDATE tbl_order SET od_status = 'Paid', od_memo = '$memo', od_last_update = NOW() WHERE od_id = $invoice"; $result = dbQuery($sql); } } } }
else
{ exit;
} ?> Right at the top of the script we check if the ip address of the page requester. Since this page is meant only to be accessed by paypal server we disallow any connection that didn't come from paypal. Paypal server's IP address begin with 66.135.197 so if we don't see that in the remote address we just assume someone trying to mess with our script and exit immediately. If the request does come from paypal we send a reply POST to let Paypal know that we have received their message. Upon receiving our reply Paypal send another reply notifying the payment status whether it's verified or not. If we found the word VERIFIED in the reply that means payment has been made and we move on updating the status for the order Here is the series of checking that the script performs:
1. Check the database to see if the invoice id really exist 2. If it does exist check the order status is still 'New' to prevent double action 3. If it's a new order check the amount of money sent and make sure the currency is correct. 4. When everything is okay we can update the order status to "Paid", add the buyer's memo and modify the update time. That's it. Once the customer made her payment the user can check the order on the admin page. When the user click on the "Order" menu on the admin page user can see all paid orders. From there it's up to user as the store owner to decide what to do with those orders. 5.3 Creating the Paypal Account If the user wants to test the shopping cart script on user own server the user should create own developer account. Here are the steps to setup a developer account with paypal: 1. Go to https://developer.paypal.com ,click on on "Sign Up Now" and complete the registration 2. Paypal will send to the user a verification email. Click the link in the email to verify the user email address 3. Login to PayPal Developer Central 4. Create a sandbox account by clicking on the "Sandbox" tab 5. Click on "Create Account". A new window wills popup. On the popup screen choose "Personal Account", select a country from the list then hit "Continue". This is just for testing so user can enter false email and use false data to fill in the form. Don't forget to enter the characters in the security image (it's case insensitive) 6. On the next screen just hit the 7. Complete the 'extra ...' stuff 8. Check your paypal inbox 9. Open the welcome email and click the verification link 10. Open the 'extra ...' email and click on the link then enter the number The user will still need to create a "normal" Paypal account not only the developer account before testing. If not all payment status will be "Pending" instead of "Completed". If user don't already have it yet here are the steps to create and configure user paypal account: 1. Create a business account with paypal (the personal account is not enough ) and add a credit card so user account is verified. If the user don't add a credit card then IPN will always say that the payment status is "Pending" 2. Login 3. Go to My Account > Profile > Instant Payment Notification Preferences
4. Click on the "Edit" button 5. Check the checkbox and enter the url where we want to receive the IPN notifications ( in our case it's http://www.shop4you.com/shop/include/paypal/ipn.php) then hit "Save" Since our script already pass the hidden input called notify_url, which is the url of the script that process IPN notifications, this step is actually not required anymore. I just put this for the sake of completeness.
5.4 Testing and Correcting Errors before Actual Usages Testing is an important part of any software development program. The following testing procedures are involved in our project. These are given bellow: •
When we developed a part, then we tested it many times because we want a errorless software.
•
System is checked by several input data and observed the output results.
•
After integrate the payment method, we observed its result.
•
When all tests are done properly, then it placed in a online server and again monitored it and finally checked it results.
5.5 Implementation and Maintenance When passing all the testing with actual information and final checking, then it is a time to develop it into actual application. If there is mistake then try to edit and develop the information to be effective at all. For an example, is the system has been used in a very long time then the information and data stored in the system will be overloaded. The advice is to maintain the system by make a back-up data in case of emergency so if the mistake does happen then there will be a way to solve the problem. This way also because the least effect to the operation so the maintenance is needed at all time. 5.6 Challenges of our online shop for Bangladesh 1. Network Infrastructure •
Intra-bank and Inter-bank Connectivity
2. Local and Global •
Bank-Client Connectivity
•
Security of transaction
3. Banking mechanism •
Automation
•
Convertibility of the Bangladesh currency
•
Retention quota
•
International credit cards
4. Capacity Building: Human, Technical and Regulatory •
Quick Settlement, Online credit Information, Skilled e-Manpower, Regulatory Framework
5. Investment 6. Legal Infrastructure 7. Currency Convertibility: Access to Global Finance 8. E- Culture 5.7 Our Online Shop Benefits Our online shop website can provide many benefits, among them: • •
Increased sales Increased profits
•
Expanded markets – with a website the user have global access
•
Niche marketing – search engines and directories enable the user to access niche markets
•
Decreased sales costs – less marketing and promotional material necessary, lower cost of processing orders, less time handling customer queries (if the information is clearly provided online), better inventory management
•
Improved customer service levels
•
Immediate response to changing markets
•
Up to date sales collateral – web site prices can be updated as necessary unlike printed collateral
Design Tools Designs tools are very important to develop any software and without these tools it is not possible to develop any software. These tools are related to each other very closely. We have used these tools PHP, Mysql, JavaScript, CSS, HTML and XHTML to develop our software which are brifly mentioned below: 6.1 System Configurations 6.1.1 Hardware and Memory Considerations For better development environment I used these types of hardware system:
• • • •
Intel Pentium iv 2.00GHz processor with 1GB RAM 3DVGA support with 16MB VRAM Enough free disk space. Standard computer peripherals.
6.1.2 Software Requirements The program was compiled under Windows XP professional using Web language PHP, MYSQL for database and notepad++ or Zend 7.0. The users would most probably prefer to keep Windows 95 or Windows 98 or Windows XP as there operating system and also need any browser like any version of firefox, Internet Explorer. Web browser (firefox) Web Server:
Apache 2.2.11
Database Support: MySQL 5.0.51 and PHPMyAdmin 2.2.3 6.2 Language Consideration We have used PHP, Mysql, JavaScript, CSS, HTML and XHTML for the following reasons:
Easy to write code in PHP Familiarity with the language PHP, HTML, XHTML, CSS. Ease of implementing graphics by the PHP or HTML coding. Flexibility provided by the notepad++ interface. Ease of implementing link by the notepad++ interface.
6.3 Development Tools • PHP : PHP is a server-side scripting language designed specifically for the Web. Within an HTML page; The user can embed PHP code that will be executed each time the page is visited. The user PHP code is interpreted at the web server and generates HTML or other output that the visitor will see. PHP was conceived in 1994 and was originally the work of one man, Rasmus Lerdorf. It was adopted by other talented people and has gone through four major rewrites to bring us the broad, mature product we see today. As of November 2007, it was installed on more than 21 million domains worldwide, and this number is growing rapidly PHP is an Open Source project, which means the user have access to the source code and can use, alter, and redistribute it all without charge. PHP originally stood for Personal Home Page but was changed in line with the GNU recursive naming convention (GNU = Gnu’s Not Unix) and now stands for PHP Hypertext Preprocessor. PHP is used because:
Reduce the time to create large web sites. Create a customized user experience for visitors based on information that one have gathered from them. Allow creation of shopping carts for e-commerce Web sites. Can be host in a non windows platform (UNIX, Linux), which is less costly. Client required very low systems configuration.
•
•
• •
Broad functionality for databases, strings, network connectivity, file system support, Java, COM, XML, CPRBA WDDX and Macromedia Flash. Server compatibility for Apache module UNIX, Win32, CGI/FastCHT, thttpd, Fhttpd, phttpd, ISAPI, Java servlet engine, AOLServe, and Roxen/Caudium module. A rapid development cycle, now versions with bug fixes, additional functionality, and other improvements are released every few month. A vibrant and supportive community, code examples and free code abound, the PHP group has done an excellent job of providing new users with resources and support. HTML : “Hyper Text Mark language” is used to write web pages, combining plain text and special tags that tell a browser how to treat that text. We use HTML to describe how element in a web page should be displayed, how pages should be linked, where to put images, and so on. Unlike an ordinary HTML page, a PHP script is not sent directly to a client by the server, it is parsed by the PHP binary or module. HTML elements in the script are alone, but PHP code is interpreted and executed. CSS: The unified panel provides a powerful and easy way to understand the cascade of styles applied to content as well as quick access to making changes without having to navigate a lot of code through trial and error. Easily work with CSS-based positioning in design view using limitations created by table and font tag designs and explore the ease of CSS. We can write css code in html file inside head tag. Otherwise we can create a separate css file and include that css file inside head tag. JavaScript: JavaScript is a scripting language was designed to add interactivity to HTML pages. JavaScript is usually embedded directly into HTML pages. JQuery: JQuery is a lightweight cross-browser JavaScript library that emphasizes interaction between JavaScript and HTML. JQuery is a fast and concise JavaScript library which simplifies the creation of animations, communications to server requests, document transversing and event handling. JQuery is a library that makes it quicker and easier to build JavaScript webpages and web apps. Often with JQuery the user can write a single line of code to achieve what would have taken 10-20 lines of regular JavaScript code. JQuery is itself written in JavaScript, and comes in the form of a single .js file that the user link to from user webpage. The user JavaScript code then accesses the library by calling various JQuery functions. jQuery makes it easy to write powerful JavaScript apps and create eye-catching animated effects rivalling those of Flash movies. Amongst other things, jQuery is great for: • • •
Adding animated effects to elements. jQuery lets the user easily add effects such as fading in/out, sliding in/out, and expanding/contracting. Making XML (Ajax) requests. These use JavaScript to request additional data from the Web server without having to reload the page. Manipulating the DOM. The user can easily add, remove, and reorder content in the Web page using just a couple of lines of code.
•
•
Creating image slideshows. The user can use jQuery effects to build nice animated slideshows and lightboxes.
•
Making drop-down menus. jQuery makes it easy to create multi-level dropdowns with animations.
•
Creating drag-and-drop interfaces. Use jQuery to build a page with elements that can be repositioned or reordered simply by dragging and dropping.
•
Adding power to forms. With jQuery user can easily add complex client-side form validation, create auto-complete Ajax text fields that pull data from a server-side database, and so on.
MySQL: MySQL is a freely available RDBMS, which full joined the open source community only recently, when it was released under the GNU public license. In addition only recently, MySQL provides a whole lot of other features: o Open source Software: The MySQL package complete with the complete source code. This means that we may study the source code and modify it to suit our particular needs. o SQL Support: As the “SQL” in MySQL suggests, MySQL supports SQL (Structured Query language) , a standard high-level language used to make queries for data required from a database. o Superb Performance and Reliability: MySQL is remarkably fast and reliable even in a most demanding environment. o Ease of Use: MySQL is simple database management system is spite of its powerful features. It is also easy to step and manage. o Free Support: The user can get a certain degree of professional support from other users who use MySQL by variable means MySQL newspapers, mailing list, independent web sites that freely share their knowledge, among other. If the user need a higher level of technical support, we cal always ask for it from the developers at minimal cost. o Cross Platform: MySQL can run on either the UNIX or Windows platforms. o Scalability and Flexibility: The MySQL database server provides the ultimate in scalability, sporting the capacity to handle deeply embedded application with a footprint of only 1MB to running massive data warehouses holding terabytes of information. Platform flexibility is a stalwart feature of MySQL with all flavors of Linux, UNIX and windows being supported and of course the open source nature of MySQL allows complete customization for those wanting to add unique requirements to the database server. o High Performance: A unique storage-engine architecture allows database professional to configure the MySQL database server specifically for particular applications, with the end result being amazing performance results. Whether the intended application is a high-speed transactional processing system or a high-volume web site that services a billion queries a day, MySQL
can meet the most demanding performance expectations of any system. With high-speed load utilities, distinctive memory caches, full text indexes, and other performance-enhancing mechanisms, MySQL offers all the right ammunition for today’s critical business system. o High Availability: Rock-solid reliability and constant availability are hallmarks of MySQL, with customers relying on MySQL to guarantee aroundthe-clock uptime. MySQL offers a variety of high-availability options from high-speed master/slave replication configurations, to specialized cluster servers offering instant failover, to third party vendors offering unique highavailability solutions for the MySQL database server. o Lowest Total cost of Ownership: By migrating current database-driver application to MySQL, or using MySQL for new development project, corporations are realizing cost savings that many times stretch into seven figures. Accomplished through the use of the MySQL database server and scale-out architectures that utilize low-cost commodity hardware, corporations are finding that they can achieve amazing levels of scalability and performance, all at a cost that is far less than those offered by proprietary and scale-up software vendors. In addition, the reliability and easy maintainability of MySQL means that database administrators don’t waste time troubleshooting performance or downtime issues, but instead can concentrate on making a positive impact on higher level tasks that involve the business side of data. •
XAMPP: XAMPP is a free and open source cross-platform web server package, consisting mainly of the Apache HTTP Server, MySQL database, and interpreters for scripts written in the PHP and Perl programming languages. XAMPP's name is an acronym for X (meaning cross-platform), Apache HTTP Server, MySQL, PHP, Perl XAMPP requires only one zip, tar or exe file to be downloaded and run, and little or no configuration of the various components that make up the web server is required. XAMPP is regularly updated to incorporate the latest releases of Apache/MySQL/PHP and Perl. It also comes with a number of other modules including OpenSSL and phpMyAdmin. Installing XAMPP takes less time than installing each of its components separately. Self-contained, multiple instances of XAMPP can exist on a single computer, and any given instance can be copied from one computer to another. It is offered in both a full, standard version and a smaller version (known as XAMPP Lite). Add-on extension modules also are available for free. Officially, XAMPP's designers intended it for use only as a development tool, to allow website designers and programmers to test their work on their own computers without any access to the Internet. To make this as easy as possible, many important security features are disabled by default. In practice, however, XAMPP is sometimes used to actually serve web pages on the World Wide Web. A special tool is provided to password-protect the most important parts of the package.
XAMPP also provides support for creating and manipulating databases in MySQL and SQLite among others. •
Notepad: Notepad is a basic Windows utility. It’s used for creating and/or editing unformatted text (.TXT) files. It has limitations, but it’s surprisingly useful - so much so that I always put a shortcut to it on my desktop. Notepad strips all formatting from text that is pasted into it. Boldface, italics, hyperlinks...all of it disappears, and the user get the plain text instead. When user copying and pasting in some applications (particularly Microsoft Office), there’s a "Paste Special - Unformatted" option. Unfortunately this often fails to remove formatting, and the result can screw up to user documents. By pasting the text into Notepad first, and then copying and pasting that Notepad text into the user new document, the user absolutely remove any and all text formatting - guaranteed clean text. Notepad is also useful for replacing characters which are wildcards to most Windows applications. For example, the asterisk is used as a general wildcard in most Windows applications (again, Office springs to mind). If the user have a file which contains asterisks and user want to delete or replace them with a "Replace All", the user pretty much out of luck in Excel and Word. Searching and replacing * with nothing will delete all of the user text. The same thing happens with the question mark, which is a wildcard that represents a single character (as opposed to the *, which can represent any number of characters). But Notepad doesn’t use wildcards. So if the user take his text and paste it into Notepad, the user can search and replace all the *s or ?s, and then paste the text back into the user original file. Of course, all other text formatting will have been removed too! But if the user work with large Excel files (as I do) and sometimes get data with asterisks sprinkled throughout, Notepad is a godsend. Notepad is also handy to store a quick copy of any text. For example, say that I’m writing a comment on a site that isn’t always reliable. Or say that I’m concerned that my connection to the net might crash. It’s easy to pop open Notepad and throw a copy of my comment into it before hitting the "Submit" button. That way if something goes wrong, I have a copy saved. And Notepad starts up more quickly and uses far fewer system resources than Word. Because Notepad makes no changes to files that it opens (unless the user make changes, of course), it’s useful for examining and editing files which could be screwed up by more advanced programs. It can be used on HTML code quite nicely, for example. Likewise, if the user have a file of unknown type because the extension has been deleted, opening it in Notepad is a good way to make sure that the user don’t screw it up merely by opening it. That way, the user can example the contents of the file and possibly figure out what type of file it actually is. The file type name can often be found amongst the code at the beginning or end of the file.
Overall Discussion 7.1 Conclusion
This project deal with a full functional web application called “A Web Based Online Shop management System”. The Internet has become a major resource in modern business, thus electronic shopping has gained significance not only from the entrepreneur’s but also from the Customer’s point of view. For the entrepreneur, electronic shopping generates new Business opportunities and for the customer, it makes comparative shopping possible. As per a survey, most consumers of online stores are impulsive and usually make a decision to stay on a site within the first few seconds. “Website design is like a shop interior. If the Shop looks poor or like hundreds of other shops the customer is most likely to skip to the other site. Hence we have designed the project to provide the user with easy Navigation, retrieval of data and necessary feedback as much as possible. In this project, the user is provided with an e-commerce web site that can be used to view products online and buy them to online payment method. To implement this as a web application we used PHP/Mysql as the Technology. PHP has several advantages such as enhanced performance, scalability, built- in security and simplicity. This project helps in understanding the creation of an interactive web page and the technologies used to implement it. The design of the project which includes Data Model and Process Model illustrates how the database is built with different tables, how the data is accessed and processed from the tables. The building of the project has given us a precise knowledge about how PHP is used to develop a website, how it connects to the database to access the data and how the data and web pages are modified 7.2 Limitations and Future Development There are some limitations for the current system to which solutions can be provided as a future development:
Newsletter system can be applied with the system. So administrator will be able to send all new information to all users. This website has not a newsletter management system. It will be great if we add it in future.
Discount coupon feature can be applied in our system. So user can get discount in every payment.
REFERENCES [1] Dave W. Mercer, Allan Kent, Steven D. Nowicki, David Mercer, Dan Squier , Wankyu Choi, “Beginning PHP5” [2] Luke Welling and Laura Thomson, “PHP and MySQL Web development” [3] “Apache: The Number One Web Server” Survey by Netcraft Company, [Online]. Website: www.netcraft.co.uk. [4] “PHP Hypertext Processor”, [Online]. Website; http://www.php.net [5] Tony Butcher, “MySQL in 21 Days”, Sams Teach Yourself. [6] Steven M. Schafer Paperback; John Wiley & Sons, “Apache, MySQL, and PHP Weekend Crash Course”, Course Program (13 October, 2003) .
[7] “Website Security – Acunetix Web Security Scanner”, [Online]. Website: http://www.acunetix.com . [8] D. Britton Johnston, Article on “An Introduction to Web Services Enabled with PHP” NuSphere Corporation (January 2002) [9] Mehdi Achour, Freidhelm Betz, Antony Dovgal, Nuno Lopes, Philip Olson, Gerog Richter, Damien Seguy, Jakub Vrana and several others, “PHP Manual”, Edited by Gabor Hojtsy (14-02-2005) Copyright 1997 – 2005, the PHP Documentation Group. [10] Simone Grassi, “MySQL Database and PHP Integration”. [11] Yogesh Deshpande,”Web Engineering and The BaBar Web” , (30 April ‘ 2003). [12] Yogesh Deshpande, San Murugesan, Athula Ginige1, Steve Hansen1, Daniel Schwabe, Martin Gaedke, Bebo White , “WEB ENGINEERING “ (October 18, 2002). [13] Abraham Silberschatz, Henry F. Korth and S.Sudarshan, “Database System Concepts”, Fifth Edition, Mcgraw-Hill International Edition. [14] “A User-centered Model for Web Site Design”, [Online] Website: http://www.pubmedcentral.nih.gov/. [15] “10 Ideas for Excellent Web Design”, [Online] Website: http://www.aestheticdesign.com/philosophy.html References Page 92 [16] Pressman, R.S. (1998) Can Internet-Based Applications Be Engineered? IEEE Software, September/October 1998. [17] Murugesan, S. and Deshpande, Y. (2001) Web Engineering, Lecture Notes in Computer Science- Hot Topics, vol 2016, Springer Verlag, 2001.