IWT

PROJECT

Submitted TO:
Ms. Poonam

Submitted By:

Alisha Trivedi (UE138007)

Himanshu Kain (UE138032)

Mohd Saif (UE138046)

Acknowledgement
The success and final outcome of this project required a lot of guidance and
assistance from many people and we are extremely fortunate to have got this all

along the completion of our project work. Whatever we have done is only due to
such guidance and assistance and we would not forget to thank them.

We respect and thank Ms. Poonam mam, for giving us an opportunity to do the

project work and providing us all support and guidance which made us complete

the project on time. We are extremely grateful to him for taking keen interest on

our project work and guided us all along, till the completion of our project work by
providing all the necessary information for developing a good system.

Declaration
I hereby declare that this project report entitled UIET COMMITTEE submitted
to the Panjab University is a record of an original work done by our group under
the guidance of MS. Poonam Maam, faculty member of UIET and has not been
submitted to any other University or Institute or published earlier.

Place: Chandigarh
Date:28/04/2016

Alisha Trivedi (UE138007)

Himanshu Kain (UE138032)

Mohd Saif (UE138046)

Abstract
A website is a collection of various committees details which contains convener,
co-convener, faculty member and Team members. The pages of websites can
usually be accessed from a common root URL called the index.html. The URLs of
the pages organize them into a hierarchy, although the hyperlinks between them
control how the reader perceives the overall structure and how the traffic flows
between the different parts of the sites.
The Committees websites has been developed using HTML, CSS and Bootstrap as
the Front End and, PHP, SQL Queries as the Back End.

PREFACE
As a part of Btech Curriculum and in order to gain practical knowledge in the field
of information technology, we are required to make a project on UIET
COMMITTEE PAGE. The basic objective behind doing this project is to get
knowledge of HTML, CSS, PHP, and SQL QUERIES.

In this project this webpage have following main Contents:

Links to UIET Committees, Contact us, Student Register and Footer.
Doing this project report helped us to enhance our knowledge in various languages.
Through this report we come to know about importance of team work and role of
devotion towards the work.

INDEX
1. SUMMARY
Advantages
Purpose

2. INTRODUCTION TO THE PROJECT

Background
Intended Audiences
Scope
Purpose of Documents
Objective
Features of a Computerized System
Pre-requisites
Need of project
Drawbacks of the existing system
Proposed system
Advantages of proposed system

3. WORK

3.1 Project Name

Structure of Document
Definitions and Abbreviations used in organizational framework
Mapping of different courts at different levels
Data flow diagram
Detailed description regarding DFD
Product functions
General Description
User characteristics
Features
Constraints

3.2 Software Requirement Specifications

System requirement specifications
Introduction
Specification requirements
user interface
hardware interface

Software interfaces

3.3 Project Details and Snapshots

Detail working of our Project

3.4 Testing the Project

Software testing
Unit testing
Integration testing

3.5 Database Used In Project

Database design

4. REVIEW
Intended audiences
Scope
Purpose

5. SCHEDULE OF ACTIVITIES
6. RESULT, CONCLUSION AND FUTURE WORK
Result
Conclusion and future scope

7. LIMITATIONS

Disadvantages/Requirements,

Advantage:-

Summary

The site can be updated to always provide the latest information like latest
news and notices about college committees of College etc.
Information is easy to gather.
It saves time.

Purpose:-

UIET committee site will be an interface between students and different

committees of UIET Panjab University.
This will help students to know who got selected in various committees and
who the faculty in Charge is.
They will come to know about the convener and co-convener of various
committees so that they can contact them.

INTRODUCTION TO PROJECT
Background:-

UIET COMMITTEE page will be a front page of UIET COMMITEE , which will
retrieve latest information from database.
A dynamic website is one that changes or customizes itself frequently and
automatically.

Intended Audiences:-

Although anyone can view website but it is intended for students.

Admin is only one person who can keep track of databases i.e. they can
insert, delete, update information in databases.

Scope:-

The scope of the website is to provide a high friendly set of web pages that are
easy to navigate and at the same time provides sufficient depth and information
about college committees.

Purpose of the Document:-

This document is the Software Requirement Specification (SRS) for the College
Management System for College (CMS) project .The purpose of this document is
to describe the functionality, requirements and general interface of the CMS.
This document describes the product and its requirements and constraints. It
provides a primarily non-technical description of the project targeted towards
external audiences. This section includes information such as data requirements,

