0% found this document useful (0 votes)
196 views

Final Project File Adh

This 3-month project report summarizes the development of an alumni website for National P.G College. The website allows alumni to register profiles, view upcoming events, and see photos of the college. It aims to promote continued engagement between alumni and the college. The report documents the system requirements, including modules for registration, login, events, photos, and information about the college. Screenshots and coding are provided to demonstrate the implementation and functionality of the alumni website.

Uploaded by

Mansi Yadav
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
196 views

Final Project File Adh

This 3-month project report summarizes the development of an alumni website for National P.G College. The website allows alumni to register profiles, view upcoming events, and see photos of the college. It aims to promote continued engagement between alumni and the college. The report documents the system requirements, including modules for registration, login, events, photos, and information about the college. Screenshots and coding are provided to demonstrate the implementation and functionality of the alumni website.

Uploaded by

Mansi Yadav
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 166

A

THREE MONTH
INDUSTRIAL TRAINING PROJECT REPORT

ON

“Alumni Website of National P.G College”

SUBMITTED

TO
DEPARTMENT OF SOFTWARE DEVELOPMENT AND E-
GOVERNANCE

DEEN DAYAL UPADHAYA KAUSHAL KENDRA


NATIONAL POST GRAUATE COLLEGE
2, RANA PRATAP MARG, HAZRAT GANJ
LUCKNOW 226001
Mansi Yadav B.Voc VI Sem 718660 Batch: 2018-2021

Acknowledgement
It gives me immense pleasure in submitting the project report on “Alumni Website” for the
partial fulfillment of the requirements for the degree of B.Voc(SD& eG) at Deen Dayal
Upadhyay Kaushal Kendra.

I wish to place on my record my deep sense of gratitude and dedicate the whole project to
my project guide, ma’am Dr. Amitabha Yadav for her constant motivation and valuable help
through the project work. I also want to extend my thanks to other faculties for their
cooperation during my course.

I have completed the project at the UPTEC Computer Consultancy Limited. I would like to
thank our instructor Sir Anshumaan and our project coordinator Leenu Jain ma’am for their
help and support throughout the completion of the project.

Finally I would like to thank my friends and my team for their cooperation to complete this
project, who not only encouraged me but also helped me in the process of making this
project.

Thanking All

Mansi Yadav

718660

1
2
Certificate

3
TABLE OF CONTENTS

S.No. Contents Page No.


1. Introduction 5
2. Problem Formulation 6
3. Statement of the problem 6
4. Objective of the study 7
5. System Requirement Specifications 8-18

5.1Feasibilty Report 9-10


5.2Specific Requirement 11-12
5.3Design 13-18

6. Screenshots of the project 19-25


7. Coding 26-124
8. Testing 125-127
9. Implementation 128-129
10. Significance 130
11. Limitations 131
12. References 132

4
List of Tables

Table No. Table Name Page No.

5.2.1 Registered alumni at the site 11

5.2.2 Current users of the site 12

5.2.3 Upcoming events 12

5.2.4 Feedback provided by the alumni 13

5
1. INTRODUCTION

The information system for communication with alumni embodies one of many ways how university can
keep tracking with its graduates. Except for communication between university and its graduates, the
information system should allow communication between graduates themselves and their personal
presentation in public. The system also should collect actual information about working experience of
graduates, which can improve faculty credits and teaching process. The presented information system
includes all these points and focuses on usability and comfortable user interface.

The aim of this project is to build an Alumni of National P.G College online dashboard; it is intended to
manage with their respective fields. The project manages the fresh as well as old graduate students with
their respective information in actively participating in making registering, searching, managing the alumni
information for sharing their expertise, network, jobs opportunities and resources. This participation has
evolved into multiple dimensions; and is now eager to formally enter into the domain of mentorship to
students through a regular program. Alumni registration management system (Alumni Dashboard) is a step
towards this, creating multidimensional interactions between current and past students of National P.G
College.

1.1 NEED OF THE PROJECT

 Alumni serve many valuable roles, such as helping to build and grow an institution’s brand through
word-of-mouth marketing.
 Colleges also rely on alumni to provide mentoring, internships, and career opportunities to
students.
 Talented alumni will likely have a wealth of experience and skills to share with current students via
talks and newsletters.
 The alumni website is the portal where you can showcase important institutional announcements,
various activities planned, reunions planned, etc. It’s always beneficial to analyze our alumni to get
the knowledge of what is most appealing to them as an alumni website.
 In effect, colleges and universities need to view students as lifelong commitments that do not end
at graduation. Alumni are resources that can provide meaningful and mutually beneficial
relationships over time.

1.2 SCOPE OF THE PROJECT

 The scope of the project is get all the alumni of our college under one roof so they all can connect
with the college while improving their relationships with batch mates and the college.

 They can also take part in the various activities going on in their college.

6
2. Problem Formulation

The college had no means to connect with their pass out students. On the other hand , the alumni of the
college had no means to remain updated with the events and other sources of the college.

Well we can say that it is the dream of a student to remain connected with the college and to be
acknowledged with their future achievements by their college. Colleges also rely on alumni to provide
mentoring, internships, and career opportunities to students.

Thus we have decided to gather our alumni to connect with the college and taking part in the ongoing
events of the college.

3. Statement of the project

 The scope of the project is get all the alumni of our college under one roof so they all can
connect with the college while improving their relationships with batch mates and the college.
 They can also take part in the various activities going on in their college.
 The alumni website is the portal where you can showcase important institutional
announcements, various activities planned, reunions planned, etc. It’s always beneficial to
analyze our alumni to get the knowledge of what is most appealing to them as an alumni
website.
 In effect, colleges and universities need to view students as lifelong commitments that do not
end at graduation. Alumni are resources that can provide meaningful and mutually beneficial
relationships over time.
 Talented alumni will likely have a wealth of experience and skills to share with current students
via talks and newsletters.

7
4. Objective of the study
The objective of the project can be determined as follows:

 To promote and encourage a continuing interest in the college.


 To effectively employ the talents, energies and contributions of alumni to constructive end for the
college.
 Serving as the coordinating and communication link between alumni and the college.
 Conducting targeted programs and activities designed to: strengthened the relationship between
the college and its alumni and friends; attract qualified students; recognize achievement and
contributions ; and to heighten the sense of pride and commitment to the college.
 Mobilizing support of alumni for the betterment of the college through a network of Alumni
chapters and individual contacts.

MODULES
There are following modules for this system

 Home:
In this module alumni can have a over view of the website. It shows the options to go to any modules.

 Registration:
In this module new alumni can register himself or herself on this website by filling some criteria i.e., Name,
Contact Number Date of birth, E-mail, Address, Date of joining of college, City, State, Course which he or
she had pursued by him/her Roll Number, Profile Photo, User ID, Password.

 Log In:
In this module, alumni who have registered themselves on website can log in into their profile by simply
entering User ID and Password.

In case if user forget their password there is a forget password option which helps them to recover their
password.

 Event:
In this module, alumni can see upcoming events, photos or previous events, date of upcoming events.

 Visit Us:
In this module, alumni can see the photos of college, and photos of the facility provided by the college
administration.

 About Us:
In this module, alumni can see the history of college, and know about the college in appropriate manner.

8
5. SYSTEM REQUIREMENT SPECIFICATION

There are 2 main users of the system:

1. ADMIN
2. ALUMNI

ADMIN

 Admin can login into the system with his user name and password.
 Admin can add a new admin.
 Admin can change password.
 Admin can add a course.
 Admin can update the upcoming events according to the situation.
 Admin can give response on the feedback given by alumni.
 Admin can maintain information and details of the alumina. Only Admin can manage their
record.
 He can manage all the details of the website.

ALUMINA

 Alumni can sign in the website by completing registration form.


 Alumni can login into his/her account on the website.
 Alumni can go through the upcoming events.
 Alumni can view the photos of college and events of the college.
 Alumni can send feedback to admin.
 Alumni can get contact information of the college on this website.
 He can also connect to his college by social media.

9
5.1 FEASIBILITY REPORT
Feasibility study is the high level capsule version of the entire requirement analysis process. The objective of
feasibility study is to determine whether the proposed system can be developed with available resources. Different
kinds of feasibilities for “ALUMNI WEBSITE” are as follows:

5.1.1 Technical Feasibility

It is concerned with hardware and software feasibility. In this study , one has to test whether the proposed
system can be developed using existing technology or not ,

If new technology is required, what is the likely hood that its can be developed ? The organization for which the
system to be developed does not provides Online Services . Hence there is a requirement of new hardware and
software technology for the deployment of proposed system.

Website is being developed with the popularity and advancements of the web technology. “Alumni Website” is
being developed on Google webserver using Python IDLE and MySQL. Therefore we can say that his project is
Technically Feasible and is adaptive to the modern advancements and provides ease of use.

As per requirements the system to be developed should have speed response because of fast change info,
programming productivity, reliability, security, scalability, integration and availability. To meet this I as a developer
found MYSQL as a right choice because of its features platform independence, modularity and reusability.

5.1.2 Operational Feasibility

Operational Feasibility is all about problems that may arise during operations. Operational Feasibility
determines whether the proposed system satisfies the user objectives and can fitted into current system operation.
The proposed system “Alumni Website” can be justified as operationally feasible basing on the following :

 The methods of processing and presentation are completely acceptable by the users because they
completely meet all the user and admin requirements.
 The users have been involved during the preparation of requirement analysis and design process.
 The system will certainly certify the user objectives and it will also enhance their capability.
 The system can be best fitted into current operation and requires little training to both administrator and
user.
 Application will be able to provide adequate, timely, accurate help, documentation, useful and required
information to all the levels and categories of users.
 It will be fast enough to response the query because of using efficient search methodology in the system.
 Security measures will be taken to stop unauthorized access of the files, information and data in the
application.

5.1.3 Economical Feasibility

This includes an evaluation of all incremental costs and benefits expected if proposed system is implemented
costs-benefits analysis which is to be performed during economical feasibility delineates costs for project
development and weighs them against benefits of system. In this the proposed system replaces the manual process
of receiving orders which benefits the organization to get more orders and good response. So developing this system
is economically feasible.

The economic feasibility of the system looks upon the financial aspects of the system. The estimate of the
project “Alumni Website” will be calculated using COCOMO Model.

10
COCOMO is a regression model based on LOC i.e. Number of lines of code. It is a procedural cost estimate model for
software projects and often used as a process of reliability predicting the various parameters associated with making
a project such as size, effort, cost, time and quality.

5.1.4 Schedule Feasibility

In this type of feasibility study, we determine that whether the whether the proposed project can be completed
in the specified time frame or not.

In our case, the Project “ALUMNI WEBSITE” can be finished in the targeted time-frame.

So it is feasible in terms of Time Feasibility.

5.1.5 Legal Feasibility

This feasibility evaluates whether my project breaks any law or not. According to our analysis, our website
“Alumni Website” does not break any law.

11
5.2 SPECIFIC REQUIREMENT
5.2.1 EXTERNAL INTERFACE REQUIREMENT

“Alumni Website” contains following user interface:

 Home screen: This screen welcomes the user and he can visit various interfaces from here.
 Registration screen: This screen asks the user to register him on the website.
 Login screen: Authenticating Registered Users. This screen should accept user id and password and
authenticate against corporate authentication system.
 Event screen: This screen tells gives information about the ongoing, upcoming and previous events of the
college.
 View screen: Alumni can see the photos of college, and photos of the facility provided by the college
administration.
 About screen: Alumni can see the history of college, and know about the college in appropriate manner.

5.2.2 PERFORMANCE REQUIREMENT

“Alumni Website” application should perform following requirements:

 All pages should load within 3 seconds,

 Search result should be displayed within 10 seconds,

 Checkout should happen within 5 to 9 seconds.

5.2.3 SOFTWARE SYSTEM ATTRIBUTES REQUIREMENT

 Reliability: “Alumni Website” should provide reliable and relevant search result 100% of times. The logout
operation should end reliably within 5 to 9 seconds.

 Security: Following security standards should be followed:

1. Login operation should be performed using transport layer security (HTTPS) All input fields should
be validated for SQL injection scenarios and HTML reserved words scenarios.

2. There should be well-defined password policy covering password change frequency, invalid
attempts allowed, etc.

 Maintainability: The following maintainability features should be supported:

1. All code artifacts should have proper documentation.

2. “Alumni Website” should adopt standards based integration for extensibility and scalability.

12
5.2.4 HARDWARE AND SOFTWARE REQUIREMENTS

MINIMUM HARDWARE REQUIREMENTS

SERVER SIDE:

Processor 2.4 GHz


Hard Disk 40GB Free Space
CLIENT RAM 2 GB
SIDE:

Processor 1.9 GHz


Hard Disk 20GB Free Space
MINIMUM RAM 1 GB

SOFTWARE REQUIREMENTS

SERVER SIDE:

Operating Server WSGI Server


Front-End Tools Python, Django
Back-End Tools MySQL DB

CLIENT SIDE:

Operating System Windows 10


Web Browser Google Chrome

13
5.3 Design
The major functionality is divided in 2 parts:

ADMIN

 Admin can add a new admin.


 Admin can update the portfolio.
 Admin can update the upcoming events according to the situation.
 Admin can response on the feedback given by alumni.

ALUMNI

 Alumni can sign in the website by completing registration form.


 Alumni can go through to the upcoming events.
 Alumni can view the photos of college and events of the college.
 Alumni can send feedback to admin.

MODULES

 Home:
The home module is a kind of a first expression of the whole website. In this module alumni can have an over view of
the website. It shows the various options to go to any modules. It paves the way for both alumni and admin to go to
various options.

 Registration:
The important part to use a website is to get register yourself on the website. In this module new alumni can register
himself or herself on this website by filling all the important criteria i.e., Name, Contact Number Date of birth, E-
mail, Address, Date of joining of college, City, State, Course which he or she had pursued, his/her Roll Number,
Profile Photo, User ID, Password.

Here, the most important part is to recognize the member which is done by searching his/her roll no in the database.
If the roll no gets matched it, his registration is successful. So only the alumni of the college can register him/her on
the website.

Table 5.2.1 registered alumni

 Log in:
After registering himself on the website, he can approach the site easily with his user ID and password and can visit
the site according to his will. The login option saves lot of time for the frequent users. In this module alumni who
have registered themselves on website can log in into their profile by simply entering User ID and Password.

14
Sometimes people can forget their credentials like password so in case if user forgets the password there is a forget
password option which helps them to recover their password.

Table 5.2.2 users of the site

 Event:
The event modules establishes the main connection between the alumni and college as the events make the alumni
under a roof if they participate in these events. In this module alumni can see upcoming events, photos or previous
events, date of upcoming events.

Table 5.2.3 events

 Visit Us:
In this module alumni can see the photos of college, and photos of the facility provided by the college
administration. The photos and videos of the college and the facilities share a lot of emotions with its alumni where
they spent 3 years and have achieved great experiences and knowledge in their respective fields. The visit us page
contains these memories of the alumni.

