E-LEARNING PLATFORM

An Internship project submitted in partial fulfillment of the requirement

for the award of the degree of

BACHELOR OF TECHNOLOGY
IN
COMPUTER SCIENCE & ENGINEERING
Submitted By

GADDE KUMAR SAI

Y21CSE279022
Under the Esteemed Guidance of

Dr. M. RAGHAVA NAIDU

Asst. Professor

DEPARTMENT OF COMPUTER SCIENCE & ENGINEERING

KRISHNA UNIVERSITY COLLEGE OF ENGINEERING AND TECHNOLOGY

(Approved by AICTE, New Delhi)
MACHILIPATNAM-521004
2023-2024
 KRISHNA UNIVERSITY
COLLEGE OF ENGINEERING AND TECHNOLOGY
(Approved by AICTE, New Delhi)

MACHILIPATNAM
DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING

CERTIFICATE
This is to certify that the project entitled “E-LEARNING PLATFORM"
is a Bonafide Work done by GADDE KUMAR SAI with the Regd. No. Y21CSE279022 is
submitted in partial fulfilment of the requirement for the award of the Degree "BACHELOR OF
TECHNOLOGY IN COMPUTER SCIENCE AND ENGINEERING” during the
academic year 2023-2024.

Internship Mentor Head of the Department

 ACKNOWLEDGEMENT
I am deeply grateful to my project platform IIDT BLACKBUKS for their
invaluable guidance and support throughout this project. Their insights and expertise have
been instrumental in shaping the development process. I would also like to thank my peers
for their constructive feedback and collaboration. Special thanks to my family for their
encouragement and understanding during this time.

The satisfaction that accompanies the successful completion of any task would be
incomplete without the mention of the people who made it possible and whose constant
guidance and encouragement crown all the efforts with success. This acknowledgement
transcends the reality of formality when we would like to express deep gratitude and respect
to all those people behind the screen who guided, inspired and helped me for thecompletion of
my project work.

I extremely grateful to my esteemed teacher and guide Dr. M. RAGHAVA

NAIDU, Assistant professor , Department of Computer Science & Enginnering, Krishna
University College of Engineering and Technology, for giving me an opportunity to work
on a project with his timely suggestions and guidance.

I extremely grateful to Mr. P. Bhavani Shankar, Assistant professor ,Academic

Coordinator, Department of Computer Science & Enginnering , Krishna University
College of Engineering and Technology, for giving me an opportunity to work on a project
withhis timely suggestions and guidance.

I express our profound thanks to Dr. R. Vijaya Kumari, Principal(i/c), Head of

the Department CSE, Krishna University College of Engineering and Technology, for
providing me with the opportunity and facilities to pursue my project work.

I express my profound thanks to Prof. R. Srinivasa Rao, Vice Chancellor, and Prof. K.
Sobhan Babu, and Prof. M. V. Basaveswara Rao, Krishna University and Prof. Y. K.
Sundara Krishna Dean, Faculty of Engineering and Technology, For their valuable
motivation and support in Completing my Summer Internship.
I express our heartful thanks to our Faculty and Non-Teaching Staff

Sincerely,
GADDE KUMAR SAI
Y21CSE279022
 DECLARATION
This is to certify that the work reported in thesis titled "E-LEARNING
PLATFORM", submitted in the Department of COMPUTER SCIENCE AND
ENGINEERING(CSE), Krishna University College of Engineering and Technology,
Machilipatnam in the partial fulfilment of degree for the award of Bachelorof Technology, and
is a Bonafide work done by me.

The Report consists in the document is fully/partially owned by me under the

guidance of our Guide and Trained by the IIDT-APSCHE partner BLACKBUCKS of FULL
STACK DEVELOPMENT INTERNSHIP .

The reported results are based on the project work entirely done by me and not copied
from any other source.

Sincerely,
GADDE KUMAR SAI
Y21CSE279022
 INDEX

S.NO CONTENTS PAGE NO

1 Abstract 01
2 Introduction 02
2.1 E-learning Definition
3 Advantages and Disadvantages 03
3.1 Advantages
3.2 Disadvantages
4 Software and Hardware Requirements 04
4.1 Software Requirements
4.2 Hardware Requirements
5 Motivation 05
6 Literature Review 05
7 Existing System 05
8 Proposed System 06
9 Keywords & Definitions 06
10 Implementation 07
11 Challenges faced 07
12 Test Results 08
13 Source Code 13
13.1 Register.html
13.2 Login.html
13.3 Home.html
13.4 about.html
13.5 Courses.html
13.6 Teachers.html
13.7 Contacts.html
13.8 Update.html
13.9 playlist.html
13.10 watchvideo.html
14 Outputs 29
15 Conclusion 34
16 References 34
1 .Abstract

