INTERNSHIP IN

FULL STACK WEB DEVELOPMENT

A PROJECT REPORT

Submitted by

[SHIYANI RAHULKUMAR GOVINDBHAI]

[190050131560]

In partial fulfilment for the award of the degree of

BACHELOR OF ENGINEERING

in

[Computer Science & Engineering]

Babaria Institute of Technology, Vadodara

Gujarat Technological University, Ahmedabad

[December, 2022-23]
Team ID: 257910 190050131560

BABARIA INSTITUTE OF TECHNOLOGY

Vadodara-Mumbai NH#8, Varnama, Vadodara-391240 Gujarat, India

CERTIFICATE

This is to certify that the project report submitted along with the project entitled Internship in

Full Stack Web Development has been carried out by Shiyani Rahulkumar Govindbhai

(190050131560) under my guidance in partial fulfilment for the degree of Bachelor of

Engineering in Computer Science & Engineering, 7th Semester of Gujarat Technological

University, Ahmedabad during the academic year 2022-23.

Mr. Vihang N Patel Dr. Nitesh Sureja

Internal Guide Head of the Department

Gujarat Technological University ii Babaria Institute of Technology

Team ID: 257910 190050131560

JOINING LETTER

Gujarat Technological University iii Babaria Institute of Technology

Team ID: 257910 190050131560

COMPLETION CERTIFICATE

Gujarat Technological University iv Babaria Institute of Technology

Team ID: 257910 190050131560

ACKNOWLEDGEMENT

I wish to express my sincere gratitude to our External guide Mr. Rahul Chauhan for

continuously guiding me at the company and answering all my doubts with patience. I would

also like to thank my Internal Guide Mr. Vihang N Patel for helping us through our internship

by giving us the necessary suggestions and advices along with their valuable co-ordination in

completing this internship.

I also thank my parents, friends and all the members of the family for their valuable support

and encouragement which they had provided in completion of our work. Furthermore, we

would also like to mention the company personals who gave us the permission to use and

experience the valuable resources required for the internship.

Thank You,

Rahulkumar Shiyani.

Gujarat Technological University v Babaria Institute of Technology

Team ID: 257910 190050131560

ABSTRACT

The objective of this 20-days Full Stack Development internship was to understand the business
needs of the organization and to develop an understandable website from what we learned.
This includes everything from the starting web design of the website to the back-end functioning
of the website.

PHP is a server side web programming language that is widely used for web development.
MySql currently is the most popular open source database server in existence.

I have just completed the various projects in PHP and MySql which are having many
application and features such as add post for the website in PHP, a custom search engine for
the website in PHP, Registration Form, Login page with all kind of validation and also the
verification in the database, save data in phpmyadmin, fetch data, delete data, and updating
data in database and as well as in website.

My Internship includes usage of MySQL, PHP, HTML, CSS, JS and Designing in Figma. It can
allow you to add, delete, and edit the data into a database. The interface is very user friendly.
The data are well protected for personal use and allow the data to process fast as well.

Keywords

HTML, CSS, JavaScript, Bootstrap, PHP, MySQL, Figma

Gujarat Technological University vi Babaria Institute of Technology

Team ID: 257910 190050131560

LIST OF FIGURES
Fig. 4.1. Figma ..........................................................................................................................8

Fig. 4.2. XAMPP Server ...........................................................................................................9

Fig. 4.3. Output for the Supplier page .....................................................................................10

Fig. 4.4. Filling the details .......................................................................................................11

Fig. 4.5. Showing details in List ..............................................................................................12

Fig. 4.6. Select for delete the details .......................................................................................12

Fig. 4.7. Deleted ......................................................................................................................13

Fig. 4.8. Showing List Details Part 1 ......................................................................................13

Fig. 4.9. Showing List Details Part 2 ......................................................................................14

Fig. 4.10. Showing List Details Part 3 ....................................................................................14

Fig. 4.11. Showing List Details Part 4 ....................................................................................15

Fig. 4.12. Update Page ............................................................................................................16

Fig. 4.13. Update Fields ..........................................................................................................17

Fig. 4.14. Showing changes in List .........................................................................................18

Fig. 4.15. Creating Database Part 1 .........................................................................................19

Fig. 4.16. Creating Database Part 2 .........................................................................................20

Fig. 4.17. Showing values in Database ...................................................................................21

Fig. 4.18. Creating Another Database .....................................................................................22

Gujarat Technological University vii Babaria Institute of Technology

Team ID: 257910 190050131560