The visit us page contains feedback option also which can be used by the alumni to provide the feedback to the
college. The feedback is an important part for the college as well as for the website so it can improve the regarding
areas of the website.

Table 5.2.4 feedback

 About Us:
The about us module tells about the college, its history, and what it had achieved throughout these years. It helps
to us know more about the college in every perspective.
15
Entity Relationship Diagram

message
ADMIN feedback
manage

address
contact

view event
visit us

title photos
name views
Alumni
date

has
name

send
roll no

course pictures videos


view feedback

title title

events

college profile

16
DATA FLOW DIAGRAM
Zero Level Flow Diagram

This is the zero level DFD of Alumni Website, where we have elaborated the high level process of Alumni.
It’s a basic overview of the whole Alumni website or process being analyzed or modeled.

FEEDBACK
MANAGEMENT

ALUMNI COLLEGE
MANAGEMENT MANAGEMENT
ALUMNI WEBSITE

EVENT ADMIN
MANAGEMENT MANAGEMENT

One Level Flow Diagram

First Level DFD of Alumni Website shows how the system is divided into sub-systems (processes), each of which
deals with one or more of the data flows to or from an external agent, and which together provide all of the
functionality of the project as a whole.

17
Alumni Generate alumni
Management details

Event Generate events


Management details
ADMIN WEBSITE

Admin Generate college


Management details

College Generate
Management feedback

Feedback Manage admin


Management

Two Level Flow Diagram

DFD level-2 then goes one step deeper into parts of Level 1 of project. It may require more functionality of Alumni to
reach the necessary level of detail about the Alumni functioning.

18
ADMIN Login into Check roles
system of access
Manage alumni details

ALUMNI

Manage user permission

check Manage
credentials modules
Manage event details

Forget
Visit
password Manage role of user
moduless
Change
password
Manage system admins

Manage college profiles

Visit events Manage feedback

Send feedback

Visit college profile

Contact with other


alumni

19
6. SCREENSHOTS OF THE PROJECT
Homescreen:

Login page:

20
Sign-up page:

21
View page:

22
About us page:

23
Events page:

24
ADMIN END SCREENSHOTS
Admin login:

Admin signup:

Alumni feedback page:


25
Events updating page:

26
7. CODING

Front End

1.Home Page (homestart.html)


<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width,initail-scale=1.0">
<title> Alumni Website</title>
<script src="https://kit.fontawesome.com/fec5e8fa5e.js" crossorigin="anonymous"></script>
<style>
*{
margin-left:10%;
margin-right:10%;
margin:0;
padding:0;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
}
.header{
min-height:100vh;
width:100%;
animation:ani 5s;
animation-iteration-count:infinite;
background-position:center;
background-size:cover;
position:relative;
}
@keyframes
ani{
0%{background-image:linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url("/static/p4.jpg");}
25%{background-image:linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url("/static/p2.jpg");}
50%{background-image:linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url("/static/p3.jpg");}
100%{background-image:linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url("/static/p6.jpg");}
}
.text-box{
width:90%;
color:#fff;
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
text-align:center;
}
.text-box h1{
font-size:50px;
}
.text-box h2{
font-size:20px;
}
.text-box p{
margin:10px 0 40px;
font-size:14px;
color:white;
27
}
.hero-btn {
display:inline-block;
color:white;
text-decoration:none;
border:1px solid white;
padding:12px 34px;
font-size:13px;
background:transparent;
position:relative;
cursor:pointer;
}
.hero-btn:hover
{
border:1px solid #f44336;
background:#f44336;
}
nav {
position: fixed;
z-index: 10;
left: 0;
right: 0;
top: 0;
font-family: 'Montserrat', sans-serif;
padding: 0 5%;
height: 100px;
background-color:powderblue;
}
nav .logo {
float: left;
width: 40%;
height: 100%;
display: flex;
align-items: center;
font-size: 24px;
color: #fff;
}
nav .links {
float: right;
padding: 0;
margin: 0;
width: 60%;
height: 100%;
display: flex;
justify-content: space-around;
align-items: center;
}
nav .links li {
list-style: none;
}
nav .links a {
display: block;
padding: 1em;
font-size: 16px;
font-weight: bold;
color: #fff;

28
text-decoration: none;
transition:0.5s;
}
#nav-toggle {
position: absolute;
top: -100px;
}
nav .icon-burger {
display: none;
position: absolute;
right: 5%;
top: 50%;
transform: translateY(-50%);
}
nav .icon-burger .line {
width: 30px;
height: 5px;
background-color: #fff;
margin: 5px;
border-radius: 3px;
transition: all .3s ease-in-out;
}
@media screen and (max-width: 768px) {
nav .logo {
float: none;
width: auto;
justify-content: center;
}
nav .links {
float: none;
position: fixed;
z-index: 9;
left: 0;
right: 0;
top: 100px;
bottom: 100%;
width: auto;
height: auto;
flex-direction: column;
justify-content: space-evenly;
background-color: rgba(0,0,0,.8);
overflow: hidden;
box-sizing: border-box;
transition: all .5s ease-in-out;
}
nav .links a {
font-size: 20px;
}
nav :checked ~ .links {
bottom: 0;
}
nav .icon-burger {
display: block;
}
nav :checked ~ .icon-burger .line:nth-child(1) {
transform: translateY(10px) rotate(225deg);

29
}
nav :checked ~ .icon-burger .line:nth-child(3) {
transform: translateY(-10px) rotate(-225deg);
}
nav :checked ~ .icon-burger .line:nth-child(2) {
opacity: 0;
}
}
@media(max-width: 700px)
{
.text-box h1{
font-size:20px;
}
.nav-links ul li
{
display:block;
}
.nav-links
{
position:absolute;
background:#f44336;
height:100vh;
width:200px;
top:0;
right: -200px;
text-align:left;
z-index:2;
transition:1s;
}
nav .fa
{
display:block;
color:#fff;
margin:10px;
font-size:22px;
cursor:pointer;
}
.nav-links ul
{
padding:30px;
}
}
.steps{
width:80%;
margin:auto;
text-align:center;
padding-top:100px;
}
h1{
font-size:40px;
font-weight:600;
color:orange;
}
p{
color:#777;
font-size:14px;

30
font-weight:300;
line-height:22px;
padding:10px;
}
.row{
margin-top:5%;
display:flex;
justify-content: space-between;
}
.steps-col {
flex-basis:31%;
background:#fff3f3;
border-radius:10px;
margin-bottom:5%;
padding:20px 12px;
box-sizing:border-box;
transition:0.5s;
}
h3{
text-align:center;
font-weight:600;
margin:10px 0;
}
.steps-col:hover
{
box-shadow:0 0 20px 0px rgba(0,0,0,0.2);
}
@media(max-width:700px)
{
.row{
flex-direction:column;
}
}
footer{
background-color:black;
text-align:center;
width:100%;
}
</style>
</head>
<body>
<section class="header">
<nav>
<input id="nav-toggle" type="checkbox">
<div class="logo"><img src="/static/logo.png" alt="Image not found" width="250px">
</div>
<ul class="links">
<li><a href="../login">Log In</a></li>
<li><a href="../adminweb">Admin Log In</a></li>
<li><a href="../grid">View College</a></li>
</ul>
<label for="nav-toggle" class="icon-burger">
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>

31
</nav>
<div class="text-box">
<h1>Welcome to the National Post Graduate College
<br>Alumni Website</h1>
<h2>The Motto of the college is Maritum ethics i.e. merit with ethics.</h2>
<p>Be a part of a network comprosing of Alumni of National P.G College.
<br> Sign up now and be a part of An Autonomous,CPE
<br> And NAAC Grade 'A'</p>
<a href="" class="hero-btn">Visit Us To Know More</a>
</div>
</section>
<!----steps---->
<section class="steps">
<h1>Major Working</h1>
<p>Alumni and college is the utmost priorty</p>
<div class="row">
<div class="steps-col">
<img src="/static/o.jpg" width="100%" height="50%">
<h3> STEP 1</h3>
<p>Sign-Up now by going to the Alumni Sign-Up page.
Fill in your details</p>
</div>
<div class="steps-col">
<img src="/static/oo.png" width="100%" height="50%">
<h3> STEP 2</h3>
<p>Complete your profile details. Add your work,photo.
bio for easy verification from the college</p>
</div>
<div class="steps-col">
<img src="/static/ooo.jpg" width="100%" height="50%" >
<h3> STEP 3</h3>
<p>Monitor your college and participate in events<br>
conducted by your college.</p>
</div>
</section>
<!----javascript for toggle menu---->
<script>
var navLinks= document.getElementById("navLinks");
function showMenu(){
navLinks.style.right = "0";
}
function hideMenu(){
navLinks.style.right= "-200px";
}
</script>
<footer> <p style="color:whitesmoke">&copy All Right Reversed.<a class="footerlinks" href="#" target="_blank">National P.G
College</a></p></<footer>
</body
</html>

2.Registration Page of Alumni (reg.html)


<!DOCTYPE HTML>
<html>
<head>

32
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>
<script src="https://kit.fontawesome.com/fec5e8fa5e.js" crossorigin="anonymous"></script>
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Registration Form</title>
<style>
.heading{
background-color:white;
color:white;
}
.card{
margin-top:15px;
background-color:rgb(184, 227, 195);
}
body{
background-color:rgb(124, 226, 230)
}
img.rounded-corners{
border-radius:50px;
}
footer{
background-color:black;
text-align:center;
width:100%;
}
nav {
position: fixed;
z-index: 10;
left: 0;
right: 0;
top: 0;
font-family: 'Montserrat', sans-serif;
padding: 0 5%;
height: 100px;
background-color:powderblue;
}
nav .logo {
float: left;
width: 40%;
height: 100%;
display: flex;
align-items: center;
font-size: 24px;
color: #fff;
}
nav .links {
float: right;
padding: 0;
margin: 0;
width: 60%;
height: 100%;
display: flex;
justify-content: space-around;
align-items: center;
}

33
nav .links li {
list-style: none;
}
nav .links a {
display: block;
padding: 1em;
font-size: 16px;
font-weight: bold;
color: #fff;
text-decoration: none;
transition:0.5s;
}
#nav-toggle {
position: absolute;
top: -100px;
}
nav .icon-burger {
display: none;
position: absolute;
right: 5%;
top: 50%;
transform: translateY(-50%);
}
nav .icon-burger .line {
width: 30px;
height: 5px;
background-color: #fff;
margin: 5px;
border-radius: 3px;
transition: all .3s ease-in-out;
}
@media screen and (max-width: 768px) {
nav .logo {
float: none;
width: auto;
justify-content: center;
}
nav .links {
float: none;
position: fixed;
z-index: 9;
left: 0;
right: 0;
top: 100px;
bottom: 100%;
width: auto;
height: auto;
flex-direction: column;
justify-content: space-evenly;
background-color: rgba(0,0,0,.8);
overflow: hidden;
box-sizing: border-box;
transition: all .5s ease-in-out;
}
nav .links a {
font-size: 20px;

34
}
nav :checked ~ .links {
bottom: 0;
}
nav .icon-burger {
display: block;
}
nav :checked ~ .icon-burger .line:nth-child(1) {
transform: translateY(10px) rotate(225deg);
}
nav :checked ~ .icon-burger .line:nth-child(3) {
transform: translateY(-10px) rotate(-225deg);
}
nav :checked ~ .icon-burger .line:nth-child(2) {
opacity: 0;
}
}
@media(max-width: 700px) {
.text-box h1{
font-size:20px;
}
.nav-links ul li{
display:block;
}
.nav-links{
position:absolute;
background:#f44336;
height:100vh;
width:200px;
top:0;
right:-200px;
text-align:left;
z-index:2;
transition:1s;
}
nav .fa{
display:block;
color:#fff;
margin:10px;
font-size:22px;
cursor:pointer;
}
.nav-links ul{
padding:30px;
}
}
</style>
</head>
<body>
<div class=heading><img src="/static/CollegeLogo.png" alt="Image not found" ></div>
<nav>
<a href="home.html"></a>
<input id="nav-toggle" type="checkbox">
<div class="logo"><img src="/static/logo.png" alt="Image not found" width="250px"></div>
</div>
</nav>

35
<!----javascript for toggle menu---->
<script>
var navLinks= document.getElementById("navLinks");
function showMenu(){
navLinks.style.right = "0";
}
function hideMenu(){
navLinks.style.right= "-200px";
}
</script>
<div class="container">
<div class="row">
<div class="col-sm-8 mx-auto">
<div class="card">
<div class="card-body">
<div class="row">
<div class="col">
<center>
<img src="/static/generaluser.png" width="50"/>
</center>
</div>
</div>
<div class="row">
<div class="col">
<center>
<h4>Alumni SignUp</h4>
</center>
</div>
</div>
<div class="row">
<div class="col">
<hr>
</div>
</div>
<div id="ui">
<form class="form-group" method="post" action="/regaction/" enctype="multipart/form-data">
<input type="hidden" name="csrfmiddlewaretoken"
value="LCTnWDskgr00xFFQjrKSeXAX3oN61hWyVaFDc2ftT4Peb8udO8M6U8raAdNXFZ81">
<div class="row">
<div class="col-sm-6">
<label>Name:</label>
<input type="text" name="name" class="form-control" required placeholder="Full name"
>
</div>
<div class="col-sm-6">
<label>Contact:</label>
<input type="phone" name="contact" class="form-control" required placeholder="Contact Number">
</div>
</div>
<div class="row">
<div class="col-sm-6">
<label>Date of Birth:</label>
<input type="date" name="dob" class="form-control" required placeholder="Date of Birth">
</div>
<div class="col-sm-6">
<label>Email:</label>
<input type="Email" name="email" class="form-control" required placeholder="Email">
36
</div>
</div>
<div class="row">
<div class="col-sm-12">
<label>Address:</label>
<input type="text area" name="address" class="form-control" required placeholder="Address" row="3">
</div>
</div>
<div class="row">
<div class="col-sm-6">
<label>Date of Joining:</label>
<input type="date" name="doj" class="form-control" required placeholder="Date of Join">
</div>
<div class="col-sm-6">
<label>City:</label>
<input type="text" name="city" class="form-control" required placeholder="city">
</div>
</div>
<div class="row">
<div class="col-sm-6">
<label style="display:block">State:</label>
<select class="form-select" aria-label="State" name="state">
<option selected>State</option>
<option value="1">Andhra Pradesh</option>
<option value="2">Arunachal Pradesh</option>
<option value="3">Assam</option>
<option value="4">Bihar</option>
<option value="5">Chhattisgarh</option>
<option value="6">Rajasthan</option>
<option value="7">Goa</option>
<option value="8">Gujarat</option>
<option value="9">Haryana</option>
<option value="10">himachal Pradesh</option>
<option value="11">Jharkhand</option>
<option value="12">Karanataka</option>
<option value="13">Kerala</option>
<option value="14">Madhya Pradesh</option>
<option value="15">Maharashtra</option>
<option value="16">Manipur</option>
<option value="17">Meghalaya</option>
<option value="18">Mizoram</option>
<option value="19">Nagaland</option>
<option value="20">Odisha</option>
<option value="21">Punjab</option>
<option value="22">Sikkim</option>
<option value="23">Tamil Nadu</option>
<option value="24">Telangana</option>
<option value="25">Tripura</option>
<option value="26">Uttar Pradesh</option>
<option value="27">Uttarakhand</option>
<option value="28">West Bengal</option>
</select>
</div>
<div class="col-sm-6">
<label>Course:</label>
<input type="text" name="course" class="form-control" required placeholder="Course">