E- Learning can be viewed as computer assisted learning, and as pedagogy for

student centered and collaborative learning. Early developments in e-learning focused on
computer assisted learning, where part or all of the learning content is delivered digitally. More
recently the pedagogical dimension of elearning has become prominent. E-learning comprises
all forms of electronically supported learning and teaching. The information and
communication systems, whether networked learning or not, serve as specific media to
implement the learning process. Our project, "E-Learning Platform," aspires to harness cutting-
edge technology to create an engaging, comprehensive, and adaptable digital learning
environment. The advent of technology has revolutionized the education sector, paving the way
for innovative solutions like e-learning platforms that facilitate remote learning and cater to
diverse educational needs. This project aims to develop an advanced e-learning platform
designed to enhance the learning experience through interactive and accessible educational
resources.
2. Introduction
E-learning is commonly referred to the intentional use of networked information and
communication technology in teaching and learning. A number of other terms are also used to
describe this mode of teaching and learning. They include; Online learning, Virtual
learning, Distributed learning, Network and web based learning.

2.1 E-Learning – Definition:

The term e-learning comprises a lot more than online learning, virtual learning, distributed
learning, networked or web-based learning. As the letter “e” in elearning stands for the word
“electronic”, it would incorporate all educational activities that are carried out by
individuals or groups working online or offline, and synchronously or asynchronously via
networked or standalone computers and other electronic devices.
Moving from the implementation of "face-to-face" training to the development of e-learning
requires cultural, organizational, and educational changes. The relation-ships between trainees,
content, and trainers are disrupted, making this development delicate. In the 20th century, there
was an international movement in favor of e-learning integration in higher education. This
movement has been operationalized due to the variety of the educational offer by
universities, which most have opted to diversify knowledge dissemination means (sounds,
images, animations, etc.) to meet the needs of their target public. If access to knowledge was
previously conditioned by the physical presence in the classroom, technology enables its
learners to exceed this condition of presence and be opened towards other learning modalities
today. We can say that e-learning brings solutions within the distance learning framework
without pretending to represent the panacea for all pedagogical dysfunctions. Among these
solutions, distance learning seems to be the challenge ahead to face the new training
requirements in the digital era.
In the case of our study, the e-learning solutions that interest us are free elearning
platforms, because their costs, their states of development, their directions, and used
technologies rendered them very close to the axis of this research. If e-learning has many
advantages in training, it cannot be said that its use sometimes poses certain problems.

2|Page
3. Advantages & Disadvantages:

3.1 Advantages:
• Saves Time
• Cost-Effective
• Improved Efficiency
• Better Collaboration
• Outreach / Access
• Ease of use
• Individual Pace
• Application of Theory
• Wide Range of Courses
• Practicality
• Access to Training
• Immediate Feedback and Assessment
• Flexibility and Convenience

3.2 Disadvantages:
• Lack of a budget. Early schooling required students to physically travel to and attend classes.
• Too much Pressure on Grades.
• Too much competition.
• Not Focusing on Overall Growth.
• Lack of Training

3|Page
4. Software and Hardware Requirements
4.1 Software Requirements:
1. Programming Languages:
- Ensure that the following programming languages are installed:
- HTML
- CSS
- JavaScript
-Bootstrap

2. Web Browser:
- A modern web browser for testing and development purposes.
Common choices include:

- Google Chrome
- Mozilla Firefox
- Microsoft Edge

3. Text Editor or Integrated Development Environment (IDE):

- A text editor or IDE for coding and development.
-Visual Studio Code

4.2 Hardware Requirements:

1. Minimum Server Requirements:
- The server's hardware specifications will depend on the expected traffic
and complexity of your website. As a general guideline, consider at least:

- 1 GB RAM
- 1 CPU Core
- Sufficient storage space for your database and website files.
2. Client Devices:
- Ensure that your website is designed to be accessible on various client devices, including
desktops, laptops, tablets, and smartphones.
3. Internet Connection:
- A stable internet connection is necessary for development, deployment, and testing.

