Industrial Interaction Report on

Web
Development

Graphic Era Deemed University

Submitted in partial fulfilment of the requirement for the award of the degree of

BACHELOR OF TECHNOLOGY
IN
COMPUTER SCIENCE & ENGINEERING

Submitted by:

Rajat Saini 2019029

Department of Computer Science and Engineering

Graphic Era (Deemed to be University)
Dehradun, Uttarakhand
2024-25
 CANDIDATE’S DECLARATION

I hereby certify that the work which is being presented in the Industrial Interaction report
entitled “Web Development” in partial fulfilment of the requirements for the award of the
Degree of Bachelor of Technology in Computer Science and Engineering in the Department
of Computer Science and Engineering of the Graphic Era (Deemed to be University),
Dehradun shall be carried out by the undersigned under the supervision of Anjali Prusty,
Director & CEO Tech OCTANET SERVICES PVT LTD.

Rajat
Rajat Saini
2019029
Dehradun

Copy of
Certificate
 Contact Details
 Project Manager: Anjali Prusty
 Organization: TECHOCTANET SERVICES PVT LTD
 Table of Contents
1. Acknowledgment
2. About the Organization
3. Work Responsibilities
4. Work Details
5. Skills Learned
6. Conclusion
 1. Acknowledgment
I would like to express my sincere gratitude to Tech OCTANET for providing me with the
invaluable opportunity to participate in the internship program. This experience has been
instrumental in enhancing my skills and understanding of software development. I extend my
heartfelt thanks to the mentors and instructors who guided me through the intricacies of the
projects, especially during the development of the Bank Management System and Front End
development in the first two weeks. Additionally, I am deeply appreciative of the support and
encouragement received during the challenging but rewarding journey of the industry-level
capstone project in the third and fourth weeks. The exposure to real-world application
development has been enriching, and I am thankful for the insights gained, which I believe
will significantly contribute to my professional growth. This internship has been a
transformative experience, and I am grateful for the knowledge, skills, and inspiration gained
during this period.
 2. About the Organization
Tech OCTANET represent entities that play crucial roles in shaping the landscape of
education and technology. Tech OCTANET, with its commitment to fostering industry-
relevant skills and bridging the gap between academia and industry, serves as a catalyst for
transforming students into industry-ready professionals. Through its programs and initiatives,
Tech OCTANET provides a platform for students and professionals to acquire the latest
technological skills and stay abreast of industry trends.

Tech OCTANET also stands as a prominent technology company that is at the forefront of
innovation and software development. Known for its cutting-edge solutions and commitment
to excellence, Tech OCTANET creates opportunities for individuals to engage with real-
world projects, gain practical experience, and contribute meaningfully to the technological
advancements in various domains.

The internship programs facilitated by Tech OCTANET offer a holistic and immersive
experience, combining theoretical learning with practical application, and preparing
participants to meet the demands of the rapidly changing technological landscape.
 3. Work Responsibilities
The internship at Tech OCTANET, encompasses a range of responsibilities designed to
provide a comprehensive learning experience. During the four-week program, as an intern I
have the responsibility for making the following projects:

Bank Management System Project (Week 1):

 Develop a fully functional Bank Management System using Java.
 Implement features such as account creation, transaction processing, and balance
management.
 Ensure code quality, adherence to best practices, and efficient system performance.
 Collaborate with team members to troubleshoot issues and optimize the application.

Front End Development Project (Week 2):

 Create a program to implement a feature that allows users to toggle the visibility of
content on a web page using a button. When the user clicks the button, the content
should toggle between being hidden and being displayed. You are required to create
the HTML, CSS, and JavaScript code to achieve this functionality. Upload
screenshots of both the code and the output (upload only in PNG image format).
 Write a program to implement a countdown timer on a web page that
counts down from a specified number of seconds. When the user
clicks a button, the countdown should start, and the remaining time
should be displayed. The countdown should update every second, and
when it reaches zero, a message should be displayed indicating that
the time is up. Upload screenshots of both the code and the output
(upload only in PNG image format) Test the system thoroughly to identify and
resolve potential issues.
 Build a Basic Login Page using Javascript.
 create a button that toggles the visibility of a hidden paragraph.
Initially, the paragraph should be hidden, and clicking the button
should show/hide the paragraph.

Capstone Project (Weeks 3-4):

 Engage in an industry-level capstone project, focusing on creating a robust and
scalable application.
 Collaborate with a cross-functional team to define project requirements and
objectives.
 Employ advanced programming concepts and frameworks to develop an industry-
ready application.
 Conduct thorough testing, debugging, and optimization to ensure the application
meets specified criteria.
 Demonstrate creativity, problem-solving skills, and the ability to work in a