37
</div>
</div>
<div class="row">
<div class="col-sm-6">
<label>Roll no:</label>
<input type="Number" name="rollno" class="form-control" required placeholder="Roll No.">
</div>
<div class="col-sm-6">
<label>Profile Photo:</label>
<input type="file" name="ppic" class="form-control" required placeholder="profile photo">
</div>
</div>
<div class="row">
<div class="col-sm-6">
<label>User ID:</label>
<input type="text" name="userid" class="form-control" required placeholder="UserID">
</div>
<div class="col-sm-6">
<label>Password:</label>
<input type="password" name="passwd" class="form-control" required placeholder="Password">
</div>
</div>
<br>
<div class="row">
<div class="col">
<div class="form-group">
<button type="submit" class="btn btn-success btn-lg btn-block">Sign In</button>
</div>
</div>
</form>
</div>
</div>
</div>
<div style="width:100%;height:100%;background:red"></div>
<a href="../homestart"><b>Back to Homepage</b></a>
</div>
</div>
</div>
</div>
<br>
<footer> <p style="color:whitesmoke">&copy All Right Reversed.<a class="footerlinks" href="#" target="_blank">National P.G
College</a></p></footer>
</body>
</html>

3.Login Page(login.html)
<!DOCTYPE html >
<html>
<head>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>
<script src="https://kit.fontawesome.com/fec5e8fa5e.js" crossorigin="anonymous"></script>
<meta name="viewport" content="width=device-width,initial-scale=1">

38
<title>Login Form</title>
<style>
.heading{
background-color:white;
color:white;
transition: 1s;
}
.card{
margin-top:35px;
background-color:rgb(184, 227, 195);
}
body{
background-color:rgb(124, 226, 230)
}
img.rounded-corners{
border-radius:50px;
}
footer{
background-color:black;
margin-top: 40px;
text-align:center;
width:100%;
}
nav {
position: fixed;
z-index: 10;
left: 0;
right: 0;
top: 0;
font-family: 'Montserrat', sans-serif;
padding: 0 5%;
height: 100px;
background-color:powderblue;
}
nav .logo {
float: left;
width: 40%;
height: 100%;
display: flex;
align-items: center;
font-size: 24px;
color: #fff;
}
nav .links {
float: right;
padding: 0;
margin: 0;
width: 60%;
39
height: 100%;
display: flex;
justify-content: space-around;
align-items: center;
}
nav .links li {
list-style: none;
}
nav .links a {
display: block;
padding: 1em;
font-size: 16px;
font-weight: bold;
color: #fff;
text-decoration: none;
transition:0.5s;
}
#nav-toggle {
position: absolute;
top: -100px;
}
nav .icon-burger {
display: none;
position: absolute;
right: 5%;
top: 50%;
transform: translateY(-50%);
}
nav .icon-burger .line {
width: 30px;
height: 5px;
background-color: #fff;
margin: 5px;
border-radius: 3px;
transition: all .3s ease-in-out;
}
@media screen and (max-width: 768px) {
nav .logo {
float: none;
width: auto;
justify-content: center;
}
nav .links {
float: none;
position: fixed;
z-index: 9;
left: 0;
right: 0;
40
top: 100px;
bottom: 100%;
width: auto;
height: auto;
flex-direction: column;
justify-content: space-evenly;
background-color: rgba(0,0,0,.8);
overflow: hidden;
box-sizing: border-box;
transition: all .5s ease-in-out;
}
nav .links a {
font-size: 20px;
}
nav :checked ~ .links {
bottom: 0;
}
nav .icon-burger {
display: block;
}
nav :checked ~ .icon-burger .line:nth-child(1) {
transform: translateY(10px) rotate(225deg);
}
nav :checked ~ .icon-burger .line:nth-child(3) {
transform: translateY(-10px) rotate(-225deg);
}
nav :checked ~ .icon-burger .line:nth-child(2) {
opacity: 0;
}
}
@media(max-width: 700px) {
.text-box h1{
font-size:20px;
}
.nav-links ul li{
display:block;
}
.nav-links{
position:absolute;
background:#f44336;
height:100vh;
width:200px;
top:0;
right:-200px;
text-align:left;
z-index:2;
transition:1s;
}
41
nav .fa{
display:block;
color:#fff;
margin:10px;
font-size:22px;
cursor:pointer;
}
.nav-links ul{
padding:30px;
}
}
</style>
</head>
<body>
<div class="heading"><img src="/static/CollegeLogo.png" alt="Image not found"></div>
<nav>
<a href="home.html"></a>
<input id="nav-toggle" type="checkbox">
<div class="logo"><img src="/static/logo.png" alt="Image not found" width="250px"></div>
</div>
</nav>
<!----javascript for toggle menu---->
<script>
var navLinks= document.getElementById("navLinks");
function showMenu(){
navLinks.style.right = "0";
}
function hideMenu(){
navLinks.style.right= "-200px";
}
</script>
<div class="container">
<div class="row">
<div class="col-sm-8 mx-auto">
<div class="card">
<div class="card-body">
<div class="row">
<div class="col">
<center>
<img src="/static/generaluser.png" width="50"/>
</center>
</div>
</div>
<div class="row">
<div class="col">
<center>
<h4>Login Form<br><div style="background:red;position:absolute;top:40px;z-
index:0;left:40%"></div></h4>

42
</center>
</div>
</div>
<div class="row">
<div class="col">
<center>
<hr>
</center>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<form method="post" action="/loginaction/"><input type="hidden" name="csrfmiddlewaretoken"
value="eqpNhIGuKETz95WXzGZCZktlCJ7oquH5oYb3x7tDnhINNyLk4n1QFvky9y7f4cTy">
<center><label><b>User ID</b></label></center>
<div class="form-group">
<input type="text" name="userid" class="form-control" required placeholder="Member Id">
</div>
<center><label><b>Password</b></label></center>
<div class="form-group">
<input type="Password" name="pass" class="form-control" required placeholder="Password">
</div>
</div>
</div>
<div class=row>
<div class=col-sm-6>
<div class="form-group">
<button type="submit" class="btn btn-success btn-block btn-lg" id="Btn1">LOG IN</button>
</div>
</div>
<div class=col-sm-6>
<div class="form-group">
<a class="btn btn-primary btn-block btn-lg" href="../reg" role="button">Sign Up</a>
</form>
</div>
</div>
</div>
<center><a href="../forget"><b>Forget Password</b></a></center>
<a href="../homestart"><b>Back to Home</b></a>
</div>
</div>
</div>
</div>
</div>
</div>
<footer> <p style="color:whitesmoke">&copy All Right Reversed.<a class="footerlinks" href="#"
target="_blank">National P.G College</a></p></footer>
</body>

43
</html>
4.Forget(forget.html)

<!DOCTYPE html >

<html>

<head>

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>

<script src="https://kit.fontawesome.com/fec5e8fa5e.js" crossorigin="anonymous"></script>

<meta name="viewport" content="width=device-width,initial-scale=1">

<title>Alumni Forget Password</title>

<style>