4|Page
5. Motivation:
Creating "Engage Tutors" stems from a profound commitment to revolutionize the
educational landscape by leveraging technology to make quality education accessible to all.
This e-learning app is designed to bridge the gap between students and expert tutors, providing
a seamless and interactive learning experience. By offering personalized learning paths,
interactive content, and real-time feedback, "Engage Tutors" aims to cater to the unique needs
of every learner, fostering a more engaging and effective educational journey. Our motivation
is to empower students with the tools and resources they need to succeed academically and
beyond, ensuring that learning is not confined by geography or socio-economic status but is an
enriching experience available to all.

6. Literature Review:
• E-learning Market Dynamics: The e-learning industry has seen remarkable growth and
transformation, influenced by shifting learner preferences, technological advancements, and
the impact of the digital economy. An understanding of these dynamics is crucial for
effectively positioning your elearning platform in a competitive market.
• Responsive Web Design and User Experience: Research emphasizes the importance of
responsive web design to ensure seamless and user-friendly experiences across various
devices, including mobile, which is increasingly becoming the preferred platform for online
learning. Adhering to these principles can enhance your website's accessibility and user
satisfaction.
• Content Presentation and Engagement: Studies show that high-quality multimedia content,
interactive elements, and comprehensive course descriptions significantly influence the
learning outcomes of online students. A well-designed content presentation can provide a
more immersive and informed learning experience .

7. Existing System:
1. Traditional Education: In the existing system, students rely on physical classrooms to attend
lectures and engage in learning activities. They need to be present in person, which may
involve time-consuming commutes and geographic constraints.
2. Limited Course Selection: Physical institutions often have limited course offerings due to
faculty availability and classroom space, which restricts the variety of subjects available for
students to choose from. This limitation can result in students not finding the exact courses
they desire.
3. Manual Administration: Traditional educational institutions often manage their administrative
tasks manually, which can lead to discrepancies, inefficiencies, and challenges in keeping
track of student progress and course availability.
4. Limited Online Presence: Many traditional educational institutions lack a strong online
presence, making it difficult for students to explore their offerings, check course details, or
make informed decisions online.
5. Seasonal Enrollment Fluctuations: Traditional educational institutions may experience
seasonal fluctuations in enrollment, leading to administrative challenges and the need to
offer incentives during off-peak periods.

5|Page
8. Proposed System:
Engage Tutors is the proposed system designed to revolutionize the way students
and tutors interact in the educational ecosystem. The primary objective of this elearning app is to
provide a robust platform where students can easily connect with expert tutors for personalized
learning experiences. By integrating advanced features such as interactive content, real-time
feedback, and adaptive learning paths, Engage Tutors aims to address the diverse learning needs
of students across different educational levels and subjects.
The system leverages cutting-edge technology to create a user-friendly interface
that simplifies the process of finding and engaging with tutors. Students can browse through a
curated list of qualified tutors, schedule sessions, and access a wealth of educational resources
tailored to their specific requirements. Tutors, on the other hand, can manage their schedules,
track student progress, and deliver customized lessons that enhance the learning outcomes.
Engage Tutors is not just a platform for academic support; it is a comprehensive
learning ecosystem that fosters collaboration, motivation, and continuous improvement. By
offering a blend of synchronous and asynchronous learning opportunities, the app ensures that
education is flexible, accessible, and effective. The ultimate goal of Engage Tutors is to create a
dynamic learning environment that empowers students to achieve their full potential and equips
tutors with the tools to make a significant impact on their students' academic journeys.

9. Keywords & Definitions:

• E-Learning Platform: An online system designed to deliver educational content, track
learner progress, and facilitate communication between students and instructors.
Learning Management System (LMS): A software application used to administer,
document, track, report, and deliver educational courses or training programs. Adaptive
Learning: A technology-based or online educational system that analyzes a student’s
performance in real-time and modifies the teaching methods and learning activities
accordingly.
• Asynchronous Learning: A type of learning where students learn from instruction that is
not being delivered in person or in real-time. Examples include recorded lectures,
discussion boards, and self-paced courses.
• Synchronous Learning: Learning that happens in real-time with the presence of an
instructor and other students, typically via live webinars, virtual classrooms, or video
conferences.
• Blended Learning: An education program that combines online digital media with
traditional in-person classroom methods.
• Course Management: The process of creating, organizing, and managing courses on an
e-learning platform, including the creation of content, assignments, and assessments.
Gamification: The application of game-design elements and principles in non-game
contexts, such as e-learning, to make learning more engaging and fun.
• Microlearning: A learning strategy that involves delivering content in small, specific
bursts, typically lasting only a few minutes.
• Mobile Learning (M-Learning): Educational content and learning experiences that are
accessible through mobile devices such as smartphones and tablets.