functional requirements, and a general description of the product and its interaction
with users from the perspective of the client.

It also provides specific technical requirements as the team understands them at

this time and is intended for an internal audience. This section includes information
such as external interface requirements, performance requirements, and any other
technical requirements needed to design the software.

Objectives :1.
2.
3.
4.

Providing the online interface for students, faculty etc.

Increasing the efficiency of college record management.
Decrease time required to access and deliver student records.
To make the system more secure.

Features of computerized system:Processor

: Intel I5

Clock Speed

: 2.0 GHz

Ram

: 4 Gb

System Bus

: 64 Bit

Hard drive

: 1 TB

Key Board

: 108 Keys

Monitor
Modem

: SVGA Color
: 56 Kbps

Prerequisites:-

Any PC with Operating System providing networking and GUI facilities to

host the website and also to access the website.
Internet Facility.
Webhost - this is a company that will "host" your domain and web pages.
By "uploading" your "data"transferring the files that make up your
websiteto their server, you give the consumer access to your page on the
Internet.

Need of Project:-

The information is available on website is to be accessed by anyone,

anywhere, anytime.

Timely and up to date information that encourages readers to return to the

site.
Information is easy to gather.

It saves time.

Drawback of existing System:The file system were used and all the entries and updating was done
manually on the files which lead to various problems such as:

Data Isolation: Because data are scattered in various files, and files may be
in different formats, writing new application programs to retrieve the
appropriate data is difficult.
Duplication of data Redundant data occurs in file systems.
Dependency on application programs Changing files would lead to
change in application programs.

Proposed System:In our proposed system, we have provision for adding the details of the students
and faculty. Another advantage of the system is that it is very easy to edit these
details and delete when it is found unnecessary. By developing the system, we can
attain the following facilities:

Flexibility
Fast Response to Information Requests
Multiple Access
Cost Reduction
Less Storage

Project Name

WORK

Structure of Document:

As in our web projects, it aims to provide information about different committees

in UIET. Apart from that it also provide basic information about all the students
who are the member of different committees.

Software requirement specification: Text Editor: Notepad++

Notepad software, a form of simple text editing software.

Microsoft Notepad, a plain text editor included with Microsoft Windows.
Notepad++, a text editor for Windows developed in 2003.

 Web Server: XAMPP/LAMP

XAMPP:-

X: "Cross" as in its mean to be read as cross-platform because it can run on

many different operating systems which are Windows, Mac OS X, Linux
and Solaris.
A: The Apache HTTP Server. This is the web server that is used to run the
two programming languages it uses (we will get to these in a minute).
M: MySQL. This is a relational database management system that provides
multi-user access to a number of databases.
P: PHP. A programming language for the creation of dynamic web pages
(See my "PHP - Introduction and Example" thread for more information).
P: Perl. A high-level, general-purpose, interpreted, dynamic programming
language.
XAMPP is a free and open source cross-platform web server solution stack
package and interpreters for scripts written in the PHP and Perl programming
languages.
LAMP:-

LAMP is an open source Web development platform that uses Linux as the
operating system, Apache as the Web server, MySQL as the relational database
management system and PHP as the object-oriented scripting language. Because
the platform has four layers, LAMP is sometimes referred to as a LAMP stack.
Stacks can be built on different operating systems. Developers that use these tools
with a Windows operating system instead of Linux are said to be using WAMP.
Data Base Server Provider: MYSQL
MYSQL is an open-source client-server relational database management system
(RDBMS). MySQL is used in web applications and acts as the database component
of the LAMP software stack. Its popularity for use with web applications is closely
tied to the popularity of PHP, which is often combined with MySQL.

 BOOTSTRAP:

It is a combination of HTML, CSS, and Javascript code designed to help build

user interface components. Bootstrap was also programmed to support both
HTML5 and CSS3.It is also called Front-end-framework.

Bootstrap is a free collection of tools for creating a websites and web applications.

It contains HTML and CSS-based design templates for typography, forms, buttons,
navigation and other interface components, as well as optional JavaScript
extensions.
Some Reasons for programmers preferred Bootstrap Framework

Easy to get started

Base styling for most HTML elements(Code, ,Forms, Buttons, Images)
Extensive list of components
Programming Languages Used:

Front End: HTML, CSS, Bootstrap.

Back End: PHP, SQL Queries.

User Characteristics:User: students

Typical college students that are interested in committees seeking more indepth information about it.
Students that are in that college but are seeking for latest news and important
links for committees.

Data Flow Diagram

Collection of Data
Design of Web Page
Coding using HTML,
CSS and Bootstrap
Connection of frontend to
database using PHP
Insert Data to tables
using SQL Queries

Maintaining Website
for future reference

Project Code and Screenshots

Index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Committee | UIET</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/custom.css" rel="stylesheet">
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="index.html">
<img src="images/Logo.jpg" width="40px" height="40px">
</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active">
<a href="index.html">Home</a>
</li>
<li>
<a href="Contact.php">Contact Us</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li>
<a href="reg_form.php">Student Register!</a>
</li>

</ul>
</div>
</div>
</nav>
<div class="container">
<div class="row">
<div class="col-lg-12">
<h1 class="page-header"><a href="index.html">Committees</a>
<small>In UIET</small>
</h1>
</div>
</div>
<div class="row">
<div class="col-md-6 portfolio-item">
<a href="alumni.php">
<img class="img-responsive" src="images/alumni.png" alt="">
</a>
<h3>
<a href="alumni.php">Alumni Committee</a>
</h3>
<p>Alumni office works to foster this lifelong partnership and engages
the alumni for the betterment of UIET.</p>
</div>
<div class="col-md-6 portfolio-item">
<a href="bpc.php">
<img class="img-responsive" src="images/bpc.jpg" alt="">
</a>
<h3>
<a href="bpc.php">Brand Promotion Committee</a>
</h3>
<p>Officially founded in 2011, BPC is the 10th and the youngest
UTECHNOS Committee of UIET, Panjab University.</p>
</div>
</div>
<div class="row">
<div class="col-md-6 portfolio-item">
<a href="EDC.php">
<img class="img-responsive" src="images/edc.jpg" alt="">
</a>

<h3>
<a href="EDC.php">Entrepreneur Development Cell</a>
</h3>
<p>The entrepreneurship skills are rarely taught in college and what's
better than to start early. EDC provides you this learning opportunity. </p>
</div>
<div class="col-md-6 portfolio-item">
<a href="tpc.php">
<img class="img-responsive" src="images/tpc.jpg" alt="">
</a>
<h3>
<a href="tpc.php">Training & Placement Cell</a>
</h3>
<p>The training and placement cell of UIET through their concerned and
rigorous efforts have been able to get the students placed in one of the best
companies of the country.</p>
</div>
</div>
<div class="row">
<div class="col-md-6 portfolio-item">
<a href="PRT.php">
<img class="img-responsive" src="images/prt.jpg" alt="">
</a>
<h3>
<a href="PRT.php">Public Relation & Tourism</a>
</h3>
<p>PRT Committee UIET, Panjab University urges you to come to
contribute towards society through a small step. Your blood can save someone's
precious life and give them a second chance to live. </p>
</div>
<div class="col-md-6 portfolio-item">
<a href="utechnos.php">
<img class="img-responsive" src="images/utechnos.jpg" alt="">
</a>
<h3>
<a href="utechnos.php">Utechnos Committee</a>
</h3>
<p>Utechnos Committee aims to provide students with an educational
platform, where various events and workshops are conducted to promote the
technical fervor among the students.</p>

</div>
</div>
<div class="row">
<div class="col-md-6 portfolio-item">
<a href="sport.php">
<img class="img-responsive" src="images/sport.jpg" alt="">
</a>
<h3>
<a href="sport.php">Sports Committee</a>
</h3>
<p>The committee members, with their enthusiasm and team spirit,
embolden the students to be a part of something that is away from the
academics.</p>
</div>
<div class="col-md-6 portfolio-item">
<a href="magboard.php">
<img class="img-responsive" src="images/magboard.jpg" alt="">
</a>
<h3>
<a href="magboard.php">Magboard</a>
</h3>
<p>MAGBOARD of UIET has played a vital role in compiling the year
round activities and data, including the info about the previous and current
semester happenings in a very originative format.
</p>
</div>
</div>
</div>
<footer>
<div class="footer-blurb">
<div class="container">
<div class="row">
<div class="col-sm-4 footer-blurb-item">
<img class="img-circle"
src="images/alisha.jpg" alt="" width="100" height="100">
<h3>Alisha Trivedi</h3>
<p>Web Developer</p>