collaborative, fast-paced environment.
 Present the completed capstone project, showcasing technical skills and project
management abilities.
Learning and Collaboration:
 Actively participate in workshops, training sessions, and mentorship programs
organized by Tech OCTANET.
 Engage with colleagues and mentors to seek guidance, share knowledge, and foster a
collaborative learning environment.
 Stay updated on industry trends, emerging technologies, and best practices in software
development.

Documentation and Reporting:

 Document all phases of project development, including requirements, design,
implementation, and testing.
 Prepare regular progress reports and presentations to showcase project achievements
and challenges.
 Capture lessons learned and insights gained during the internship for personal and
team development.
By fulfilling these responsibilities, I gained hands-on experience, enhance their technical
skills, and contribute to the successful completion of real-world projects, preparing them for
future roles in the field of software development.
 4. Work Details
1. Bank Management System Project (Week 1):
The internship started by working on a Bank Management System. This involves creating a
Java-based application that simulates essential banking functionalities. Responsibilities
include:
Requirements Analysis: Understand the functional requirements of a bank management
system, including account creation, transaction processing, and balance management.
Java Programming: Utilize Java programming language to implement core features,
ensuring modularity and code efficiency.
User Interface Design: Develop a user-friendly interface for customers to interact with the
system.
Testing and Debugging: Rigorously test the application, identify potential issues, and debug
to ensure a stable and reliable system.
Documentation: Document the design choices, coding standards, and testing procedures to
create comprehensive project documentation.
The Bank Management system revolves around a BankAccount class, instantiated in the main
method of the Banking class. The BankAccount class incorporates essential functionalities
such as depositing, withdrawing, and retrieving previous transactions. It employs a simple
menu-driven interface facilitated by a Scanner to interact with the user. The program allows
users to check their account balance, deposit or withdraw funds, view previous transaction
details, and calculate fixed deposit, savings account, and compound interest. Additionally, the
code features error handling to manage invalid user inputs. It provides a foundation for a
comprehensive Bank Management System, and further enhancements and features can be
integrated for a more sophisticated and user-friendly application. This initial implementation
serves as a starting point for developing a robust and efficient banking system in Java.

2. Front End Development Project (Week 2):

 Create a program to implement a feature that allows users to toggle the

visibility of content on a web page using a button.

o The HTML starts with the <!DOCTYPE html> declaration, followed by the
<html> root element with the lang="en" attribute, specifying the document's
language.
o
o Inside the <head> section, there are meta tags defining the character set and
viewport for the webpage. Additionally, there's an embedded <style> block
defining a CSS rule for an element with the ID #content to initially set its
display property to none, hiding it.
o
o The webpage's title is set to "Toggle Content."
o
o The <body> section contains a <button> element with the ID toggleButton and
a <div> element with the ID content. The content within this div is a simple
paragraph (<p>) that says, "This is the content that can be toggled."
o
 o Following the HTML structure, there's a <script> block containing JavaScript
code. This code fetches the button and content div using
document.getElementById() to assign them to variables toggleButton and
content, respectively.
o
o An event listener is added to the toggleButton using addEventListener() to
detect a "click" event. When the button is clicked, it triggers an anonymous
function.
o
o Inside this function, there's a conditional statement that checks the current
display property of the content div. If the display is "none" or empty (initial
state or explicitly set to "none"), it changes the display property to "block" to
show the content. If it's already displayed ("block"), the script sets the display
property to "none" to hide the content.

 Write a program to implement a countdown timer on a web page that

counts down from a specified number of seconds. When the user
clicks a button, the countdown should start, and the remaining time
should be displayed
o - The HTML structure includes a `<div>` element with the ID `timer` to
display the countdown and a `<button>` with the ID `startButton` to trigger
the countdown.
o - Inside the `<style>` block, there's a CSS rule targeting the `#timer` ID to set
the font size to 24 pixels.
o - The JavaScript portion initializes variables, selects DOM elements by their
IDs (`timer` and `startButton`), and defines functions for the timer
functionality.
o - The `startTimer(seconds)` function initializes and starts the countdown timer.
It calculates the end time based on the current time (`Date.now()`) plus the
specified number of seconds. It updates the display every second using
`setInterval`, showing the remaining time until it reaches zero.
o - The `displayTimeLeft(seconds)` function formats the time to show minutes
and seconds properly in the `timerDisplay`.
o - An event listener is attached to the `startButton` to trigger the `startTimer`
function when clicked, initializing a countdown of 60 seconds.
o When the timer starts, it counts down from 60 seconds, updating the displayed
time every second until it reaches zero. Upon reaching zero, it displays "Time
is up!" in place of the countdown.
 Build a Basic Login Page using Javascript

 create a button that toggles the visibility of a hidden