6|Page
 • MOOC (Massive Open Online Course): An online course aimed at unlimited
participation and open access via the web, often provided by universities or educational
institutions.
• Virtual Classroom: An online space where teachers and students can interact in real-
time through video, audio, and text-based communication.
• Interactive Content: Educational material designed to engage learners through
interactive elements such as quizzes, simulations, and multimedia.

10. Implementation:
1 .Set Up the Environment
• Install a Local Server: Use software like XAMPP, WAMP, or MAMP to set up a local
server environment that supports PHP and MySQL.
• Create a Project Directory: Organize your project files into directories such as css, js,
images, and includes.
2. Frontend Development
• HTML (HyperText Markup Language): Structure the content of your platform.
• index.html: The homepage with links to other sections like login, courses and user
profiles.
• login.html: The login form.
• register.html: The registration form.
• courses.html: A list of available courses.
• application.html: Details of a specific course, including lessons and quizzes.

11. Challenges faced:

• Technical Challenges
• Content Creation and Management
• Communication and Collaboration
• Administrative and Management Challenges
• User Engagement and Experience

SYSTEM TESTING:
Software testing is an important element of software quality assurance and represents the
ultimate review of specification, design and coding. It increasing visibility of software as a
system element and the costs associates with a software failure are motivating forces for all well
planned through testing. The system is tested with giving wrong information. Cascade deletion
and, the software developer checks updating. Testing and debugging are different activities, but
debugging must be accommodated in any testing strategy.

7|Page
UNIT TESTING:
Unit testing is the important and major part of the project. So errors can be rectified
easily in each module and program clarity can be increased. In this project, the entire system is
divided into several modules and is developed individually. Hence, unit testing is conducted to
individual modules.

INTEGRATION TESTING:
Integration testing is the systematic technique for constructing the program structure
while conducting tests to uncover errors associated with integrating. After the unit test, each
module is gradually integrated to form one final system. All the modules when unit tested will
work properly but after integrating the data can cause error one module can have an inadvertent,
adverse effect on another; sub functions when combined may not produce the desired major
function; global data structures can cause problems, etc. In this project the integration testing is
performed by combing login, civil registration and status modules are generated the report.

PERFORMANCE TESTING:
A type of Physical test covering a wide range of engineering or functional evaluations
where a material, product, or system is not specified by detailed material or component
specifications: rather, emphasis is on the final measurable performance characteristics. Testing
can be a qualitative or quantitative procedure.

ACCEPTANCE TESTING:
The User Acceptance testing focuses mainly on the functionality thereby validating the
fitness-for-use of the system by the business user. The user acceptance test is performed by the
users and application managers.

12. Test Results:

All the test cases mentioned above passed successfully and it little will be works. No
defects encountered.

8|Page
Outputs:

Fig 1: Home page

Fig 2: Home page

9|Page
Fig 3: Home page

10 | P a g e
Fig 4: Blog page

11 | P a g e
Fig 4: Contact page

Fig 5: Library page

12 | P a g e
Source Code:
1. Register.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>register</title>
<!-- font awesome cdn link --> <link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/6.1.2/css/all.min.css">
<!-- custom css file link -->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header class="header">
<section class="flex">
<a href="home.html" class="logo">Education</a>
<form action="search.html" method="post" class="search-form">
<input type="text" name="search_box" required placeholder="search courses..."
maxlength="100">
<button type="submit" class="fas fa-search"></button>
</form>
<div class="icons">
<div id="menu-btn" class="fas fa-bars"></div>
<div id="search-btn" class="fas fa-search"></div>
<div id="user-btn" class="fas fa-user"></div>
<div id="toggle-btn" class="fas fa-sun"></div>
</div>
<input type="file" accept="image/*" required class="box">
<input type="submit" value="register new" name="submit" class="btn">
</form></section><footer class="footer">

13 | P a g e
 &copy; copyright @ 2024 by <span>Mr. sai Ram</span> | all rights reserved!
</footer><!-- custom js file link -->
<script src="js/script.js"></script> </body></html

2. Login.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>login</title>
<!-- font awesome cdn link -->
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/6.1.2/css/all.min.css"
<!-- custom css file link -->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header class="header">
<section class="flex">
<a href="home.html" class="logo">Education</a>
<form action="search.html" method="post" class="search-form">
<input type="text" name="search_box" required placeholder="search courses..."
maxlength="100">
<p>your email <span>*</span></p>
<input type="email" name="email" placeholder="enter your email" required
maxlength="50" class="box">
<p>your password <span>*</span></p>
<input type="password" name="pass" placeholder="enter your password" required
maxlength="20" class="box">
<input type="submit" value="login new" name="submit" class="btn">