</div>
<div class="col-sm-4 footer-blurb-item">
<img class="img-circle"
src="images/me.jpg" alt="" width="100" height="100">
<h3>Himanshu Kain</h3>
<p>Web Designer</p>
</div>
<div class="col-sm-4 footer-blurb-item">
<img class="img-circle"
src="images/saif.jpg" alt="" width="100" height="100">
<h3>Mohd Saif</h3>
<p>Database Manager</p>
</div>
</div>
</div>
</div>
<div class="copyright">
<div class="container">
<p>All Rights Are Reserved &reg; Copyright &copy;
UietCommittees.com 2016</p>
</div>
</div>
</footer>
</body>
</html>

Form.html

<html>
<head>
<title>Register | Form</title>
<link rel="stylesheet" type="text/css" href="form.css"/>
</head>
<body background="images/2.jpg">
<form action="reg.php" method="post">

<table cellspacing="10" cellpadding="10" >

<tr>
<th colspan="2">
<label>Registration Form</label>
</th></tr>
<tr>
<td>
<label>Name </label>
</td>
<td>
<input type="text" size="30" name="cname" required/>
</td></tr>
<tr>
<td>
<label>Email Address</label>
</td>
<td>
<input type="email" size="30" name="email" />
</td></tr>
<tr>
<td>
<label>Contact Number </label>
</td>
<td>
<input type="number" size="30" name="num" required/>
</td>
</tr>
<tr>
<td>
<label>Gender</label>
</td>
<td>
<input type="radio" name="gender" value="male" required>Male</input>
<input type="radio" name="gender" value="female" required>Female</input>
</td></tr>
<tr>
<td>
<label>Branch</label>
</td><td>
<select name="category"><option name="">-Select-</option>

<tr>

<tr>

<option name="it">IT</option>
<option name="cse">CSE</option>
<option name="mech">MECH</option>
<option name="eee">EEE</option>
<option name="ece">ECE</option>
<option name="bio">BIO</option></select>
</td></tr>
<td>

<label>Year</label></th>

<td>
<select name="year"><option value="">-Select-</option>
<option value="1">First</option>
<option value="2">Second</option>
<option value="3">Third</option>
<option value="4">Fourth</option></select>
</td></tr>
<td>

<label>Committees</label></td>

<td>
<input type="checkbox" value="PRT" name="com[]">PRT</input>
<input type="checkbox" value="EDC" name="com[]">EDC</input>
<input type="checkbox" value="Utechnos"
name="com[]">Utechnos&nbsp;</input>
<input type="checkbox" value="Sports" name="com[]">Sports</input><br/>
<input type="checkbox" value="TPC" name="com[]">TPC</input>
<input type="checkbox" value="BPC" name="com[]">BPC</input>
<input type="checkbox" value="Magboard" name="com[]">Magboard</input>
<input type="checkbox" value="Alumni" name="com[]">Alumni</input>
</td></tr>
<tr>
<td></td>
<td>
<input type="submit" class="button" name="submit" value="Submit">
<input type="reset" class="button">
</td></tr>
</table>
</form>
</body></html>

Database Connectivity
<?php
$con=mysql_connect('localhost','root','');
if($con) //if($con==true)
{
$mydb=mysql_select_db("committee",$con);
if($mydb)
{
return true;
}
else
{
return false;
}

}
else
{
return false;
}
?>

Interfaces:

There are many types of interfaces as such supported by this Web Application
namely; User Interface, Software Interface and Hardware Interface.
- The protocol used shall be HTTP.
-The Port number used will be 80.
User Interfaces:

The user interface for the Application shall be compatible to any browser such as
Internet Explorer, Mozilla or Chrome by which user can access to the system.
The user interface can be implemented using any tool or plugins like Bootstrap
etc.
Hardware Interfaces:

Since the application run over the internet, all the hardware shall require to connect
internet will be hardware interface for the system. As for e.g. Modem, WAN
LAN, Ethernet Cross-Cable.
Software Interfaces:
Chrome Version
Mozilla

Input requirement: FORM

HTML Forms are required when you want to collect some data from the site
visitor. For example during user registration you would like to collect information
such as name, email address, credit card, etc.