paragraph. Initially, the paragraph should be hidden, and
clicking the button should show/hide the paragraph.
3.Capstone Project - Product Selling Site (Weeks 3-4):
For the capstone project, interns will collaborate on an industry-level application: a Product
Selling Site created using kandi software provided by Tech OCTANET. Responsibilities
include:

Kandi Software Development: Utilize the Kandi software provided by Tech OCTANET to
build a fully functional product selling site.
E-commerce Features: Implement essential e-commerce functionalities, including product
search, cart management, and secure payment processing.
User Interface Enhancement: Design an intuitive and visually appealing user interface to
enhance the user experience.
Testing and Optimization: Conduct comprehensive testing, identify and resolve any issues,
and optimize the site for performance.
Documentation and Presentation: Prepare detailed documentation for the capstone project,
outlining the development process, challenges, and solutions. Conclude the internship with a
presentation showcasing the completed product selling site.
The capstone project is an ambitious undertaking that encapsulates the culmination of my
academic or professional journey, serving as a comprehensive application of the skills and
knowledge acquired throughout the program. In this particular capstone project, I have
designed and developed an Apple product selling website, aimed at providing users with a
seamless e-commerce experience. The website incorporates a user-friendly interface,
allowing individuals to search for products by creating a login account or by entering existing
credentials. Users can effortlessly navigate through the platform, select desired Apple
products, add them to their shopping cart, and proceed to make secure and efficient
purchases. This project not only showcases my proficiency in web development, user
interface design, and database management but also reflects my ability to address real-world
demands by creating a fully functional and aesthetically pleasing e-commerce solution. The
capstone project has been an enriching experience, allowing me to apply theoretical concepts
in a practical setting and paving the way for a smooth transition into the professional realm.
Images for the Industrial Project build:
 5. Skills Learned
The internship has equipped me with a diverse set of skills across various dimensions of
software development and project management. Specifically, the skills acquired include:

Programming Proficiency:
Developed strong proficiency in Java, HTML, CSS, JS programming language through the
implementation of the Bank Management System, Web Page Development and the Product
Selling Site.

Object-Oriented Design:
Gained expertise in designing and implementing systems using object-oriented principles,
enhancing code modularity and maintainability.

User Interface (UI) Design:

Acquired skills in designing intuitive and user-friendly interfaces for the Bank Management
System, Web Page Development, and the Apple Product Selling Site.

Project Planning and Management:

Demonstrated project planning and management abilities by successfully completing multiple
projects within specified timelines, ensuring efficient task allocation and collaboration.

System Testing and Debugging:

Acquired proficiency in systematic testing and debugging processes to identify and resolve
issues in the developed systems, ensuring their reliability and stability.

Documentation Skills:
Developed comprehensive documentation skills, including writing technical documentation
for codebases, system architectures, and user manuals.

E-commerce Development:
Acquired hands-on experience in developing an e-commerce platform, specifically in
designing and implementing features such as product search, cart management, and secure
payment processing.

Problem-Solving:
Enhanced problem-solving skills by addressing challenges encountered during the
development process, fostering a proactive and analytical approach to software development.

Collaboration and Teamwork:

Cultivated effective collaboration and teamwork skills by working closely with mentors,
colleagues, and cross-functional teams throughout the internship.

Presentation Skills:
Developed the ability to effectively communicate and present project outcomes,
methodologies, and insights, showcasing the results of the internship.

Continuous Learning:
Embraced a culture of continuous learning by staying informed about industry trends,
emerging technologies, and best practices in software development.
Overall, the internship has provided a well-rounded and practical foundation, preparing me
with the skills necessary to navigate the challenges and demands of the ever-evolving field of
software development.

6. Conclusion

In conclusion, the internship at Tech OCTANET, has been a transformative and enriching
experience that has significantly contributed to my growth as a software developer.
Over the course of four weeks, I engaged in hands-on projects that spanned diverse areas of
application development, from creating a Bank Management System and Web Page
Develeopment to the challenging capstone project—an Apple product selling website.
This internship provided a platform to apply theoretical knowledge to practical scenarios,
reinforcing my programming skills in Java, enhancing my understanding of system design,
and introducing me to the intricacies of e-commerce development. The collaborative
environment fostered effective teamwork, and the guidance from mentors and colleagues
proved invaluable.
I gained proficiency in project planning, systematic testing, and documentation, essential
aspects of the software development lifecycle.
This internship has not only expanded my technical skill set but also instilled in me a
commitment to continuous learning and problem-solving. As I conclude this internship, I am
well-equipped to navigate the complexities of the software development landscape, and I am
grateful for the invaluable lessons and experiences gained throughout this rewarding journey.