ABBREVIATIONS

 MERN MongoDB, Express, React, Node

 AWS Amazon Web Services

 XAMPP X-operating system, Apache, Mysql, Php, Perl

 SQL Structured Query Language

 CSS Cascading Style Sheet

 HTML HyperText Markup Language

 JS JavaScript

 PHP Hypertext Preprocessor

Gujarat Technological University viii Babaria Institute of Technology

 TABLE OF CONTENTS

Joining Letter ...........................................................................................................................iii

Completion Certificate .............................................................................................................iv
Acknowledgement .....................................................................................................................v
Abstract ....................................................................................................................................vi
List of Figures .........................................................................................................................vii

Chapter 1 Introduction ...........................................................................................................1

1.1 Daily Tasks and Activities

Chapter 2 Web Development .................................................................................................3

2.1 Introduction

Chapter 3 About Internship ...................................................................................................5

3.1 Internship Summary
3.2 Purpose
3.3 Scope
3.4 Roles and Responsibilities
3.5 Skills Learned

Chapter 4 Implementation .....................................................................................................7

4.1 Introduction
4.2 Figma
4.3 XAMPP
4.4 Output
4.4 Database

Chapter 5 Learning Experiences .........................................................................................23

5.1 Knowledge Gained
5.2 Soft Skills Acquired

Chapter 6 Conclusion and Future Work ............................................................................25

6.4 Conclusion
6.4 Future Work

Chapter 7 References ............................................................................................................26

Team ID: 257910 190050131560

CHAPTER 1: INTRODUCTION

1.1 DAILY TASKS AND ACTIVITIES

DAY ACTIVITY NAME OUTCOME

1 Deep Detailing Matching fields in Excel Sheet

2 Introduction to HTML,CSS and Learned Basics of

JavaScript HTML,CSS and JavaScript

3 Creating simple form Used different HTML tags

and CSS

4 Use of Figma Learned page designing using

Figma

5 Bootstrap Learned about bootstrap

6 Database in MySQL Acquired knowledge of

creating Database

7 Introduction to PHP Gain an understanding of

basic PHP

8 Connection between Database Learned how to connect

and backend language Database (phpMyAdmin) to

code (PHP)

Gujarat Technological University 1 Babaria Institute of Technology

Team ID: 257910 190050131560

9 Revised all the things for work on Practicing the same which I

the project had learned so far so I can

work on project

10 Designing insert page in Project Learned how to insert the

data

11 Designing list page in Project Showcase the data from the

insert and can delete the same

data

12 Exporting to PDF and Excel Inserted data can be seen in

Sheet from list the form of PDF and Excel

Sheet

13 Update/Edit the Design Update the wrong

information from the list if

needed

14 Solving error of Insert, List and Find different errors and

Update page solved them accordingly

15 Testing Checked all the web pages on

project whether it is done or

not and accordingly created

Excel Sheet of Insert, Delete

and Update

Gujarat Technological University 2 Babaria Institute of Technology

Team ID: 257910 190050131560

CHAPTER 2: WEB DEVELOPMENT

2.1 INTRODUCTION

Web development refers to the building, creating, and maintaining of websites. It includes
aspects such as web design, web publishing, web programming, and database management. It
is the creation of an application that works over the internet that is websites.

It can be classified into two ways: Front-end Development and Back-end Development

• Front-end Development: The part of a website that the user interacts directly is termed
as front-end. It is also referred to as the ‘client side’ of the application.

HTML: HTML stands for Hyper Text Markup Language. It is used to design the front-
end portion of web pages using markup language. It acts as a skeleton for a website
since it is used to make the structure of a website.

CSS: Cascading Style Sheets fondly referred to as CSS is a simply designed language
intended to simplify the process of making web pages presentable. It is used to style
our website.

JavaScript: JavaScript is a scripting language used to provide a dynamic behaviour to

our website. JavaScript is a scripting language used to provide a dynamic behaviour to
our website.

Bootstrap: Bootstrap is a free and open-source tool collection for creating responsive
websites and web applications. It is the most popular CSS framework for developing
responsive, mobile-first websites. Nowadays, the websites are perfect for all the
browsers (Chrome and Firefox) and for all sizes of screens (Desktop, Tablets and
Phones).

Front-end Frameworks:

• Bootstrap

• TailwindCSS

• ReactJS

Gujarat Technological University 3 Babaria Institute of Technology

Team ID: 257910 190050131560

• AngularJS

• VueJS

• Back-end Development: Backend is the server side of a website. It is the part of the
website that users cannot see and interact. It is the portion of software that does not
come in direct contact with the users. It is used to store and arrange data.