14 | P a g e
 </form>
</section>
<footer class="footer">
&copy; copyright @ 2024 by <span>mr. sai ram</span> | all rights reserved!
</footer> <!-- custom js file link -->
<script src="js/script.js"></script></body></html>

3. Home.html :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>home</title>
<!-- font awesome cdn link -->
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/6.1.2/css/all.min.css">
<!-- custom css file link -->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header class="header">
<section class="flex">
<a href="home.html" class="logo">Education</a>
<form action="search.html" method="post" class="search-form">
<input type="text" name="search_box" required placeholder="search courses..."
maxlength="100">
</div>
<h3 class="title">complete JQuery tutorial</h3>
<a href="playlist.html" class="inline-btn">view playlist</a>
</div>

15 | P a g e
 <div class="box">
<div class="tutor">
<img src="images/pic-7.jpg" alt="">
<div class="info">
<h3>Mr.kiran</h3>
<span>18-07-2024</span>
</div>
</div>
<div class="thumb">
<img src="images/thumb-6.png" alt="">
<span>10 videos</span>
</div>
<h3 class="title">complete SASS tutorial</h3>
<a href="playlist.html" class="inline-btn">view playlist</a>
</div></div>
<div class="more-btn">
<a href="courses.html" class="inline-option-btn">view all courses</a>
</div>
</section>
<footer class="footer">
&copy; copyright @ 2024 by <span>Mr. Sai Ram</span> | all rights reserved!
</footer>
<!-- custom js file link -->
<script src="js/script.js"></script>
</body>
</html>

4. About.html:
<!DOCTYPE html>
<html lang="en">
<head>

16 | P a g e
 <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>about us</title>
<!-- font awesome cdn link -->
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/6.1.2/css/all.min.css">
<!-- custom css file link -->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header class="header">
<section class="flex"> <a href="home.html" class="logo">Education</a> <form
action="search.html" method="post" class="search-form">
<input type="text" name="search_box" required placeholder="search courses..."
maxlength="100">
<button type="submit" class="fas fa-search"></button>
</form>
<div class="icons">
<div id="menu-btn" class="fas fa-bars"></div>
<div id="search-btn" class="fas fa-search"></div>
<div id="user-btn" class="fas fa-user"></div>
<div id="toggle-btn" class="fas fa-sun"></div>
</div
<p>Watching e-learning videos enhances engagement, improves comprehension with visual
aids, offers flexible learning at your own pace, caters to different learning styles, and provides
convenient access anytime and anywhere..</p>
<a href="courses.html" class="inline-btn">our courses</a>
</div></div><div class="box-container">
<div class="box">
<i class="fas fa-graduation-cap"></i>
<div>

17 | P a g e
 <p>Watching e-learning videos enhances engagement, improves comprehension with
visual aids, offers flexible learning at your own pace, caters to different learning styles, and
provides convenient access anytime and anywhere.</p>
<div class="student">
<img src="images/pic-4.jpg" alt="">
<div>
<h3>Mr.Gsk</h3>
<div class="stars">
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star-half-alt"></i></div></div></div> </div>
<i class="fas fa-star-half-alt"></i>
</div>
</div>
</div>
</div>
</div></section>
<footer class="footer">
&copy; copyright @ 2024 by <span>Mr. Sai Ram </span> | all rights reserved!
</footer>
<!-- custom js file link -->
<script src="js/script.js"></script>
</body>
</html>

5. Courses.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

18 | P a g e
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>courses</title>

<!-- font awesome cdn link -->

<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/6.1.2/css/all.min.css">

<!-- custom css file link -->

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

</head>
<body>

<header class="header">

<section class="flex">

<a href="home.html" class="logo">Education</a>

<form action="search.html" method="post" class="search-form">

<input type="text" name="search_box" required placeholder="search courses..."
maxlength="100">
<button type="submit" class="fas fa-search"></button>
</form>

<div class="icons">
<div id="menu-btn" class="fas fa-bars"></div>
<div id="search-btn" class="fas fa-search"></div>
<div id="user-btn" class="fas fa-user"></div>
<div id="toggle-btn" class="fas fa-sun"></div>
</div>

<div class="profile">
<img src="images/pic-1.jpg" class="image" alt="">

19 | P a g e
 <h3>Mr.kiran</h3>