A form will take input from the site visitor and then will post it to a back-end
application such as CGI, ASP Script or PHP script etc. The back-end application
will perform required processing on the passed data based on defined business
logic inside the application.

There are various form elements available like text fields, text area fields, dropdown menus, radio buttons, checkboxes, etc.
The HTML <form> tag is used to create an HTML form.

We have used form in our website to interact with other students. They will form
and the details will get saved in database and only admin can check the
information.

Testing the Project:

Testing is the process of evaluating a system or its component(s) with the intent to
find whether it satisfies the specified requirements or not. Testing is executing a
system in order to identify any gaps, errors, or missing requirements in contrary to
the actual requirements.
Software Testing :

Functionality Testing: - This is used to check if your product is as per

the specifications you intended for it as well as the functional
requirements you charted out for it in your developmental
documentation. Testing Activities Included: Test all links in your
webpages are working correctly and make sure there are no broken links.
Links to be checked will include Outgoing links
Internal links

Anchor Links
Register Form and Contact Form are working as expected.

Interface Testing:- Three areas to be tested here are - Application , Web

and Database Server.

Application: Test requests are sent correctly to the Database and

output at the client side is displayed correctly. Errors if any must be

caught by the application and must be only shown to the administrator

and not the end user.

Web Server: Test Web server is handling all application requests

without any service denial.
Database Server: Make sure queries sent to the database give
expected results.

Compatibility testing: Compatibility tests ensures that your web

application displays correctly across different devices.

Performance Testing: This will ensure your site works under all loads.
Testing activities will include but not limited to Website application response times at different connection speeds

Load test your web application to determine its behaviour under

normal and peak loads.

Unit Testing :

Unit testing is focused on verifying small portions of functionality. For example,

an individual unit test case might focus on verifying that the correct data has been
saved to the database when the Submit button on a particular page is clicked.
Check all modules (form) working.

Verify each and every Server Requests and Responses.

Integration Testing :

Databases used in Project :

Mysql PHPMyAdmin database is used in our Project.

Database design is the process of producing a detailed data model of a database.

This data model contains all the needed logical and physical design choices and
physical storage parameters needed to generate a design in a data definition

language, which can then be used to create a database. A fully attributed data
model contains detailed attributes for each entity.
In the relational model these are the tables and views.
Tables used in Database :

reg - For storing different Students details.

Faculty - For storing different Faculty member of different

committees.
Team member -To store all students of different committees.
contact -To Store students queries.

Convener-To store convener name.

Co-convenor-To store co-convener name.

SCHEDULE OF ACTIVITIES
1.

First data is collected.

2. The front end of the website is designed then, and this step keeps on repeating
unless design is accepted.
4. Then the coding starts, the basic HTML page are coded using various tags.
5. Then after HTML coding, CSS, PHP and JAVASCRIPT coding is done.
6. After this, the database is connected to the front end using Php.
7. Now data is entered through the front end to the back end, that means from
admin to the database.
8. The links are created by clicking on which we can interact with the databases.
9. Then the website is tested and reviewed to see if there are any errors in the front
end and the backend.

RESULT, CONCLUSION AND FUTURE WORK

I.

Result
As a result a website is prepared which can handle the student information of
the different committees.

II.

III.

As a result a website is produced that improves the efficiency of college

record management.

Conclusion

This project is successfully implemented with all the features

mentioned in system requirements specification.
The application provides appropriate information to users according to
the chosen service.
The project is designed keeping in view the day to day problems faced
by a college.

Future Work
Since the system uses DBMS there are various disadvantages which can be
taken care of in future such as:
Complexity: A database system creates additional complexity and
requirements. The supply and operation of a database management
system with several users and databases is quite costly and
demanding.
Costs: Through the use of a database system new costs are generated
for the system itself but also for additional hardware and the more
complex handling of the system.

 Lower Efficiency: A database system is a multi-use software which is

often less efficient than specialised software which is produced and
optimised exactly for one problem.
More functionalities can be introduced in the system in order to make
it more efficient.

I.

Disadvantages

LIMITATIONS

Power failure, computer viruses and hackers are the inherent problems of
using computerized systems.
Once data been input into the system, automatically the output are obtained
hence the data being input needs to be validated for accuracy and
completeness.
Danger of computer fraud if proper level of control and security whether
internal and external are not properly been instituted.