PHP: PHP is a server-side scripting language designed specifically for web

development.

Java: Java is one of the most popular and widely used programming language. It is
highly scalable.

Python: Python is a programming language that lets you work quickly and integrate
systems more efficiently.

NodeJS: Node.js is an open source and cross-platform runtime environment for

executing JavaScript code outside a browser.

Back-end Frameworks:

• Laravel

• Django

• ExpressJS

• Rails

• Spring

Gujarat Technological University 4 Babaria Institute of Technology

Team ID: 257910 190050131560

CHAPTER 3: ABOUT INTERNSHIP

3.1 INTERNSHIP SUMMARY

During the internship at CSI Software, I applied my web development skills for working on
project. It includes designing and building the website and also includes the back-end
programming. This internship helped me a lot as I learn new skills such as Problem-solving
and Logical Reasoning. It also taught me how to use industry-first approach for solving
problems of businesses from their point of view.

The internship consisted of work on various fields as per the requirements of the company. The
duration of the internship was of 20 days, dated from 20 Jun, 2022 to 09 Jul, 2022.

In the due course of my internship, I was introduced to design frameworks such as Bootstrap
and also got a basic understanding of JavaScript. I learnt how to debug my code and optimize
it so that it uses the least number of resources. I also learnt a few soft skills such as presentation
and negotiation.

3.2 PURPOSE

The purpose of this internship from my point of view was to learn new skills in the process of
my work and apply them in a meaningful way to solve a problem. From the company’s
perspective, it was to give me space to learn and adapt to industry standards of working and to
let me use those new skills to contribute to the company’s betterment. And explore myself into
the coding world.

3.3 SCOPE

The scope of web development has increased multifold in the past few decades. Earlier it was
used to build static webpages. Today, responsive & dynamic websites are just a part of the
spectrum of possibilities in the field of web development. Modern front-end and back-end
technologies and frameworks such as ReactJS, AngularJS, NodeJS, ExpressJS, Laravel, etc.
increase the scope of web development. Demand of MERN developer have been increasing
day by day.

Gujarat Technological University 5 Babaria Institute of Technology

Team ID: 257910 190050131560

3.4 ROLES AND RESPONSIBILITIES

• Work on a designated project independently and with minimum supervision.

• Get self-trained to analyze a website design such that it matches with the needs and
goals of the company.

• Research about the different aspects of web design such as design issues, suitable back-
end resources, company profile, industry study, etc.

• Testing the website after each completed iteration.

3.5 SKILLS LEARNED

• Figma

• HTML & CSS

• CSS frameworks such as Bootstrap.

• Website design theory and design issues.

• Efficient code management.

• Basic JavaScript.

• PHP

• MySQL

• phpMyAdmin

Gujarat Technological University 6 Babaria Institute of Technology

Team ID: 257910 190050131560

CHAPTER 4: IMPLEMENTATION

4.1 INTRODUCTION

Implementation of the whole website was done using the Visual Studio Code editor and
XAMPP server. Visual Studio Code was used to write, edit and run the code as it provides a
very efficient way and platform to write code. XAMPP server is a portable server application
created by Apache which was used to test the website on my laptop using my laptop as a
server. Before implementing the code designer have to do design using Figma. After
approving by the client programmer can start their work. Figma used by designer for
reference that website will look exactly like this. Before creating website Figma was used
and the following technologies were used in the creation of the website:

• HTML & CSS

• Bootstrap

• JavaScript

• PHP

• MySQL

• XAMPP

Gujarat Technological University 7 Babaria Institute of Technology

Team ID: 257910 190050131560

4.2 Figma

Fig. 4.1. Designing in Figma

Gujarat Technological University 8 Babaria Institute of Technology

Team ID: 257910 190050131560

4.3 XAMPP

Fig. 4.2. XAMPP Server

Gujarat Technological University 9 Babaria Institute of Technology

Team ID: 257910 190050131560

4.4 OUTPUT

Fig. 4.3. Output for the Supplier page

Gujarat Technological University 10 Babaria Institute of Technology

Team ID: 257910 190050131560

Fig. 4.4. Filling the details

Gujarat Technological University 11 Babaria Institute of Technology

Team ID: 257910 190050131560

Fig. 4.5. Showing details in List

Fig. 4.6. Select for delete the details

Gujarat Technological University 12 Babaria Institute of Technology

Team ID: 257910 190050131560

Fig. 4.7. Deleted

Fig. 4.8. Showing List Details Part 1

Gujarat Technological University 13 Babaria Institute of Technology