<span>18-07-2024</span>
</div>
</div>
<div class="thumb">
<img src="images/thumb-9.png" alt="">
<span>10 videos</span>
</div>
<h3 class="title">Complete react tutorial</h3>
<a href="playlist.html" class="inline-btn">view playlist</a> </div> </div>
</section>
<footer class="footer">
&copy; copyright @ 2024 by <span>mr. Sai Ram</span> | all rights reserved!
</footer>
<!-- custom js file link -->
<script src="js/script.js"></script>
</body>
</html>

6. Teachers.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>teachers</title>

<!-- font awesome cdn link -->

<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/6.1.2/css/all.min.css">

20 | P a g e
 <form action="" method="post" class="search-tutor">
<input type="text" name="search_box" placeholder="search tutors..." required
maxlength="100">
<button type="submit" class="fas fa-search" name="search_tutor"></button> </form>

<div class="box-container">

<div class="box offer">

<h3>become a tutorial</h3>
<p>Watching e-learning videos enhances engagement, improves comprehension with
visual aids, offers flexible learning at your own pace, caters to different learning styles, and
provides convenient access anytime and anywhere.</p>
<a href="register.html" class="inline-btn">get started</a> </div>

<div class="box">
<div class="tutor">
<img src="images/pic-2.jpg" alt="">
<div>
<h3>K.Charan</h3>
<span>web designer</span>
</div>
</div>
<p>total playlists : <span>6</span></p>
<p>total videos : <span>22</span></p>
<p>total likes : <span>1408</span></p>
<a href="teacher_profile.html" class="inline-btn">view profile</a> </div>

<div class="box">
<div class="tutor">
<img src="images/pic-3.jpg" alt="">
<div>
<h3>G. Venkatesh</h3>
<span>developer</span>

21 | P a g e
 <p>total videos : <span>19</span></p>
<p>total likes : <span>1710</span></p>
<a href="teacher_profile.html" class="inline-btn">view profile</a>
</div> </div>
</section>
<footer class="footer">
&copy; copyright @ 2024 by <span>mr. sai ram</span> | all rights reserved!
</footer>
<!-- custom js file link -->
<script src="js/script.js"></script>
</body> </html>

7. Contacts.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>contact
us</title>
<!-- font awesome cdn link -->
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/6.1.2/css/all.min.css">
<!-- custom css file link -->
<link rel="stylesheet" href="css/style.css">
</head> <body>
<header class="header">
<section class="flex">
<a href="home.html" class="logo">Education</a>
<form action="search.html" method="post" class="search-form">
<input type="text" name="search_box" required placeholder="search courses..."
maxlength="100">

22 | P a g e
 <button type="submit" class="fas fa-search"></button>
</form> <div class="icons">
<div id="menu-btn" class="fas fa-bars"></div>
<div id="search-btn" class="fas fa-search"></div>
<div id="user-btn" class="fas fa-user"></div>
<div id="toggle-btn" class="fas fa-sun"></div>
</div> <div class="profile">
<img src="images/pic-1.jpg" class="image" alt="">
<h3 class="name">K. Sai Ram</h3>
<p class="role">student</p>
<a href="profile.html" class="btn">view profile</a>
<div class="flex-btn">
<a href="login.html" class="option-btn">login</a>
<a href="register.html" class="option-btn">register</a>
</div> </div> </section> </header>
<div class="side-bar">
<a href="mailto:gcdewgfh.com">[email protected]</a>
<a href="mailto:[email protected]">[email protected]</a>
<a href="mailto:[email protected]">[email protected]</a> </div>
<div class="box"> <i class="fas fa-map-marker-alt"></i> <h3>office address</h3>
<a href="#">flat no. 2, 1-4 building, Rajamahendravaram, AndhraPradesh, india -
533101</a> </div> </div> </section><footer class="footer">
&copy; copyright @ 2024 by <span>Mr. Sai Ram</span> | all rights reserved!
</footer>
<!-- custom js file link --> <script src="js/script.js"></script> </body> </html>

8. Update.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