.heading{

background-color:white;

color:white;

transition: 1s;

.card{

margin-top:35px;

background-color:rgb(184, 227, 195);

body{

background-color:rgb(124, 226, 230)

img.rounded-corners{

border-radius:50px;

footer{

background-color:black;

44
45
46
47
48
49
50
51
52
.heading{
background-color:white;
color:white;
transition: 1s;
}
.card{
margin-top:35px;
background-color:rgb(184, 227, 195);
}
body{
background-color:rgb(124, 226, 230)
}
img.rounded-corners{
border-radius:50px;
}
footer{
background-color:black;
margin-top: 40px;
text-align:center;
width:100%;
}
nav {
position: fixed;
z-index: 10;
left: 0;
right: 0;
top: 0;
font-family: 'Montserrat', sans-serif;
padding: 0 5%;
height: 100px;
background-color:powderblue;
}
nav .logo {
float: left;
width: 40%;
height: 100%;
display: flex;
align-items: center;
font-size: 24px;
color: #fff;
}
nav .links {
float: right;
padding: 0;
margin: 0;
width: 60%;
height: 100%;
display: flex;
53
justify-content: space-around;
align-items: center;
}
nav .links li {
list-style: none;
}
nav .links a {
display: block;
padding: 1em;
font-size: 16px;
font-weight: bold;
color: #fff;
text-decoration: none;
transition:0.5s;
}
#nav-toggle {
position: absolute;
top: -100px;
}
nav .icon-burger {
display: none;
position: absolute;
right: 5%;
top: 50%;
transform: translateY(-50%);
}
nav .icon-burger .line {
width: 30px;
height: 5px;
background-color: #fff;
margin: 5px;
border-radius: 3px;
transition: all .3s ease-in-out;
}
@media screen and (max-width: 768px) {
nav .logo {
float: none;
width: auto;
justify-content: center;
}
nav .links {
float: none;
position: fixed;
z-index: 9;
left: 0;
right: 0;
top: 100px;
bottom: 100%;
54
width: auto;
height: auto;
flex-direction: column;
justify-content: space-evenly;
background-color: rgba(0,0,0,.8);
overflow: hidden;
box-sizing: border-box;
transition: all .5s ease-in-out;
}
nav .links a {
font-size: 20px;
}
nav :checked ~ .links {
bottom: 0;
}
nav .icon-burger {
display: block;
}
nav :checked ~ .icon-burger .line:nth-child(1) {
transform: translateY(10px) rotate(225deg);
}
nav :checked ~ .icon-burger .line:nth-child(3) {
transform: translateY(-10px) rotate(-225deg);
}
nav :checked ~ .icon-burger .line:nth-child(2) {
opacity: 0;
}
}
@media(max-width: 700px) {
.text-box h1{
font-size:20px;
}
.nav-links ul li{
display:block;
}
.nav-links{
position:absolute;
background:#f44336;
height:100vh;
width:200px;
top:0;
right:-200px;
text-align:left;
z-index:2;
transition:1s;
}
nav .fa{
display:block;
55
color:#fff;
margin:10px;
font-size:22px;
cursor:pointer;
}
.nav-links ul{
padding:30px;
}
}
</style>
</head>
<body>
<div class="heading"><img src="/static/CollegeLogo.png" alt="Image not found"></div>
<nav>
<a href="home.html"></a>
<input id="nav-toggle" type="checkbox">
<div class="logo"><img src="/static/logo.png" alt="Image not found" width="250px"></div>
</div>
<label for="nav-toggle" class="icon-burger">
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</nav>
<!----javascript for toggle menu---->
<script>
var navLinks= document.getElementById("navLinks");
function showMenu(){
navLinks.style.right = "0";
}
function hideMenu(){
navLinks.style.right= "-200px";
}
</script>
<div class="container">
<div class="row">
<div class="col-sm-8 mx-auto">
<div class="card">
<div class="card-body">
<div class="row">
<div class="col">
<center>
<img src="/static/admin.png" width="50"/>
</center>
</div>
</div>
<div class="row">
<div class="col">
56
<center>
<h4>Admin Login</h4>
</center>
</div>
</div>
<div class="row">
<div class="col">
<center>
<hr>
</center>
</div>
</div>
<form method='POST' action='/adminwebaction/'>
<input type="hidden" name="csrfmiddlewaretoken"
value="SgXRZXmdKIfgnVEh9Ie7iny68TDjXZse2OJ7fm9mnl4u1otEEpglYypjFIDaBHEH">
<div class="row">
<div class="col-sm-12">
<center><label><b>Email</b></label></center>
<div class="form-group">
<input type="email" name="email" class="form-control" required placeholder="email">
</div>
<center><label><b>Password</b></label></center>
<div class="form-group">
<input type="password" name="passwd" class="form-control" required placeholder="Password">
</div>
</div>
</div>
<div class=row>
<div class=col-sm-12>
<div class="form-group">
<button type="submit" class="btn btn-success btn-block btn-lg" id="Btn1">LOG IN</button>
</div>
</div>
</div>
<center><a href=../adminforget><b>Forget Password</b></a></center>
<a href=../homestart><b>Back to Home</b></a>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<footer> <p style="color:whitesmoke">&copy All Right Reversed.<a class="footerlinks" href="#"
target="_blank">National P.G College</a></p></footer>
</body>
</html>

57
6.Admin forget Password(adminforget.html)

<!DOCTYPE html >

<html>

<head>

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>

<script src="https://kit.fontawesome.com/fec5e8fa5e.js" crossorigin="anonymous"></script>

<meta name="viewport" content="width=device-width,initial-scale=1">

<title>Admin Forget Password</title>

<style>

.heading{

background-color:white;

color:white;

transition: 1s;

.card{

margin-top:35px;

background-color:rgb(184, 227, 195);

body{

background-color:rgb(124, 226, 230)

img.rounded-corners{

58
border-radius:50px;

footer{

background-color:black;

margin-top: 40px;

text-align:center;

width:100%;

nav {

position: fixed;

z-index: 10;

left: 0;

right: 0;

top: 0;

font-family: 'Montserrat', sans-serif;

padding: 0 5%;

height: 100px;

background-color:powderblue;

nav .logo {

float: left;

width: 40%;

height: 100%;

display: flex;

align-items: center;

font-size: 24px;

color: #fff;

59
nav .links {

float: right;

padding: 0;

margin: 0;

width: 60%;

height: 100%;

display: flex;

justify-content: space-around;

align-items: center;

nav .links li {

list-style: none;

nav .links a {

display: block;

padding: 1em;

font-size: 16px;

font-weight: bold;

color: #fff;

text-decoration: none;

transition:0.5s;

#nav-toggle {

position: absolute;

top: -100px;

nav .icon-burger {

60
display: none;

position: absolute;

right: 5%;

top: 50%;

transform: translateY(-50%);

nav .icon-burger .line {

width: 30px;

height: 5px;

background-color: #fff;

margin: 5px;

border-radius: 3px;

transition: all .3s ease-in-out;

@media screen and (max-width: 768px) {

nav .logo {

float: none;

width: auto;

justify-content: center;

nav .links {

float: none;

position: fixed;

z-index: 9;

left: 0;

right: 0;

top: 100px;

bottom: 100%;

width: auto;

61
height: auto;

flex-direction: column;

justify-content: space-evenly;

background-color: rgba(0,0,0,.8);

overflow: hidden;

box-sizing: border-box;

transition: all .5s ease-in-out;

nav .links a {

font-size: 20px;

nav :checked ~ .links {

bottom: 0;

nav .icon-burger {

display: block;

nav :checked ~ .icon-burger .line:nth-child(1) {

transform: translateY(10px) rotate(225deg);

nav :checked ~ .icon-burger .line:nth-child(3) {

transform: translateY(-10px) rotate(-225deg);

nav :checked ~ .icon-burger .line:nth-child(2) {

opacity: 0;

62
@media(max-width: 700px) {

.text-box h1{

font-size:20px;

.nav-links ul li{

display:block;

.nav-links{

position:absolute;

background:#f44336;

height:100vh;

width:200px;

top:0;

right:-200px;

text-align:left;

z-index:2;

transition:1s;

nav .fa{

display:block;

color:#fff;

margin:10px;

font-size:22px;

cursor:pointer;

.nav-links ul{

63
padding:30px;

</style>

</head>

<body>

<div class="heading"><img src="/static/CollegeLogo.png" alt="Image not found"></div>

<nav>

<a href="home.html"></a>

<input id="nav-toggle" type="checkbox">

<div class="logo"><img src="/static/logo.png" alt="Image not found" width="250px"></div>

</div>

</nav>

<!----javascript for toggle menu---->

<script>

var navLinks= document.getElementById("navLinks");

function showMenu(){

navLinks.style.right = "0";

function hideMenu(){

navLinks.style.right= "-200px";

</script>

<div class="container">

64
<div class="row">

<div class="col-sm-8 mx-auto">

<div class="card">

<div class="card-body">

<div class="row">

<div class="col">

<center>

<img src="/static/forget.png" width="50"/>

</center>

</div>

</div>

<div class="row">

<div class="col">

<center>
<h4> Admin Forget Password<br><div style="background:red;position:absolute;top:40px;z-
index:0;left:40%"></div></h4>
</center>

</div>

</div>

<div class="row">

<div class="col">

<center>

<hr>

</center>

</div>

</div>

<div class="row">

<div class="col-sm-12">
<form method="post" action="/adminforgetaction/"><input type="hidden" name="csrfmiddlewaretoken"
value="im0niwHVdaQ8FRPjPoKjZBXLQnQtoc5GFkCbncPFWBw9PZyyAn3vZi55uIaY100H">
<center><label><b>Eamil ID</b></label></center>

65
<div class="form-group">

<input type="text" name="email" class="form-control" required placeholder="Email Id">

</div>

<center><label><b>Contact</b></label></center>

<div class="form-group">
<input type="number max="10" min="10"" name="num" class="form-control" required
placeholder="Contact no." >
</div>

<center><label><b>Date of Birth</b></label></center>

<div class="form-group">

<input type="date" name="dob" class="form-control" required placeholder="D.O.B">

</div>

<center><label><b>Password</b></label></center>

<div class="form-group">

<input type="password" name="pass" class="form-control" required placeholder="password">

</div>

<center><label><b>Confirmed Password</b></label></center>

<div class="form-group">

<input type="password" name="cpass" class="form-control" required placeholder="confirmed password">

</div>

</div>

</div>

<div class=row>

<div class=col-sm-12>

<div class="form-group">
<button type="submit" class="btn btn-warning btn-block btn-lg" id="Btn1">CHANGE
PASSWORD</button>
</div>

</div>

66
</form>

</div>

</div>

<a href="../homestart"><b>Back to Home</b></a>

</div>

</div>

</div>

</div>

</div>

</div>

</div>
<footer> <p style="color:whitesmoke">&copy All Right Reversed.<a class="footerlinks" href="#"
target="_blank">National P.G College</a></p></footer>

</body>

</html>

7.New Admin (newadmin.html)

<!DOCTYPE HTML>

<html>

<head>

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>

<script src="https://kit.fontawesome.com/fec5e8fa5e.js" crossorigin="anonymous"></script>

67
<meta name="viewport" content="width=device-width,initial-scale=1">

<title>New Admin Registration</title>

<style>

.heading{

background-color:white;

color:white;

.card{

margin-top:15px;

background-color:rgb(184, 227, 195);

body{

background-color:rgb(124, 226, 230)

img.rounded-corners{

border-radius:50px;

footer{

background-color:black;

text-align:center;

width:100%;

nav {

position: fixed;

z-index: 10;

left: 0;

right: 0;

top: 0;

font-family: 'Montserrat', sans-serif;

68
padding: 0 5%;

height: 100px;

background-color:powderblue;

nav .logo {

float: left;

width: 40%;

height: 100%;

display: flex;

align-items: center;

font-size: 24px;

color: #fff;

nav .links {

float: right;

padding: 0;

margin: 0;

width: 60%;

height: 100%;

display: flex;

justify-content: space-around;

align-items: center;

nav .links li {

list-style: none;

nav .links a {

display: block;

padding: 1em;

69
font-size: 16px;

font-weight: bold;

color: #fff;

text-decoration: none;

transition:0.5s;

#nav-toggle {

position: absolute;

top: -100px;

nav .icon-burger {

display: none;

position: absolute;

right: 5%;

top: 50%;

transform: translateY(-50%);

nav .icon-burger .line {

width: 30px;

height: 5px;

background-color: #fff;

margin: 5px;

border-radius: 3px;

transition: all .3s ease-in-out;

@media screen and (max-width: 768px) {

nav .logo {

float: none;

width: auto;

70
justify-content: center;

nav .links {

float: none;

position: fixed;

z-index: 9;

left: 0;

right: 0;

top: 100px;

bottom: 100%;

width: auto;

height: auto;

flex-direction: column;

justify-content: space-evenly;

background-color: rgba(0,0,0,.8);

overflow: hidden;

box-sizing: border-box;

transition: all .5s ease-in-out;

nav .links a {

font-size: 20px;

nav :checked ~ .links {

bottom: 0;

nav .icon-burger {

display: block;

nav :checked ~ .icon-burger .line:nth-child(1) {

71
transform: translateY(10px) rotate(225deg);

nav :checked ~ .icon-burger .line:nth-child(3) {

transform: translateY(-10px) rotate(-225deg);

nav :checked ~ .icon-burger .line:nth-child(2) {

opacity: 0;

}
@media(max-width: 700px) {

.text-box h1{

font-size:20px;

.nav-links ul li{

display:block;

.nav-links{

position:absolute;

background:#f44336;

height:100vh;

width:200px;

top:0;

right:-200px;

text-align:left;

z-index:2;

transition:1s;

nav .fa{

display:block;

72
color:#fff;

margin:10px;

font-size:22px;

cursor:pointer;

.nav-links ul{

padding:30px;

</style>

</head>

<body>

<div class=heading><img src="/static/CollegeLogo.png" alt="Image not found" ></div>

<nav>

<a href="home.html"></a>

<input id="nav-toggle" type="checkbox">

<div class="logo"><img src="/static/logo.png" alt="Image not found" width="250px"></div>

</div>

<ul class="links">

<li><a href="../feedback">Feedback</a></li>

<li><a href="../meet">Upadate Events</a></li>

<li><a href="../course">Course</a></li>

<li><a href="../homestart">Log Out</a></li>

</ul>

<label for="nav-toggle" class="icon-burger">

<div class="line"></div>

<div class="line"></div>

<div class="line"></div>

</label>

73
</nav>
<!----javascript for toggle menu---->

<script>

var navLinks= document.getElementById("navLinks");

function showMenu(){

navLinks.style.right = "0";

function hideMenu(){

navLinks.style.right= "-200px";

</script>

<div class="container">

<div class="row">

<div class="col-sm-8 mx-auto">

<div class="card">

<div class="card-body">

<div class="row">

<div class="col">

<center>

<img src="/static/admin.png" width="50"/>

</center>

</div>

</div>

<div class="row">

<div class="col">

<center>

<h4>Admin SignUp</h4>

</center>

</div>

74
</div>

<div class="row">

<div class="col">

<hr>

</div>

</div>

<div id="ui">

<form class="form-group" method="post" action="\newadminaction\">


<input type="hidden" name="csrfmiddlewaretoken"
value="sIIEh9lyAwi2zDaYm4tGNx60LfoUGJgTPGksmPtijXY3JLTd73MSNeekpAIpjxbU">
<div class="row">

<div class="col-sm-12">

<center>

<label><b>First Name:</b></label><center>

<input type="text" name="name" class="form-control" required placeholder="Full name">

</div>

</div>

<div class="row">

<div class="col-sm-12">

<center>

<label><b>Email:</b></label></center>

<input type="email" name="email" class="form-control" required placeholder="email">

</div>

</div>

<div class="row">

<div class="col-sm-12">

<center>

<label><b>Date of birth:</b></label></center>

<input type="date" name="dob" class="form-control" required placeholder="dob">

</div>

75
</div>

<div class="row">

<div class="col-sm-12"><center>

<label><b>Contact:</b></label></center>
<input type="phone number" name="contact" class="form-control" required placeholder="Contact
number">
</div>

</div>

<div class="row">

<div class="col-sm-12">

<center> <label><b>Password:</b></label></center>

<input type="password" name="passwd" class="form-control" required placeholder="Password">

</div>

</div>
<div class="row">

<div class="col-sm-12">

<center> <label><b>Confirm Password:</b></label></center>

<input type="password" name="cpasswd" class="form-control" required placeholder="password">

</div>

</div>

<br>

<div class="row">

<div class="col">

<div class="form-group">

<button type="submit" class="btn btn-success btn-lg btn-block">Sign In</button>

</div>

</div>

</div>

<div class="row">

<div class="col">

76
<div class="form-group">

<button type="submit" class="btn btn-danger btn-lg btn-block">Cancel</button>

</div>

</div>

</div>

</form>

</div>

<a href="../homestart"><b>Back to Homepage</b></a>

</div>

</div>

</div>

</div>

</div>

</div>

<br>

<div style="color:white;background:red;"></div>
<footer> <p style="color:whitesmoke">&copy All Right Reversed.<a class="footerlinks" href="#"
target="_blank">National P.G College</a></p></footer>
</body>
</html>

8.Event Update page(meet.html)

<!DOCTYPE HTML>

<html>

<head>

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>

77
<script src="https://kit.fontawesome.com/fec5e8fa5e.js" crossorigin="anonymous"></script>

<meta name="viewport" content="width=device-width,initial-scale=1">

<title>EventUpdate Page</title>

<style>

.heading{

background-color:white;

color:white;

.card{

margin-top:15px;

background-color:rgb(184, 227, 195);

body{

background-color:rgb(124, 226, 230)

img.rounded-corners{

border-radius:50px;

footer{

background-color:black;

text-align:center;

width:100%;

nav {

position: fixed;

z-index: 10;

left: 0;

right: 0;

top: 0;

78
font-family: 'Montserrat', sans-serif;

padding: 0 5%;

height: 100px;

background-color:powderblue;

nav .logo {

float: left;

width: 40%;

height: 100%;

display: flex;

align-items: center;

font-size: 24px;

color: #fff;

nav .links {

float: right;

padding: 0;

margin: 0;

width: 60%;

height: 100%;

display: flex;

justify-content: space-around;

align-items: center;

nav .links li {

list-style: none;

nav .links a {

display: block;

79
padding: 1em;

font-size: 16px;

font-weight: bold;

color: #fff;

text-decoration: none;

transition:0.5s;

#nav-toggle {

position: absolute;

top: -100px;

nav .icon-burger {

display: none;

position: absolute;

right: 5%;

top: 50%;

transform: translateY(-50%);

nav .icon-burger .line {

width: 30px;

height: 5px;

background-color: #fff;

margin: 5px;

border-radius: 3px;

transition: all .3s ease-in-out;

@media screen and (max-width: 768px) {

nav .logo {

float: none;

80
width: auto;

justify-content: center;

nav .links {

float: none;

position: fixed;

z-index: 9;

left: 0;

right: 0;

top: 100px;

bottom: 100%;

width: auto;

height: auto;

flex-direction: column;

justify-content: space-evenly;

background-color: rgba(0,0,0,.8);

overflow: hidden;

box-sizing: border-box;

transition: all .5s ease-in-out;

nav .links a {

font-size: 20px;

nav :checked ~ .links {

bottom: 0;

nav .icon-burger {

display: block;

81
nav :checked ~ .icon-burger .line:nth-child(1) {

transform: translateY(10px) rotate(225deg);

nav :checked ~ .icon-burger .line:nth-child(3) {

transform: translateY(-10px) rotate(-225deg);

nav :checked ~ .icon-burger .line:nth-child(2) {

opacity: 0;

}
@media(max-width: 700px) {

.text-box h1{

font-size:20px;

.nav-links ul li{

display:block;

.nav-links{

position:absolute;

background:#f44336;

height:100vh;

width:200px;

top:0;

right:-200px;

text-align:left;

z-index:2;

transition:1s;

nav .fa{

82
display:block;

color:#fff;

margin:10px;

font-size:22px;

cursor:pointer;

.nav-links ul{

padding:30px;

</style>

</head>

<body>

<div class=heading><img src="/static/CollegeLogo.png" alt="Image not found" ></div>

<nav>

<a href="home.html"></a>

<input id="nav-toggle" type="checkbox">

<div class="logo"><img src="/static/logo.png" alt="Image not found" width="250px"></div>

</div>

<ul class="links">

<li><a href="../newadmin">Add Admin</a></li>

<li><a href="../feedback">Feedback</a></li>

<li><a href="../course">Course</a></li>

<li><a href="../homestart">Log Out</a></li>

</ul>

<label for="nav-toggle" class="icon-burger">

<div class="line"></div>

<div class="line"></div>

<div class="line"></div>

83
</label>

</nav>

<!----javascript for toggle menu---->

<script>

var navLinks= document.getElementById("navLinks");

function showMenu(){

navLinks.style.right = "0";

function hideMenu(){

navLinks.style.right= "-200px";

</script>

<div class="container">

<div class="row">

<div class="col-sm-8 mx-auto">

<div class="card">

<div class="card-body">

<div class="row">

<div class="col">

<center>

<img src="/static/meet.png" width="50"/>

</center>

</div>

</div>

<div class="row">

<div class="col">

<center>

<h4>Alumni Meeting</h4>

</center>

84
<div style="background:red;color:white;text-align:center;"></div>

</div>

</div>

<div class="row">

<div class="col">

<hr>

</div>

</div>

<div id="ui">
<form method="post" action="/meetaction/" class="form-group"><input type="hidden"
name="csrfmiddlewaretoken"
value="i6M7Uu8kQ4LKajMo8PJ8Wl6UWvasdnVYF4oVZag4zvrLkrvDTO2kW2eeAQuXQbQZ">
<div class="row">

<div class="col-sm-12">

<center><label><b>Event Title:</b></label></center>

<input type="text" name="title" class="form-control" required placeholder="Event Title"

>

</div>

</div>

<div class="row">

<div class="col-sm-12">

<center><label><b>Location:</b></label></center>

<input type="text area" name="loc" class="form-control" required placeholder="location">

</div>

</div>

<div class="row">

<div class="col-sm-12">

<center><label><b>Event Date:<b></label></center>

<input type="date" name="date" class="form-control" required placeholder="Event Date">

</div>

</div>
85
<div class="row">

<div class="col-sm-12">

<center><label><b>Event Timing</b></label></center>

<input type="time" name="time" class="form-control" required placeholder="Event Time">

</div>

</div>

<div class="row">

<div class="col">

<label style="display:block">Status:</label>

<select class="form-select" name="sta" aria-label="State">

<option selected>State</option>

<option value="1">Active</option>

<option value="2">deactive</option>

</select>

</div>

</div>

<div class="row">

<div class="col-sm-12">

<center><label><b>Description<b></label></center>

<input type="text area" name="des" class="form-control" required placeholder="Description">

</div>

</div>
<br>

<div class="row">

<div class="col">

<div class="form-group">

<button type="submit" class="btn btn-success btn-lg btn-block">Update Event</button>

</div>

</div>

86
</form>

</div>

</div>

</div>

<a href="../homestart"><b>Back to Homepage</b></a>

</div>

</div>

</div>

</div>

<br>
<footer> <p style="color:whitesmoke">&copy All Right Reversed.<a class="footerlinks" href="#"
target="_blank">National P.G College</a></p></footer>
</body>

</html>

10.Update(update.html)

<!DOCTYPE html >

<html>

<head>

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>

<script src="https://kit.fontawesome.com/fec5e8fa5e.js" crossorigin="anonymous"></script>

<meta name="viewport" content="width=device-width,initial-scale=1">

<title>Update</title>

<style>

.heading{

background-color:white;

color:white;

87
transition: 1s;

.card{

margin-top:35px;

background-color:rgb(184, 227, 195);

body{

background-color:rgb(124, 226, 230)

img.rounded-corners{

border-radius:50px;

footer{

background-color:black;

margin-top: 40px;

text-align:center;

width:100%;

nav {

position: fixed;

z-index: 10;

left: 0;

right: 0;

top: 0;

font-family: 'Montserrat', sans-serif;

padding: 0 5%;

height: 100px;

background-color:powderblue;

88
nav .logo {

float: left;

width: 40%;

height: 100%;

display: flex;

align-items: center;

font-size: 24px;

color: #fff;

nav .links {

float: right;

padding: 0;

margin: 0;

width: 60%;

height: 100%;

display: flex;

justify-content: space-around;

align-items: center;

nav .links li {

list-style: none;

nav .links a {

display: block;

padding: 1em;

font-size: 16px;

font-weight: bold;

color: #fff;

text-decoration: none;

89
transition:0.5s;

#nav-toggle {

position: absolute;

top: -100px;

nav .icon-burger {

display: none;

position: absolute;

right: 5%;

top: 50%;

transform: translateY(-50%);

nav .icon-burger .line {

width: 30px;

height: 5px;

background-color: #fff;

margin: 5px;

border-radius: 3px;

transition: all .3s ease-in-out;

@media screen and (max-width: 768px) {

nav .logo {

float: none;

width: auto;

justify-content: center;

nav .links {

float: none;

90
position: fixed;

z-index: 9;

left: 0;

right: 0;

top: 100px;

bottom: 100%;

width: auto;

height: auto;

flex-direction: column;

justify-content: space-evenly;

background-color: rgba(0,0,0,.8);

overflow: hidden;

box-sizing: border-box;

transition: all .5s ease-in-out;

nav .links a {

font-size: 20px;

nav :checked ~ .links {

bottom: 0;

nav .icon-burger {

display: block;

nav :checked ~ .icon-burger .line:nth-child(1) {

transform: translateY(10px) rotate(225deg);

nav :checked ~ .icon-burger .line:nth-child(3) {

transform: translateY(-10px) rotate(-225deg);

91
}

nav :checked ~ .icon-burger .line:nth-child(2) {

opacity: 0;

}
@media(max-width: 700px) {

.text-box h1{

font-size:20px;

.nav-links ul li{

display:block;

.nav-links{

position:absolute;

background:#f44336;

height:100vh;

width:200px;

top:0;

right:-200px;

text-align:left;

z-index:2;

transition:1s;

nav .fa{

display:block;

color:#fff;

margin:10px;

font-size:22px;

cursor:pointer;

92
}

.nav-links ul{

padding:30px;

</style>

</head>

<body>

<div class="heading"><img src="/static/CollegeLogo.png" alt="Image not found"></div>

<nav>

<a href="home.html"></a>

<input id="nav-toggle" type="checkbox">

<div class="logo"><img src="/static/logo.png" alt="Image not found" width="250px"></div>

</div>

<ul class="links">

<li><a href="#home">Home</a></li>

<li><a href="#about">About</a></li>

<li><a href="#work">Work</a></li>

<li><a href="#projects">Projects</a></li>

<li><a href="#contact">Contact</a></li>

</ul>

<label for="nav-toggle" class="icon-burger">

<div class="line"></div>

<div class="line"></div>

<div class="line"></div>

</label>

</nav>

<!----javascript for toggle menu---->

<script>

93
var navLinks= document.getElementById("navLinks");

function showMenu(){

navLinks.style.right = "0";

function hideMenu(){

navLinks.style.right= "-200px";

</script>

<div class="container">

<div class="row">

<div class="col-sm-8 mx-auto">

<div class="card">

<div class="card-body">

<div class="row">

<div class="col">

<center>

<img src="/static/update.png" width="50"/>

</center>

</div>

</div>

<div class="row">

<div class="col">

<center>

<h4>Update Event Gallery</h4>

</center>

</div>

</div>

<div class="row">

<div class="col">

94
<center>

<hr>

</center>

</div>

</div>

<div class="row">

<div class="col-sm-6">

<center><label><b>EVENT</b></label></center>

</div>

<div class="col-sm-6">

<select class="form-select" aria-label="EVENT">

<option selected>EVENT</option>

</select>

</div>

</div>

<div class="row">

<div class="col-sm-6">

<center><label><b>EVENT PHOTOS</b></label></center>

</div>

<div class="col-sm-6">

<form action="/action_page.php">

<input type="file" id="file" name="file">

</form>

</div>

</div>

</div>

<div class=row>

<div class=col-sm-6>

<div class="form-group">

95
<center> <button type="submit" class="btn btn-success btn-lg " id="Btn1">UPLOAD</button></center>

</div>

</div>

<div class=col-sm-6>

<div class="form-group">

<center><button type="button" class="btn btn-danger btn-lg" id="Btn2">CANCLE</button></center>

</div>

</div>

</div>

<a href=#><b>Back to Home</b></a>


</div>

</div>

</div>

</div>

</div>

</div>
<footer> <p style="color:whitesmoke">&copy All Right Reversed.<a class="footerlinks" href="#"
target="_blank">National P.G College</a></p></footer>
</body>

</html>

11.Event Calendar(Event.html)

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title>Event Calendar</title>

<style>
nav {

position: fixed;

96
z-index: 10;

left: 0;

right: 0;

top: 0;

font-family: 'Montserrat', sans-serif;

padding: 0 5%;

height: 100px;

background-color:powderblue;

nav .logo {

float: left;

width: 40%;

height: 100%;

display: flex;

align-items: center;

font-size: 24px;

color: #fff;

nav .links {

float: right;

padding: 0;

margin: 0;

width: 60%;

height: 100%;

display: flex;

justify-content: space-around;

align-items: center;

nav .links li {

97
list-style: none;

nav .links a {

display: block;

padding: 1em;

font-size: 16px;

font-weight: bold;

color: #fff;

text-decoration: none;

transition:0.5s;

#nav-toggle {

position: absolute;

top: -100px;

nav .icon-burger {

display: none;

position: absolute;

right: 5%;

top: 50%;

transform: translateY(-50%);

nav .icon-burger .line {

width: 30px;

height: 5px;

background-color: #fff;

margin: 5px;

border-radius: 3px;

transition: all .3s ease-in-out;

98
}

@media screen and (max-width: 768px) {

nav .logo {

float: none;

width: auto;

justify-content: center;

nav .links {

float: none;

position: fixed;

z-index: 9;

left: 0;

right: 0;

top: 100px;

bottom: 100%;

width: auto;

height: auto;

flex-direction: column;

justify-content: space-evenly;

background-color: rgba(0,0,0,.8);

overflow: hidden;

box-sizing: border-box;

transition: all .5s ease-in-out;

nav .links a {

font-size: 20px;

nav :checked ~ .links {

bottom: 0;

99
}

nav .icon-burger {

display: block;

nav :checked ~ .icon-burger .line:nth-child(1) {

transform: translateY(10px) rotate(225deg);

nav :checked ~ .icon-burger .line:nth-child(3) {

transform: translateY(-10px) rotate(-225deg);

nav :checked ~ .icon-burger .line:nth-child(2) {

opacity: 0;

@media(max-width: 700px)

.text-box h1{

font-size:20px;

.nav-links ul li

display:block;

.nav-links

position:absolute;

background:#f44336;

height:100vh;

width:200px;

100
top:0;

right: -200px;

text-align:left;

z-index:2;

transition:1s;

nav .fa

display:block;

color:#fff;

margin:10px;

font-size:22px;

cursor:pointer;

.nav-links ul

padding:30px;

.event-container {

font-family: "Roboto", sans-serif;

max-width: 800px;

margin: 0 auto;

.event-container h3.year {

font-size: 40px;

text-align: center;

border-bottom: 1px solid #b1b1b1;

101
.event-container .event {

box-shadow: 0 4px 16px -8px rgba(0, 0, 0, 0.4);

display: flex;

border-radius: 8px;

margin: 32px 0;

.event .event-left {

background: #222;

min-width: 82px;

display: flex;

align-items: center;

justify-content: center;

color: #eee;

padding: 8px 48px;

font-weight: bold;

text-align: center;

border-radius: 8px 0 0 8px;

.event .event-left .date {

font-size: 56px;

.event .event-left .month {

font-size: 16px;

font-weight: normal;

.event .event-right {

display: flex;

flex-direction: column;

justify-content: center;

102
padding: 0 24px;

.event .event-right h3.event-title {

font-size: 24px;

margin: 24px 0 10px 0;

color: #218bbb;

text-transform: uppercase;

.event .event-right .event-timing {

background: #fff8ba;

display: flex;

align-items: center;

justify-content: center;

width: 100px;

padding: 8px;

border-radius: 16px;

margin: 24px 0;

font-size: 14px;

.event .event-right .event-timing img {

height: 20px;

padding-right: 8px;

@media (max-width: 550px) {

.event {

flex-direction: column;

.event .event-left {

padding: 0;

103
border-radius: 8px 8px 0 0;

.event .event-left .event-date .date,

.event .event-left .event-date .month {

display: inline-block;

font-size: 24px;

.event .event-left .event-date {

padding: 10px 0;

footer{

background-color:black;

text-align:center;

width:100%;

</style>

</head>

<body>

<section class="header">

<nav>

<input id="nav-toggle" type="checkbox">

<div class="logo"><img src="/static/logo.png" alt="Image not found" width="250px">

</div>

<ul class="links">

<li><a href="../home">Home</a></li>

<li><a href="../about">About Us</a></li>

<li><a href="../grid">Visit Us</a></li>

<li><a href="../homestart">Log Out</a></li>

104
</ul>

<label for="nav-toggle" class="icon-burger">

<div class="line"></div>

<div class="line"></div>

<div class="line"></div>

</label>

</nav>

<br><br><br><br>
<footer> <p style="color:whitesmoke">&copy All Right Reversed.<a class="footerlinks" href="#"
target="_blank">National P.G College</a></p></<footer>
</body>

</html>

12. Home page after login(home.html)

<!DOCTYPE html>

<html>

<head>

<meta name="viewport" content="width=device-width,initail-scale=1.0">

<title> Alumni Website</title>

<script src="https://kit.fontawesome.com/fec5e8fa5e.js" crossorigin="anonymous"></script>

<style>
*{

margin-left:10%;

margin-right:10%;

margin:0;

padding:0;

font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;

.header{

min-height:100vh;

105
width:100%;

animation:ani 5s;

animation-iteration-count:infinite;

background-position:center;

background-size:cover;

position:relative;

@keyframes

ani{

0%{background-image:linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url("/static/p4.jpg");}

25%{background-image:linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url("/static/p2.jpg");}

50%{background-image:linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url("/static/p3.jpg");}

100%{background-image:linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url("/static/p6.jpg");}

.text-box{

width:90%;

color:#fff;

position:absolute;

top:50%;

left:50%;

transform:translate(-50%,-50%);

text-align:center;

.text-box h1{

font-size:50px;

.text-box h2{

font-size:20px;

106
.text-box p{

margin:10px 0 40px;

font-size:14px;

color:white;

.hero-btn {

display:inline-block;

color:white;

text-decoration:none;

border:1px solid white;

padding:12px 34px;

font-size:13px;

background:transparent;

position:relative;

cursor:pointer;

.hero-btn:hover

border:1px solid #f44336;

background:#f44336;

nav {

position: fixed;

z-index: 10;

left: 0;

right: 0;

top: 0;

font-family: 'Montserrat', sans-serif;

padding: 0 5%;

107
height: 100px;

background-color:powderblue;

nav .logo {

float: left;

width: 40%;

height: 100%;

display: flex;

align-items: center;

font-size: 24px;

color: #fff;

nav .links {

float: right;

padding: 0;

margin: 0;

width: 60%;

height: 100%;

display: flex;

justify-content: space-around;

align-items: center;

nav .links li {

list-style: none;

nav .links a {

display: block;

padding: 1em;

font-size: 16px;

108
font-weight: bold;

color: #fff;

text-decoration: none;

transition:0.5s;

#nav-toggle {

position: absolute;

top: -100px;

nav .icon-burger {

display: none;

position: absolute;

right: 5%;

top: 50%;

transform: translateY(-50%);

nav .icon-burger .line {

width: 30px;

height: 5px;

background-color: #fff;

margin: 5px;

border-radius: 3px;

transition: all .3s ease-in-out;

@media screen and (max-width: 768px) {

nav .logo {

float: none;

width: auto;

justify-content: center;

109
}

nav .links {

float: none;

position: fixed;

z-index: 9;

left: 0;

right: 0;

top: 100px;

bottom: 100%;

width: auto;

height: auto;

flex-direction: column;

justify-content: space-evenly;

background-color: rgba(0,0,0,.8);

overflow: hidden;

box-sizing: border-box;

transition: all .5s ease-in-out;

nav .links a {

font-size: 20px;

nav :checked ~ .links {

bottom: 0;

nav .icon-burger {

display: block;

nav :checked ~ .icon-burger .line:nth-child(1) {

transform: translateY(10px) rotate(225deg);

110
}

nav :checked ~ .icon-burger .line:nth-child(3) {

transform: translateY(-10px) rotate(-225deg);

nav :checked ~ .icon-burger .line:nth-child(2) {

opacity: 0;

@media(max-width: 700px)

.text-box h1{

font-size:20px;

.nav-links ul li

display:block;

.nav-links

position:absolute;

background:#f44336;

height:100vh;

width:200px;

top:0;

right: -200px;

text-align:left;

z-index:2;

transition:1s;

111
nav .fa

display:block;

color:#fff;

margin:10px;

font-size:22px;

cursor:pointer;

.nav-links ul

padding:30px;

.steps{

width:80%;

margin:auto;

text-align:center;

padding-top:100px;

h1{

font-size:40px;

font-weight:600;

color:orange;

p{

color:#777;

font-size:14px;

font-weight:300;

line-height:22px;

112
padding:10px;

.row{

margin-top:5%;

display:flex;

justify-content: space-between;

.steps-col {

flex-basis:31%;

background:#fff3f3;

border-radius:10px;

margin-bottom:5%;

padding:20px 12px;

box-sizing:border-box;

transition:0.5s;

h3{

text-align:center;

font-weight:600;

margin:10px 0;

.steps-col:hover

box-shadow:0 0 20px 0px rgba(0,0,0,0.2);

@media(max-width:700px)

.row{

flex-direction:column;

113
}

footer{

background-color:black;

text-align:center;

width:100%;

</style>

</head>

<body>

<section class="header">

<nav>

<input id="nav-toggle" type="checkbox">

<div class="logo"><img src="/static/logo.png" alt="Image not found" width="250px">

</div>

<ul class="links">

<li><a href="../about">About Us</a></li>

<li><a href="../grid">Visit Us</a></li>

<li><a href="../event">Events</a></li>

<li><a href="../homestart">Log Out</a></li>

</ul>

<label for="nav-toggle" class="icon-burger">

<div class="line"></div>

<div class="line"></div>

<div class="line"></div>

</label>

</nav>

<div class="text-box">

<h1>Welcome to the National Post Graduate College

114
<br>Alumni Website</h1>

<h2>The Motto of the college is Maritum ethics i.e. merit with ethics.</h2>

<p>Be a part of a network comprosing of Alumni of National P.G College.

<br> Sign up now and be a part of An Autonomous,CPE

<br> And NAAC Grade 'A'</p>

<a href="" class="hero-btn">Visit Us To Know More</a>

</div>

</section>

<!----steps---->

<section class="steps">
<h1>Major Working</h1>
<p>Alumni and college is the utmost priorty</p>
<div class="row">

<div class="steps-col">

<img src="/static/o.jpg" width="100%" height="50%">

<h3> STEP 1</h3>

<p>Sign-Up now by going to the Alumni Sign-Up page.

Fill in your details</p>

</div>

<div class="steps-col">

<img src="/static/oo.png" width="100%" height="50%">

<h3> STEP 2</h3>

<p>Complete your profile details. Add your work,photo.

bio for easy verification from the college</p>

</div>

<div class="steps-col">

<img src="/static/ooo.jpg" width="100%" height="50%" >

<h3> STEP 3</h3>

<p>Monitor your college and participate in events<br>

conducted by your college.</p>


115
</div>

</section>

<!----javascript for toggle menu---->

<script>

var navLinks= document.getElementById("navLinks");


function showMenu(){

navLinks.style.right = "0";

function hideMenu(){

navLinks.style.right= "-200px";

</script>
<footer> <p style="color:whitesmoke">&copy All Right Reversed.<a class="footerlinks" href="#"
target="_blank">National P.G College</a></p></<footer>
</body

</html>

13. Feedback(feedback.html)

<!DOCTYPE html >

<html>

<head>

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>

<script src="https://kit.fontawesome.com/fec5e8fa5e.js" crossorigin="anonymous"></script>

<meta name="viewport" content="width=device-width,initial-scale=1">

<title>1Feedback </title>

<style>

.heading{

background-color:white;

116
color:white;

transition: 1s;

.card{

margin-top:35px;

background-color:rgb(184, 227, 195);

body{

background-color:rgb(124, 226, 230)

img.rounded-corners{

border-radius:50px;

footer{

background-color:black;

margin-top: 40px;

text-align:center;

width:100%;

nav {

position: fixed;

z-index: 10;

left: 0;

right: 0;

top: 0;

font-family: 'Montserrat', sans-serif;

padding: 0 5%;

height: 100px;

background-color:powderblue;

117
}

nav .logo {

float: left;

width: 40%;

height: 100%;

display: flex;

align-items: center;

font-size: 24px;

color: #fff;

nav .links {

float: right;

padding: 0;

margin: 0;

width: 60%;

height: 100%;

display: flex;

justify-content: space-around;

align-items: center;

nav .links li {

list-style: none;

nav .links a {

display: block;

padding: 1em;

font-size: 16px;

font-weight: bold;

color: #fff;

118
text-decoration: none;

transition:0.5s;

#nav-toggle {

position: absolute;

top: -100px;

nav .icon-burger {

display: none;

position: absolute;

right: 5%;

top: 50%;

transform: translateY(-50%);

nav .icon-burger .line {

width: 30px;

height: 5px;

background-color: #fff;

margin: 5px;

border-radius: 3px;

transition: all .3s ease-in-out;

@media screen and (max-width: 768px) {

nav .logo {

float: none;

width: auto;

justify-content: center;

nav .links {

119
float: none;

position: fixed;

z-index: 9;

left: 0;

right: 0;

top: 100px;

bottom: 100%;

width: auto;

height: auto;

flex-direction: column;

justify-content: space-evenly;

background-color: rgba(0,0,0,.8);

overflow: hidden;

box-sizing: border-box;

transition: all .5s ease-in-out;

nav .links a {

font-size: 20px;

nav :checked ~ .links {

bottom: 0;

nav .icon-burger {

display: block;

nav :checked ~ .icon-burger .line:nth-child(1) {

transform: translateY(10px) rotate(225deg);

nav :checked ~ .icon-burger .line:nth-child(3) {

120
transform: translateY(-10px) rotate(-225deg);

nav :checked ~ .icon-burger .line:nth-child(2) {

opacity: 0;

}
@media(max-width: 700px) {

.text-box h1{

font-size:20px;

.nav-links ul li{

display:block;

.nav-links{

position:absolute;

background:#f44336;

height:100vh;

width:200px;

top:0;

right:-200px;

text-align:left;

z-index:2;

transition:1s;

nav .fa{

display:block;

color:#fff;

margin:10px;

font-size:22px;

121
cursor:pointer;

.nav-links ul{

padding:30px;

</style>

</head>

<body>

<div class="heading"><img src="/static/CollegeLogo.png" alt="Image not found"></div>

<nav>

<a href="home.html"></a>

<input id="nav-toggle" type="checkbox">

<div class="logo"><img src="/static/logo.png" alt="Image not found" width="250px"></div>

</div>

<ul class="links">

<li><a href="../newadmin">Add Admin</a></li>

<li><a href="../meet">Update Events</a></li>

<li><a href="../course">Course</a></li>

<li><a href="../update">Portfolio Update</a></li>

<li><a href="../homestart">log Out</a></li>

</ul>

<label for="nav-toggle" class="icon-burger">

<div class="line"></div>

<div class="line"></div>

<div class="line"></div>

</label>

</nav>

<!----javascript for toggle menu---->

122
<script>

var navLinks= document.getElementById("navLinks");

function showMenu(){

navLinks.style.right = "0";

function hideMenu(){

navLinks.style.right= "-200px";

</script>

<div class="container">

<div class="row">

<div class="col-sm-8 mx-auto">

<div class="card">

<div class="card-body">

<div class="row">

<div class="col">

<center>

<img src="/static/contact.jpg" width="50"/>

</center>

</div>

</div>

<div class="row">

<div class="col">

<center>

<h4>Alumin Feedback</h4>

</center>

</div>

</div>

<div class="row">

123
<div class="col">

<center>

<hr>

</center>

</div>

</div>

<table border="2" bgcolor="pink" width="100%" bordercolor="red">


<tr align="center">

<th>Name</th>

<th>Email </th>

<th>Message</th>

</tr>

</table>
</div>

</div>

</div>

</div>

</div>

</div>
<footer> <p style="color:whitesmoke">&copy All Right Reversed.<a class="footerlinks" href="#"
target="_blank">National P.G College</a></p></footer>
</body>
</html>

14.View College(grid.html)
<!DOCTYPE html>

<html>

<head>

124
<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

<title>view college </title>

<!--

Highway Template

https://templatemo.com/tm-520-highway

-->

<meta name="description" content="">

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="apple-touch-icon" href="apple-touch-icon.png">

<link rel="stylesheet" href="/static/bootstrap.min.css">

<link rel="stylesheet" href="/static/bootstrap-theme.min.css">

<link rel="stylesheet" href="/static/fontAwesome.css">

<link rel="stylesheet" href="/static/light-box.css">

<link rel="stylesheet" href="/static/templatemo-style.css">


<link href="https://fonts.googleapis.com/css?family=Kanit:100,200,300,400,500,600,700,800,900"
rel="stylesheet">
<script src="/static/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>

</head>

<body>

<nav>

<div class="logo">

<a href="home.html">view<em>college</em></a>

</div>

<div class="menu-icon">

<span></span>

</div>

</nav>

<div id="video-container">

<div class="video-overlay"></div>

125
<div class="video-content">

<div class="inner">

<h1>VIEW COLLEGE</h1>

<U><p>National Post Graduate College</p></U>

<div class="scroll-icon">

<a class="scrollTo" data-scrollTo="portfolio" href="#"><img src="/static/scroll-icon.png" alt=""></a>

</div>

</div>

</div>

<video autoplay="" loop="" muted>

<source src="/static/PG.mp4" type="video/mp4"/>

</video>

</div>

<div class="grid-portfolio" id="portfolio">

<div class="container">

<div class="row">

<div class="col-md-4 col-sm-6">

<div class="portfolio-item">

<div class="thumb">

<a href="/static/1.jpg" data-lightbox="image-1"><div class="hover-effect">

<div class="hover-content">

<h1>COLLEGE INFO <em>ENTRANCE</em></h1>

<p> pg</p>

</div>

</div></a>

<div class="image">

<img src="/static/1.jpg">

</div>

</div>

126
</div>

</div>

<div class="col-md-4 col-sm-6">

<div class="portfolio-item">

<div class="thumb">

<a href="/static/2.jpg" data-lightbox="image-1"><div class="hover-effect">

<div class="hover-content">

<h1>SCIENCE BLOCK <em>Acadmic info</em></h1>

<p>Awesome Subtittle Goes Here</p>

</div>

</div></a>

<div class="image">

<img src="/static/2.jpg">

</div>

</div>

</div>

</div>

<div class="col-md-4 col-sm-6">

<div class="portfolio-item">

<div class="thumb">

<a href="/static/3.jpg" data-lightbox="image-1"><div class="hover-effect">

<div class="hover-content">

<h1>ACADMIC BLOCK <em>INFO</em></h1>

<p>Info related to managment will be seen here</p>

</div>

</div></a>

<div class="image">

<img src="/static/3.jpg">

</div>

127
</div>

</div>

</div>

<div class="col-md-4 col-sm-6">

<div class="portfolio-item">

<div class="thumb">

<a href="/static/4.jpg" data-lightbox="image-1"><div class="hover-effect">

<div class="hover-content">

<h1>LIBERARY<em>book issuing</em></h1>

<p>Have a specilised facility of book issuig</p>

</div>

</div></a>

<div class="image">

<img src="/static/4.jpg">

</div>

</div>

</div>

</div>

<div class="col-md-4 col-sm-6">

<div class="portfolio-item">

<div class="thumb">

<a href="/static/5.jpg" data-lightbox="image-1"><div class="hover-effect">

<div class="hover-content">

<h1>freegan <em>aesthetic</em></h1>

<p>Awesome Subtittle Goes Here</p>

</div>

</div></a>

<div class="image">

<img src="/static/5.jpg">

128
</div>

</div>

</div>

</div>

<div class="col-md-4 col-sm-6">

<div class="portfolio-item">

<div class="thumb">

<a href="/static/6.jpg" data-lightbox="image-1"><div class="hover-effect">

<div class="hover-content">

<h1>Conference Hall<em></em></h1>

<p>All the award and prize distrubution goes </p>

</div>

</div></a>

<div class="image">

<img src="/static/6.jpg">

</div>

</div>

</div>

</div>

<div class="col-md-4 col-sm-6">

<div class="portfolio-item">

<div class="thumb">

<a href="/static/7.jpg" data-lightbox="image-1"><div class="hover-effect">

<div class="hover-content">

<h1>Thundercats <em>santo</em></h1>

<p>Awesome Subtittle Goes Here</p>

</div>

</div></a>

<div class="image">

129
<img src="/static/7.jpg">

</div>

</div>

</div>

</div>

<div class="col-md-4 col-sm-6">

<div class="portfolio-item">

<div class="thumb">

<a href="/static/8.jpg" data-lightbox="image-1"><div class="hover-effect">

<div class="hover-content">

<h1>wayfarers <em>yuccie</em></h1>

<p>Awesome Subtittle Goes Here</p>

</div>

</div></a>

<div class="image">

<img src="/static/8.jpg">

</div>

</div>

</div>

</div>

<div class="col-md-4 col-sm-6">

<div class="portfolio-item">

<div class="thumb">

<a href="/static/9.jpg" data-lightbox="image-1"><div class="hover-effect">

<div class="hover-content">

<h1>disrupt <em>street</em></h1>

<p>Awesome Subtittle Goes Here</p>

</div>

</div></a>

130
<div class="image">

<img src="/static/9.jpg">

</div>

</div>

</div>

</div>

</div>

<div class="col-md-4 col-sm-6">

<div class="portfolio-item">

<div class="thumb">

<a href="/static/10.jpg" data-lightbox="image-1"><div class="hover-effect">

<div class="hover-content">

<h1>disrupt <em>street</em></h1>

<p>Awesome Subtittle Goes Here</p>

</div>

</div></a>

<div class="image">

<img src="/static/10.jpg">

</div>

</div>

</div>

</div>

</div>

<div class="row">

<div class="col-md-12">

<div class="load-more-button">

<a href="#">Load More</a>

</div>

</div>

131
</div>

</div>

</div>

<div style="color:white;background:red;"></div>

<footer>

<div class="container-fluid">

<div class="col-md-12">

<p>national pg</p>

</div>

</div>

</footer>

<!-- Modal button -->

<div class="popup-icon">

<button id="modBtn" class="modal-btn"><img src="/static/contact-icon.png" alt=""></button>

</div>

<!-- Modal -->

<div id="modal" class="modal">

<!-- Modal Content -->

<div class="modal-content">

<!-- Modal Header -->

<div class="modal-header">

<h3 class="header-title">wellcome in <em>National PG college</em></h3>

<div class="close-btn"><img src="/static/close_contact.png" alt=""></div>

</div>

<!-- Modal Body -->

<div class="modal-body">

<div class="col-md-6 col-md-offset-3">

<form id="contact" action="/gridaction/" method="post">


<input type="hidden" name="csrfmiddlewaretoken"
value="mxfSWY6M6BYZ3j3AOEAxZF9dDzU01P8kJvRG1EewP2E0drMPzDTJZmhxhUevED3l">

132
<div class="row">

<div class="col-md-12">

<fieldset>
<input name="name" type="text" class="form-control" id="name" placeholder="Your name..."
required="">
</fieldset>

</div>

<div class="col-md-12">

<fieldset>
<input name="email" type="email" class="form-control" id="email" placeholder="Your email..."
required="">
</fieldset>

</div>

<div class="col-md-12">

<fieldset>
<textarea name="message" rows="6" class="form-control" id="message" placeholder="Your message..."
required=""></textarea>
</fieldset>

</div>

<div class="col-md-12">

<fieldset>

<button type="submit" id="form-submit" class="btn">Send Message Now</button>

</fieldset>

</div>

</div>

</form>

</div>

</div>

</div>

</div>

<section class="overlay-menu">

<div class="container">

133
<div class="row">

<div class="main-menu">

<center>

<ul>

<li>

<a href="../home">Home</a>

</li>

<li>

<a href="../event">Events</a>

</li>

<li>

<a href="">About Us</a>

</li>

<li>

<a href="grid.html">view college</a>

</li>

<li>

<a href="../homestart">Log Out</a>

</li>

</ul>

</center>

</div>

</div>

</div>

</section>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

<script>window.jQuery || document.write('<script src="/static/jquery-1.11.2.min.js"><\/script>')</script>

<script src="/static/bootstrap.min.js"></script>

<script src="/static/plugins.js"></script>

134
<script src="/static/main.js"></script>

</body>

</html>

15.About the College(about.html)


<!DOCTYPE html>

<html lang="en" >

<head>

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>

<meta charset="UTF-8">

<title>NPG About us</title>

<style>
/* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be
inlined if they are on local disk! */
@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,700);

@import url(http://weloveiconfonts.com/api/?family=entypo);

/* entypo */

[class*="entypo-"]:before {

font-family: 'entypo', sans-serif;

*{

border: 0;

padding: 0;

margin: 0;

html, body {

height: 100%;

}
135
body {

font-family: 'avenir medium', sans-serif;

font-size: 1.1em;

color: #333333;

h1 {

text-align: center;

font-weight: 300;

font-size: 2em;

border-bottom: 2px solid #ef2c34;

margin-bottom: 1em;

a{

text-decoration: none;

color: #ef2c34;

border-bottom: 1px solid #333333;

transition: all .4s ease;

a:hover {

color: #333333;

border-bottom: 1px solid #ef2c34;

nav {

position: fixed;

z-index: 10;

left: 0;

right: 0;

top: 0;

font-family: 'Montserrat', sans-serif;

136
padding: 0 5%;

height: 100px;

background-color:powderblue;

nav .logo {

float: left;

width: 40%;

height: 100%;

display: flex;

align-items: center;

font-size: 24px;

color: #fff;

nav .links {

float: right;

padding: 0;

margin: 0;

width: 60%;

height: 100%;

display: flex;

justify-content: space-around;

align-items: center;

nav .links li {

list-style: none;

nav .links a {

display: block;

padding: 1em;

137
font-size: 16px;

font-weight: bold;

color: #fff;

text-decoration: none;

transition:0.5s;

#nav-toggle {

position: absolute;

top: -100px;

nav .icon-burger {

display: none;

position: absolute;

right: 5%;

top: 50%;

transform: translateY(-50%);

nav .icon-burger .line {

width: 30px;

height: 5px;

background-color: #fff;

margin: 5px;

border-radius: 3px;

transition: all .3s ease-in-out;

@media screen and (max-width: 768px) {

nav .logo {

float: none;

width: auto;

138
justify-content: center;

nav .links {

float: none;

position: fixed;

z-index: 9;

left: 0;

right: 0;

top: 100px;

bottom: 100%;

width: auto;

height: auto;

flex-direction: column;

justify-content: space-evenly;

background-color: rgba(0,0,0,.8);

overflow: hidden;

box-sizing: border-box;

transition: all .5s ease-in-out;

nav .links a {

font-size: 20px;

nav :checked ~ .links {

bottom: 0;

nav .icon-burger {

display: block;

nav :checked ~ .icon-burger .line:nth-child(1) {

139
transform: translateY(10px) rotate(225deg);

nav :checked ~ .icon-burger .line:nth-child(3) {

transform: translateY(-10px) rotate(-225deg);

nav :checked ~ .icon-burger .line:nth-child(2) {

opacity: 0;

.wrapper {

position: relative;

box-shadow: 0 0 1em #333333;

.wrapper section {

position: relative;

background: white;

.wrapper section article {

width: 50%;

margin: 0 auto;

padding: 2em 0;

.wrapper section article p {

margin-bottom: 1em;

.wrapper section article p:last-of-type {

margin-bottom: 0;

.wrapper section:after {

140
content: "";

display: block;

position: relative;

background-attachment: fixed;

background-size: cover;

background-position: center center;

background-repeat: no-repeat;

height: 30em;

width: 100%;

.wrapper section:nth-child(1):after {

background-image: url("/static/2.jpg");

.wrapper section:nth-child(2):after {

background-image: url("/static/19.jpg");

@media only screen and (max-width: 600px) {

.wrapper section article {

width: 80%;

.wrapper section:after {

height: 15em;

.firstBar{

display:flex;

flex-direction: row;

.linkBar{

141
display:flex;

flex-direction: row;

.link{

width:50px;

height: 50px;

.link1{

width:50px;

height: 50px;

</style>

<script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>

</head>

<body>

<nav>

<input id="nav-toggle" type="checkbox">

<div class="logo"><img src="/static/logo.png" alt="Image not found" width="250px">

</div>

<ul class="links">

<li><a href="../home">Home</a></li>

<li><a href="../grid">Vist us</a></li>

<li><a href="../event">Event</a></li>

<li><a href="../homestart">Log Out</a></li>

</ul>

<label for="nav-toggle" class="icon-burger">

<div class="line"></div>

<div class="line"></div>

<div class="line"></div>

142
</label>

</nav>

<button class="toggle-nav entypo-menu"></button>

<div class="wrapper">

<section id="maincode">

<article>

<h1><img src="/static/L1.jfif" alt="Brown Daily Herald" width = "300px"></h1>

</article>

</section>

<section id="whatis">

<article>

<h1>More about The College</h1>


<p> National Post Graduate College was established in the year 1974 by the then Chief-minister of Uttar
Pradesh, Late Chandra Bhanu Gupta. The college is situated close to the banks of river Gomti in the heart of
the city has lush green campus and is surrounded by a number of major institutions - Academic and
Administrative.
In a city of 16 Universities and more than 150 degree colleges, National P.G. College is the only college
which enjoys the highest status of CPE (College with Potential for Excellence) and Autonomous Status. The
College offers under-graduate and post-graduate courses in Arts and Commerce faculties and under-
graduate courses in Science and Computer faculties. The college also offers under graduate and post
graduate programs for skill development under Deen Dayal Upadhyay Kaushal Kendra established with the
special grant from University Grants Commission (UGC). There are six programs being offered under the
scheme - two one-year programs under Community College and two degree and two post graduate programs
under Deen Dayal Upadhyay Kaushal Kendra are being offered. DDUKK has components of ICT, ITES and
Banking, Insurance and Financial services.
Well-equipped labs, computerised rich library, e-library, data analysis centre and air-conditioned reading
room are some of the basic state of the art educational facilities.
Study centre for IGNOU and Uttar Pradesh Rajarshi Tandon Open University, Allahabad are offering a
number of certificate, diploma and degree programs in distant mode. Regular consultation classes and
remedial sessions are held for the students of the programs under IGNOU and UPRTOU.
NSS and NCC programs are part of outreach activities of the college inculcating the patriotism and the
feeling of social service in the students.
College offers rigorous training for a number of indoor and outdoor sports such as Chess, Table Tennis,
Lawn Tennis, Bad Minton, athletics and cricket. District level inter degree collegiate cricket tournaments -
Chandra Bhanu Gupta Inter Degree Collegiate Cricket Tournaments, Amit Singh Trophy. The tournament is
now in its 20's </p>
</article>

<a href="../home"><b>Back to Home</b></a>

</section>

</div>

143
<script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>

<script src="/static/js/index.js"></script>

</body>
</html>
Backend Coding
Models.py
from django.db import models
class Meet(models.Model):
title=models.CharField(max_length=50)
loc=models.CharField(max_length=50)
date=models.CharField(max_length=50)
time=models.CharField(max_length=10)
sta=models.CharField(max_length=10)
des=models.TextField(default='')
class Meta:
db_table="meet"
class Admin(models.Model):
name=models.CharField(max_length=50)
dob=models.CharField(max_length=10)
email=models.CharField(primary_key=True,max_length=50)
contact=models.CharField(max_length=10)
password=models.CharField(max_length=20)
class Meta:
db_table="admin"
class Feedback(models.Model):
name=models.CharField(max_length=20)
email=models.CharField(primary_key=True,max_length=50)
message=models.TextField(default='')
class Meta:

db_table="feedback"
class Alumnus(models.Model):
userid = models.CharField(max_length=70)
contact = models.CharField(max_length=15)
email = models.CharField(max_length=50)
dob = models.CharField(max_length=10)
doj = models.CharField(max_length=10)
state = models.CharField(max_length=50)
city = models.CharField(max_length=50)
course = models.CharField(max_length=50)
address = models.TextField(default='')
rollno = models.IntegerField(primary_key=True)
144
class Meta:
db_table = "alumnus"
class User(models.Model):
rollno = models.IntegerField(primary_key=True)
userid = models.CharField(max_length=20)
passwd = models.CharField(max_length=100)
name = models.CharField(max_length=100)
class Meta:
db_table = "user"
class Userimage(models.Model):
rollno = models.CharField(max_length=20)
image = models.CharField(max_length=200)
class Meta:
db_table = "userimage"
Views.py
from django.shortcuts import render
from django.template import loader
from myapp.models import *
from django.conf import settings
# Create your views here.
from django.http import HttpResponse
def hello(request):
return HttpResponse("<h2>Hello,Welcome to Django!</h2>")
def home(request):
return render(request,"home.html")
def reg(request):
return render(request,"reg.html")
def login(request):
return render(request,"login.html")
def event(request):
return render(request,"event.html")
def grid(request):
return render(request,"grid.html")
def adminweb(request):
request.session['valid']=True
return render(request,"adminweb.html")
def course(request):
return render(request,"course.html")
def feedback(request):
return render(request,"feedback.html")
def newadmin(request):
return render(request,"newadmin.html")
def meet(request):
145
return render(request,"meet.html")
def update(request):
return render(request,"update.html")
def homestart(request):
return render(request,"homestart.html")
def about(request):
return render(request,"about.html")
def forget(request):
return render(request,"forget.html")
def adminforget(request):
return render(request,"adminforget.html")
def regaction(request):
status='successful'
if request.method == 'POST':
rollno=request.POST.get('rollno')
name=request.POST.get('name')
contact=request.POST.get('contact')
email=request.POST.get('email')
address=request.POST.get('address')
doj=request.POST.get('doj')
dob=request.POST.get('dob')
city=request.POST.get('city')
state=request.POST.get('state')
course=request.POST.get('course')
userid=request.POST.get('userid')
passwd=request.POST.get('passwd')
image_file=request.FILES['ppic']
check=Alumnus.objects.filter(rollno=rollno)
try:
check=check[0].rollno
except:
pass
if str(check)==rollno:
status='already exists'
Userimage.objects.create(rollno=rollno,image=rollno+image_file.name)
a=Alumnus(rollno=rollno,contact=contact,dob=dob,doj=doj,email=email,address=address,course=course,u
serid=userid,city=city,state=state)
u=User(passwd=passwd,rollno=rollno,name=name,userid=userid)
a.save()
u.save()
from django.contrib.staticfiles.storage import staticfiles_storage
from django.templatetags.static import static
import os,myapp
# img=Userimage.objects.filter(id='1')
146
path=os.path.dirname(myapp.__file__)
# ff=open(path+'\\static\\pic\\'+image_file.name,'wb+')
# ff.write(img[0].image)
# ff.close()
with open(path+'\\static\\pic\\'+rollno+image_file.name,'wb+') as destination:
for chunk in image_file.chunks():
destination.write(chunk)
return render(request,"reg.html",{'msg':'registration '+status})
def loginaction(request):
if request.method == 'POST':
userid=request.POST.get('userid')
passwd=request.POST.get('pass')
almns=User.objects.filter(userid=userid,passwd=passwd)
if len(almns)>0:
return render(request,"home.html")
else:
return render(request,"login.html",{'msg':'wrong user id & passwd'})
return render(request,"login.html")
def newadminaction(request):
msg=''
if request.method=='POST':
name=request.POST.get('name')
email=request.POST.get('email')
dob=request.POST.get('dob')
contact=request.POST.get('contact')
passwd=request.POST.get('passwd')
cpasswd=request.POST.get('cpasswd')
admin=Admin(name=name,email=email,dob=dob,contact=contact,password=passwd)
if passwd!=cpasswd:
msg='The password and confirmed password are not same'
else:
admin.save()
msg='Record inserted successfully'
return render(request,"newadmin.html",{'msg':msg})
def gridaction(request):
msg=""
if request.method=='POST':
name=request.POST.get('name')
email=request.POST.get('email')
message=request.POST.get('message')
fd=Feedback.objects.filter(email=email)
if len(fd)>0:
msg='error'
else:
147
feed=Feedback(name=name,email=email,message=message)
feed.save()
msg='Responce submitted successfully'
return render(request,"grid.html",{'msg':msg})
def adminwebaction(request):
msg=""
if not request.session.has_key('valid'):
return render(request,"adminweb.html")
if request.method=='POST':
email=request.POST.get('email')
passwd=request.POST.get('passwd')
admin=Admin.objects.filter(email=email,password=passwd)
if len(admin)>0:
result=Feedback.objects.all()
return render(request,"feedback.html",{'result':result})
else:
return render(request,"adminweb.html")
return render(request,"adminweb.html")
def adminforgetaction(request):
if request.method=='POST':
email=request.POST.get('email')
contact=request.POST.get('num')
dob=request.POST.get('dob')
password=request.POST.get('pass')
cpassword=request.POST.get('cpass')
ad=Admin.objects.filter(email=email,contact=contact,dob=dob)
if len(ad)>0:
if (password==cpassword):
a=Admin.objects.filter(email=email).update(password=password)
else:
return render(request,"adminforget.html",{'msg':'Password and confirmed password do
not match'})
else:
return render(request,"adminforget.html")
return render(request,"adminforget.html",{'msg':'Password Updated successfully'})
def forgetaction(request):
if request.method=='POST':
userid=request.POST.get('userid')
rollno=request.POST.get('roll')
passwd=request.POST.get('passwd')
cpasswd=request.POST.get('cpasswd')
us=User.objects.filter(userid=userid,rollno=rollno)
if len(us)>0:
if(passwd==cpasswd):
148
a=User.objects.filter(userid=userid,rollno=rollno).update(passwd=passwd)
else:
return render(request,"forget.html",{'msg':'Password and confirmed password do not
match'})
else:
return render(request,"forget.html")
return render(request,"forget.html",{'msg':'Password Updated successfully'})
def meetaction(request):
if request.method=='POST':
title=request.POST.get('title')
loc=request.POST.get('loc')
date=request.POST.get('date')
time=request.POST.get('time')
sta=request.POST.get('sta')
des=request.POST.get('des')
a=Meet(title=title,loc=loc,date=date,time=time,sta=sta,des=des)
a.save()
return render(request,"meet.html",{'msg':'event updated'})
return render(request,"meet.html",{'msg':'error'})
def event(request):
result=Meet.objects.all()
return render(request,"event.html",{'result':result})

Manage.py
import os
import sys
def main():
"""Run administrative tasks."""
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'sample.settings')
try:
from django.core.management import execute_from_command_line
except ImportError as exc:
raise ImportError(
"Couldn't import Django. Are you sure it's installed and "
"available on your PYTHONPATH environment variable? Did you "
"forget to activate a virtual environment?"
) from exc
execute_from_command_line(sys.argv)
if __name__ == '__main__':
main()
URLs.py
from django.contrib import admin
149
from django.urls import path
from myapp import views
from django.conf.urls.static import static
from django.conf import settings
urlpatterns = [
path('admin/', admin.site.urls),
path('home/',views.home),
path('reg/',views.reg),
path('login/',views.login),
path('event/',views.event),
path('grid/',views.grid),
path('adminweb/',views.adminweb),
path('course/',views.course),
path('feedback/',views.feedback),
path('newadmin/',views.newadmin),
path('meet/',views.meet),
path('update/',views.update),
path('newadminaction/',views.newadminaction),
path('regaction/',views.regaction),
path('gridaction/',views.gridaction),
path('loginaction/',views.loginaction),
path('adminwebaction/',views.adminwebaction),
path('homestart/',views.homestart),
path('about/',views.about),
path('forget/',views.forget),
path('adminforget/',views.adminforget),
path('adminforgetaction/',views.adminforgetaction),
path('forgetaction/',views.forgetaction),
path('meetaction/',views.meetaction),
]+ static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

Settings.py
"""
Django settings for sample project.
Generated by 'django-admin startproject' using Django 3.2.3.
For more information on this file, see
https://docs.djangoproject.com/en/3.2/topics/settings/
For the full list of settings and their values, see
https://docs.djangoproject.com/en/3.2/ref/settings/
"""
from pathlib import Path
# Build paths inside the project like this: BASE_DIR / 'subdir'.
BASE_DIR = Path(__file__).resolve().parent.parent
# Quick-start development settings - unsuitable for production
150
# See https://docs.djangoproject.com/en/3.2/howto/deployment/checklist/
# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = 'django-insecure-@&z942vi26pvgsd7qh0iq&94tm=34%$1f^g!1h#=_7ddx5w($4'
# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True
ALLOWED_HOSTS = []
# Application definition
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'myapp'
]
MIDDLEWARE = [
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
]
ROOT_URLCONF = 'sample.urls'
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
WSGI_APPLICATION = 'sample.wsgi.application'
# Database
# https://docs.djangoproject.com/en/3.2/ref/settings/#databases
151
##DATABASES = {
## 'default': {
## 'ENGINE': 'django.db.backends.sqlite3',
## 'NAME': BASE_DIR / 'db.sqlite3',
## }
##}
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.mysql',
'NAME':'sample',
'USER':'root',
'PASSWORD':'root',
'HOST':'localhost',
'PORT':'3306',
'OPTIONS': {
'autocommit': True,
},
}
}
# Password validation
# https://docs.djangoproject.com/en/3.2/ref/settings/#auth-password-validators
AUTH_PASSWORD_VALIDATORS = [
{
'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
},
{
'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
},
{
'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
},
{
'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
},
]
# Internationalization
# https://docs.djangoproject.com/en/3.2/topics/i18n/
LANGUAGE_CODE = 'en-us'
TIME_ZONE = 'UTC'
USE_I18N = True
USE_L10N = True
USE_TZ = True
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/3.2/howto/static-files/
152
STATIC_ROOT = '/static/'
STATIC_URL = '/static/'
# Default primary key field type
# https://docs.djangoproject.com/en/3.2/ref/settings/#default-auto-field
DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField'

Asgi.py
"""
ASGI config for sample project.
It exposes the ASGI callable as a module-level variable named ``application``.
For more information on this file, see
https://docs.djangoproject.com/en/3.2/howto/deployment/asgi/
"""
import os
from django.core.asgi import get_asgi_application
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'sample.settings')
application = get_asgi_application()

8. TESTING
Testing is the process of detecting errors. Testing performs a very critical role for quality assurance and
for ensuring the reliability of software. The results of testing are used later on during maintenance also.

Psychology of Testing

The aim of testing is often to demonstrate that a program works by showing that it has no errors. The
basic purpose of testing phase is to detect the errors that may be present in the program. Hence one
should not start testing with the intent of showing that a program works, but the intent should be to show
that a program doesn’t work. Testing is the process of executing a program with the intent of finding
errors.

Testing Objectives
153
The main objective of testing is to uncover a host of errors, systematically and with minimum effort and
time. Stating formally, we can say,

 Testing is a process of executing a program with the intent of finding an error.

 A successful test is one that uncovers an as yet undiscovered error.

 A good test case is one that has a high probability of finding error, if it exists.

 The tests are inadequate to detect possibly present errors.

 The software more or less confirms to the quality and reliable standards.

Types Of Testing

 Unit Testing

 Link Testing

Unit Testing

Unit testing focuses verification effort on the smallest unit of software i.e. the module. Using the
detailed design and the process specifications testing is done to uncover errors within the boundary of the
module. All modules must be successful in the unit test before the start of the integration testing begins.

In this project each service can be thought of a module. There are so many modules like Home,
Registration, Login, Event, Visit Us, About Us.

Giving different sets of inputs has tested each module. When developing the module as well as
finishing the development so that each module works without any error. The inputs are validated when
accepting from the user.

In this application we test the programs up as system. Software units in a system are the modules and
routines that are assembled and integrated to form a specific function. Unit testing is first done on
modules, independent of one another to locate errors. This enables to detect errors. Through this errors
resulting from interaction between modules initially avoided.

Link Testing

Link testing does not test software but rather the integration of each module in system. The primary
concern is the compatibility of each module. The Programmer tests where modules are designed with
different parameters, length, type etc.

Integration Testing

After the unit testing we have to perform integration testing. The goal here is to see if modules can be
integrated properly, the emphasis being on testing interfaces between modules. This testing activity can be
considered as testing the design and hence the emphasis on testing module interactions.

154
In this project integrating all the modules forms the main system. When integrating all the modules I
have checked whether the integration effects working of any of the services by giving different
combinations of inputs with which the two services run perfectly before Integration.

System Testing

Here the entire software system is tested. The reference document for this process is the
requirements document, and the goal is to see if software meets its requirements.

Here entire ‘System’ has been tested against requirements of project and it is checked whether all
requirements of project have been satisfied or not.

Acceptance Testing

Acceptance Test is performed with realistic data of the client to demonstrate that the software is
working satisfactorily. Testing here is focused on external behavior of the system; the internal logic of
program is not emphasized.

In this project ‘Alumni Website’, I have collected some data and tested whether project is working
correctly or not. Test cases should be selected so that the largest number of attributes of an equivalence
class is exercised at once. The testing phase is an important part of software development. It is the process
of finding errors and missing operations and also a complete verification to determine whether the
objectives are met and the user requirements are satisfied.

White Box Testing

This is a unit testing method where a unit will be taken at a time and tested thoroughly at a statement
level to find the maximum possible errors. I tested step wise every piece of code, taking care that every
statement in the code is executed at least once. The white box testing is also called Glass Box Testing.

I have generated a list of test cases, sample data, which is used to check all possible combinations of
execution paths through the code at every module level.

Black Box Testing

This testing method considers a module as a single unit and checks the unit at interface and
communication with other modules rather getting into details at statement level. Here the module will be
treated as a block box that will take some input and generate output. Output for a given set of input
combinations are forwarded to other modules.

Criteria Satisfied by Test Cases

1. Test cases that reduced by a count that is greater than one, the number of additional test cases that
much be designed to achieve reasonable testing.

2. Test cases that tell us something about the presence or absence of classes of errors, rather than an
error associated only with the specific test at hand.

155
9. IMPLEMENTATION
After carefully planning the project, we are ready to start the project implementation phase, the third
phase of the project management life cycle. The implementation phase involves putting the project plan
into action. Now we have to direct and manage each activity, every step of the way. That’s what happens
in the implementation phase of the project life cycle: we follow the plan we’ve put together and handle
any problems that come up.

The implementation phase is where the project team actually does the project work to produce the
deliverables. The word “deliverable” means anything your project delivers. The deliverables for your
project include all of the products or services that you and your team are performing for the client,
customer, or sponsor, including all the project management documents that you put together.

156
Prepare the infrastructure. ... Many solutions are implemented into a production environment that is
separate and distinct from where the solution was developed and tested. It is important that the
characteristics of the production environment be accounted for. This strategy includes a review of
hardware, software, communications, etc.

Coordinate with the organizations involved in implementation. ... This may be as simple as
communicating to your client community. Part of the implementation work is to coordinate the work of
any other groups that have a role to play.

Implement training. ... Many solutions require users to attend training or more informal coaching sessions.
This type of training could be completed in advance, but the further out the training is held, the less
information will be retained when implementation rolls around. Training that takes place close to the time
of implementation should be made part of the actual implementation plan.

Install the production solution. ... Solution needs to be moved from development to test. If the solution is
brand new, this might be finished in a leisurely and thoughtful manner over a period of time. If this project
involves a major change to a current solution, you may have a lot less flexibility in terms of when the new
solution moves to production, since the solution might need to be brought down for a period of time. You
have to make sure all of your production components are implemented successfully, including new
hardware, databases, and program code.

Convert the data. ... Data conversion, changing data from one format to another, needs to take place once
the infrastructure and the solution are implemented.

Perform final verification in production. ...  You should have prepared to test the production solution to
ensure everything is working as you expect. This may involve a combination of development and client
personnel. The first check is just to make sure everything is up and appears okay. The second check is to
actually push data around in the solution, to make sure that the solution is operating as it should.
Depending on the type of solution being implemented, this verification step could be extensive.

Implement new processes and procedures. ... Many IT solutions require changes to be made to business
processes as well. These changes should be implemented at the same time that the actual solution is
deployed.

Monitor the solution. … Usually the project team will spend some period of time monitoring the
implemented solution. If there are problems that come up immediately after implementation, the project
team should address and fix them.

157
10. SIGNIFICANCE
Creating an engaged, supportive alumni network is crucial to an institution’s success. If
communication stops once graduates leave the institution, their understanding of the
college becomes stale. Instead they should be kept informed so they can remain engaged
and keep the progress of the university.

As graduates of the institution, alumni have a special connection with the university and as
a result are likely to be some of its more loyal supporters.

“An engaged alumni network allows the college to benefit from the skills and experience of
our graduates, by offering their support to the students, to the institution and to each
other. If we keep them properly informed and engaged, alumni are our most loyal
158
supporters and our best ambassadors, offering invaluable marketing and promotion across
their personal and professional networks.”

Creating an engaged alumni network is beneficial for us because engaged graduates are
much likely to want to “give back” to the college; that could be, for example, by coming
back and sharing their experiences with prospective and current students.

11. Limitations

 All work is handled by the admin only. So, the admin has to be active all round to make changes in the
website.
 The alumni registered on the portal cannot connect with each other.
 The password of the account holder does not include 2nd step verification. Thus, the password is not
protected.
 The database has to be connected with the site at all times so that alumni can register him on the
website.

159
12. REFERENCES
Websites:

 www.python.org
 www.quora.com
 www.w3schools.com
 www.stackoverflow.com
 www.javatpoint.com

160
Acknowledgement
It gives me immense pleasure in submitting the project report on “Alumni Website” for the
partial fulfillment of the requirements for the degree of B.Voc(SD& eG) at Deen Dayal
Upadhyay Kaushal Kendra.

I wish to place on my record my deep sense of gratitude and dedicate the whole project to
my project guide, ma’am Dr. Amitabha Yadav for her constant motivation and valuable help

161
through the project work. I also want to extend my thanks to other faculties for their
cooperation during my course.

I have completed the project at the UPTEC Computer Consultancy Limited. I would like to
thank our instructor Sir Anshumaan and our project coordinator Leenu Jain ma’am for their
help and support throughout the completion of the project.

Finally I would like to thank my friends and my team for their cooperation to complete this
project, who not only encouraged me but also helped me in the process of making this
project.

Thanking All
Vaibhav Srivastava
718621

Acknowledgement

162
It gives me immense pleasure in submitting the project report on “Alumni Website” for the
partial fulfillment of the requirements for the degree of B.Voc(SD& eG) at Deen Dayal
Upadhyay Kaushal Kendra.

I wish to place on my record my deep sense of gratitude and dedicate the whole project to
my project guide, ma’am Dr. Amitabha Yadav for her constant motivation and valuable help
through the project work. I also want to extend my thanks to other faculties for their
cooperation during my course.

I have completed the project at the UPTEC Computer Consultancy Limited. I would like to
thank our instructor Sir Anshumaan and our project coordinator Leenu Jain ma’am for their
help and support throughout the completion of the project.

Finally I would like to thank my friends and my team for their cooperation to complete this
project, who not only encouraged me but also helped me in the process of making this
project.

Thanking All
Dhurval Raj Tripati
718645

Acknowledgement
It gives me immense pleasure in submitting the project report on “Alumni Website” for the
partial fulfillment of the requirements for the degree of B.Voc(SD& eG) at Deen Dayal
Upadhyay Kaushal Kendra.

163
I wish to place on my record my deep sense of gratitude and dedicate the whole project to
my project guide, ma’am Dr. Amitabha Yadav for her constant motivation and valuable help
through the project work. I also want to extend my thanks to other faculties for their
cooperation during my course.

I have completed the project at the UPTEC Computer Consultancy Limited. I would like to
thank our instructor Sir Anshumaan and our project coordinator Leenu Jain ma’am for their
help and support throughout the completion of the project.

Finally I would like to thank my friends and my team for their cooperation to complete this
project, who not only encouraged me but also helped me in the process of making this
project.

Thanking All
Samriddhi Shanker
718648

164

You might also like