Team ID: 257910 190050131560

Fig. 4.9. Showing List Details Part 2

Fig. 4.10. Showing List Details Part 3

Gujarat Technological University 14 Babaria Institute of Technology

Team ID: 257910 190050131560

Fig. 4.11. Showing List Details Part 4

Gujarat Technological University 15 Babaria Institute of Technology

Team ID: 257910 190050131560

Fig. 4.12. Update Page

Gujarat Technological University 16 Babaria Institute of Technology

Team ID: 257910 190050131560

Fig. 4.13. Update Fields

Gujarat Technological University 17 Babaria Institute of Technology

Team ID: 257910 190050131560

Fig. 4.14. Showing changes in List

Gujarat Technological University 18 Babaria Institute of Technology

Team ID: 257910 190050131560

4.5 Database

Fig. 4.15. Creating Database Part 1

Gujarat Technological University 19 Babaria Institute of Technology

Team ID: 257910 190050131560

Fig. 4.16. Creating Database Part 2

Gujarat Technological University 20 Babaria Institute of Technology

Team ID: 257910 190050131560

Fig. 4.17. Showing values in Database

Gujarat Technological University 21 Babaria Institute of Technology

Team ID: 257910 190050131560

Fig. 4.18. Creating Another Database

Gujarat Technological University 22 Babaria Institute of Technology

Team ID: 257910 190050131560

CHAPTER 5: LEARNING EXPERIENCE

5.1 KNOWLEDGE GAINED

I have completed my 20 days’ internship in CSI SOFTWARE. Through this internship I was
exposed to various activities which were unknown to me and some other work which was
known to me. The company was welcoming and willing to help and guide me to succeed. I was
able to work on the things by my own after being given initial direction.

I learnt new things which were totally unknown for me like presentation and negotiation. I
acquired knowledge regarding different frameworks used in web development such as
Bootstrap. I enriched my knowledge on the subject and learnt different ways of implementing
the website building part. I feel that an internship is not to spoon feed the intern but to
encourage the intern to learn the things on their own. It is about learning the things and working
independently.

After completion of my internship, I got to know that having the capacity to work
independently with the little guidance provided is the very important in today’s professional
world.

5.2 SOFT SKILLS ACQUIRED

It was a great opportunity which I had got to improve my skills, and be a better skilled person
to fit into the professional life. Time management is an important skill I can say, where given
a task which should be able to complete it within the given time. It was my first experience in
the company where I got to know the set of protocols, about the communication with other
people, being professional while talking and also got to know how to behave, how to work as
a team, how to be sincere, how to work dedicatedly towards work and to make myself open to
learn new things.

Gujarat Technological University 23 Babaria Institute of Technology

Team ID: 257910 190050131560

CHAPTER 6: CONCLUSION AND FUTURE WORK

6.1 CONCLUSION

After completion of my internship training, I could understand more about the company
environment and helped to prepare myself to become skilled and more professional to fit into
the professional field. At first PHP seem complicated as any scripting language. But if you
preserve, PHP is an interesting language. One can also gain knowledge of server-side world.

At the beginning days of my internship, I was assigned to learn or gain advanced knowledge
about Web Development, and to study about company’s atmosphere.

To conclude with I learnt about Web Development and various Frameworks. I learned web
design and basic UI designing as well. And implemented according to Project requirements.

6.2 FUTURE WORK

I want to improve web design of pages and want to store data on a cloud like (AWS) insteadof
a database. Also, if possible, I will enhance my skills in making the given project more creative
with more designing and graphics. Learning has no limits, same way I will keep on learning
new things and ways to make my webpages more emphatic and precise to use for the users.

Now a day, security is main concern. Many websites leak user data without the permission of
user or if you want to use particular website so you have to accept their terms and condition.
So in Future I want to make a strong website, so that no one can hack my website and user
feels more protected while using my website.

Gujarat Technological University 24 Babaria Institute of Technology

Team ID: 257910 190050131560

CHAPTER 7: REFERENCES

• Stackoverflow: https://www.stackoverflow.com

• W3Schools: https://www.w3schools.com

• GeeksForGeeks:

https://www.geeksforgeeks.org/phpintroduction/?ref=lbp

• CodeWithHarry:

https://www.youtube.com/watch?v=6mbwJ2xhgzM&list=PLu0W_9lII9a

giCUZYRsvtGTXdxkzPyItg

https://youtube.com/playlist?list=PLu0W_9lII9aikXkRE0WxDt1vozo3hn

mtR

Gujarat Technological University 25 Babaria Institute of Technology