23 | P a g e
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>update</title>
<!-- font awesome cdn link -->
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/6.1.2/css/all.min.css">
<!-- custom css file link -->
<link rel="stylesheet" href="css/style.css">
</head> <body>
<header class="header"> <section class="flex">
<a href="home.html" class="logo">Education</a>
<form action="search.html" method="post" class="search-form">
<input type="text" name="search_box" required placeholder="search courses..."
maxlength="100"> <button type="submit" class="fas fa-search"></button> </form>
<div class="icons">
<div id="menu-btn" class="fas fa-bars"></div>
<div id="search-btn" class="fas fa-search"></div>
<div id="user-btn" class="fas fa-user"></div>
<div id="toggle-btn" class="fas fa-sun"></div>
</div> <div class="profile">
<img src="images/pic-1.jpg" class="image" alt="">
<h3 class="name">K. Sai Ram</h3>
<p class="role">student</p>
<a href="profile.html" class="btn">view profile</a>
<div class="flex-btn">
<a href="login.html" class="option-btn">login</a>
<a href="register.html" class="option-btn">register</a>
</div> </div> </section> </header>
<div class="side-bar">
<div id="close-btn">
<i class="fas fa-times"></i>

24 | P a g e
9. playlist.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>video
playlist</title> <!-- font awesome cdn link -->
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/6.1.2/css/all.min.css">
<!-- custom css file link --> <link rel="stylesheet" href="css/style.css">
</head> <body> <header class="header"> <section class="flex">
<a href="home.html" class="logo">Education</a>
<form action="search.html" method="post" class="search-form">
<input type="text" name="search_box" required placeholder="search courses..."
maxlength="100">
<button type="submit" class="fas fa-search"></button> </form>
<div class="icons"> <div id="menu-btn" class="fas fa-bars"></div>
<div id="search-btn" class="fas fa-search"></div>
<p> IIDT BLACKBUCKS Short term internship on Full Stack development Here the
detailed videos regarding to the topics. </p>
<a href="teacher_profile.html" class="inline-btn">view profile</a> </div>
</div> </div> </section> <section class="playlist-videos">
<h1 class="heading">playlist videos</h1> <div class="box-container">
<a class="box" href="watch-video.html"> <i class="fas fa-play"></i>
<img src="images/post-2-1.jpg" alt="">
<h3>FSD Short Term Internship (Session 1)</h3> </a>
<a class="box" href="watch-video2.html">
<i class="fas fa-play"></i>
<img src="images/post-1-2.png" alt="">
<h3>FSD Short Term Internship (Session 2)</h3> </a>
<a class="box" href="watch-video3.html"> <i class="fas fa-play"></i>

25 | P a g e
 <img src="images/post-1-3.png" alt="">
<h3>FSD Short Term Internship (Session 3)</h3> </a>
<a class="box" href="watch-video4.html">
<a class="box" href="watch-video6.html">
<i class="fas fa-play"></i>
<img src="images/post-1-6.png" alt="">
<h3>FSD Short Term Internship (Session 6)</h3>
</a></div></section><footer class="footer">
&copy; copyright @ 2024 by <span>mr. Sai ram</span> | all rights reserved!
</footer><!-- custom js file link --> <script src="js/script.js"></script>
</body> </html>

10. watchvideo.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>watch</title>

<!-- font awesome cdn link -->

<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/6.1.2/css/all.min.css">

<!-- custom css file link -->

<link rel="stylesheet" href="css/style.css">
</head> <body>
<header class="header">
<section class="flex">
<a href="home.html" class="logo">Education</a>
<form action="search.html" method="post" class="search-form">
<input type="text" name="search_box" required placeholder="search courses..."
maxlength="100">

26 | P a g e
 <button type="submit" class="fas fa-search"></button> </form>
<div class="icons">
<div id="menu-btn" class="fas fa-bars"></div>
<div id="search-btn" class="fas fa-search"></div>
<div id="user-btn" class="fas fa-user"></div>
<div id="toggle-btn" class="fas fa-sun"></div>
</div><div class="profile">
<img src="images/pic-1.jpg" class="image" alt="">
<h3 class="name">K. Sai Ram</h3>
<p class="role">student</p>
<a href="profile.html" class="btn">view profile</a>
<div class="flex-btn">
<a href="login.html" class="option-btn">login</a>
<a href="register.html" class="option-btn">register</a>
</div> </div> </section> </header> <div class="side-bar"> </div>
<form action="" method="post" class="flex">
<a href="playlist.html" class="inline-btn">view playlist</a>
<button><i class="far fa-heart"></i><span>like</span></button>
</form>
<p class="description">
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Itaque labore ratione, hic
exercitationem mollitia obcaecati culpa dolor placeat provident porro.
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Aliquid iure autem non fugit sint.
A, sequi rerum architecto dolor fugiat illo, iure velit nihil laboriosam cupiditate voluptatum
facere cumque nemo! </p> </div> </section> <section class="comments">
<h1 class="heading">5 comments</h1>
<form action="" class="add-comment"> <h3>add comments</h3>
<textarea name="comment_box" placeholder="enter your comment" required
maxlength="1000" cols="30" rows="10"></textarea> <input type="submit" value="add
comment" class="inline-btn" name="add_comment"> </form> <h1 class="heading">user
comments</h1> <div class="box-container"> <div class="box">
<div class="user">
<img src="images/pic-13.jpg" alt="">

27 | P a g e
 <div>
<h3>kiran</h3>
<span>19-07-2024</span>
</div>
pic-14.jpg" alt=""> <div> <h3>Rishi</h3>
<span>19-07-2024</span> </div> </div>
<div class="comment-box">awesome tutorial!
keep going!</div>
</div> <div class="box">
<div class="user">
<img src="images/pic-15.jpg" alt="">
<div> <h3>sumathi</h3>
<span>19-07-2024</span>
</div> </div> <div class="comment-box">amazing way of teaching! thank you
so much! </div> </div> <div class="box"><div class="user"> <img src="images/pic-16.jpg"
alt=""> <div><h3>raja</ <span>19-07-2024</span> </div> </div>
<div class="comment-box">loved it, thanks for the tutorial!</div> </div> <div
class="box"> <div class="user"> <img src="images/pic-15.jpg" alt=""> <div>
<h3>rani</h3> <span>19-07-2024</span> </div> </div>
<div class="comment-box">this is what I have been looking for! thank you so
much!</div>
</div> <div class="box"> <div class="user"> <img src="images/pic-17.jpg" alt="">
<div> <h3>ram</h3> <span>19-07-2024</span>
</div> </div> <div class="comment-box">thanks for the tutorial!
how to download source code file?</div> </div> </div>
</section><footer class="footer">
&copy; copyright @ 2024 by <span>mr. sai ram</span> | all rights reserved! </footer>
<!-- custom js file link -->
<script src="js/script.js"></script>
</body> </html>

28 | P a g e
Outputs:

1.Register.html Page:

2. Login.html Page:

29 | P a g e
3. Home.html Page:

G KUMAR SAI

4. About.html Page:

G KUMAR SAI

30 | P a g e
5. Courses.html Page:

G KUMAR SAI

6. Teachers.html Page:

G KUMAR SAI

31 | P a g e
7. Contacts.html Page:

G KUMAR SAI

8. Update.html Page:

G KUMAR SAI

32 | P a g e
9. Playlist.html Page:

G KUMAR SAI

10. watchvideo.html Page:

G KUMARSAI

33 | P a g e
Conclusion:
The completion of the Engage Tutors for our E-learning platform project marks a
significant milestone in our journey towards enhancing online education. This project has been a
remarkable experience, encompassing various aspects of both frontend and backend
development, and has resulted in a robust, user-friendly application designed to bridge the gap
between students and tutors.
Throughout this project, we focused on creating an intuitive and engaging interface,
ensuring that users can easily navigate through the app. The frontend, developed using HTML,
CSS, and JavaScript, provides a seamless user experience, while the backend, powered by PHP,
ensures efficient data management and secure interactions. The integration of these technologies
has allowed us to build a platform that not only meets the functional requirements but also offers
an aesthetically pleasing and responsive design.
Engage Tutors is designed to facilitate learning by providing students with access to a
diverse range of tutors, each specializing in various subjects. The app includes features such as
user registration, profile management, search and filter options for finding tutors, booking
sessions, and a secure payment gateway. These features are aimed at providing a comprehensive
solution to the challenges faced in traditional education systems, making learning more
accessible and personalized.

References:

[1] Gwo-Jen Hwang, Hui-Chun Chu & Chengjiu Yin.” Objectives, methodologies, and research
issues of learning analytics”. Interactive learning environments, 2017
[2] Olga Viberga, Mathias Hatakkab, Olof Bältera, Anna Mavroudia.” The current landscape of
learning analytics in higher education”. Computers in Human Behavior 2018
[3] lmaiah MA, Al-Khasawneh A, Althunibat A. Exploring the critical challenges and factors
influencing the E-learning system usage during the COVID-19 pandemic. 2020. Available from:
https://doi.org/10.1007/s10639-020-10219-y.
[4] Gregorio Robles, Jesús M. González-Barahona. “Mining student repositories to gain learning
analytics”. IEEE 2013.
[5] https://www.sourcecodester.com/php/12808/e-learning-system-using-phpmysqli.html
[6] https://www.elearningscript.com/elearning-source-code/

Warm Regards,
GADDE KUMAR SAI

34 | P a g e