Front-End Web Development

Amman Baheti (1MS21CS012)

Hitesh Kumar (1MS21CS054)

Ankit Singh (1MS21EE069)

Aishwarya Bhagat (1MS21CS007)

Submitted as part of CIE for ECAEC510 (2023-24)

December 31, 2023

1
Contents

1 Front-End Web Development 5

1.1 Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
1.1.1 Why become a Front-End Developer? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
1.1.2 What does a Front-End Developer do? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
1.1.3 Where do I start? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6

2 Front-End Technologies 7
2.1 Tools used for Front-End Development . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
2.1.1 HyperText Markup Language (HTML) . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
2.1.2 Cascading Style Sheets (CSS) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
2.1.3 JavaScript (JS) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

3 Industries amenable to Web Development 9

3.1 Web Development in Healthcare: . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
3.2 Web Development in E-commerce . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
3.3 Web Development in Media and Entertainment . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11

4 Front-End Web Development Technology Stacks 12

5 Future Trends in Front-End Web Development 13

5.1 WebAssembly (Wasm) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
5.2 Progressive Web Apps (PWAs) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
5.3 Integration of Voice User Interfaces (VUI) and
Chatbots . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
5.4 Goals for Development . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14

6 LATEX. Code 16
6.1 LATEXCode . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16

2
List of Figures

1.1 Front-End Web Development . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5

2.1 HyperText Markup Language (HTML) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7

2.2 Cascading Style Sheets (CSS) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
2.3 JavaScript (JS) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8

3.1 Web Development in E-commerce . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10

3.2 Web Development in Media and Entertainment . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11

3
List of Tables

4.1 Comparison of Front-end Web Development Technology Stacks . . . . . . . . . . . . . . . . . . . 12

4
Chapter 1

Front-End Web Development

1.1 Introduction
Front-End Web Development uses HTML, CSS, and JavaScript to create a website’s graphical user interface and
experience so that users can view and interact with that website. HTML provides the structure, CSS handles
presentation and layout, and JavaScript adds interactivity. Front-end developers ensure responsive design for various
devices and collaborate with back-end developers for dynamic content and data exchange.

Figure 1.1: Front-End Web Development

5
1.1.1 Why become a Front-End Developer?
• It is a popular job, and everyone can become a Front-End Developer.

• It is fun and creative.

• It is flexible - you can work from anywhere!

• Many companies are looking for Front-End Developers.

1.1.2 What does a Front-End Developer do?

• A Front-End Developer is someone who creates websites and web applications.

• The Front-End Developer creates things that the user sees.

• The main responsibility of a Front-End Developer is the User interface. Simply put, create things that the user
sees.

• The difference between Front-End and Back-End is that Front-End refers to how a web page looks, while the
back-end refers to how it works. You also think of the Front-End as the client side and the Back-End as the
server side.

1.1.3 Where do I start?

• HTML, CSS, and JavaScript are the basic languages you need to know to create a website.

• To become a Front-End Developer, read the next chapter.

• You have to code to learn how to code. Practice a lot!

6
Chapter 2

Front-End Technologies

2.1 Tools used for Front-End Development

Modern frameworks like React, Angular, and Vue.js streamline the development process, allowing for visually appeal-
ing, interactive, and responsive websites that enhance the user’s browsing experience. There are several tools and
platforms, such as WordPress, Joomla, and Drupal, available that can be used to develop the front end of a website.

2.1.1 HyperText Markup Language (HTML)

Figure 2.1: HyperText Markup Language (HTML)

HyperText Markup Language (HTML) is the backbone of any website development process, without which a web
page does not exist. Hypertext means that text has links, termed hyperlinks, embedded in it. When a user clicks on
a word or a phrase that has a hyperlink, it will bring another web page. A markup language indicates text can be
turned into images, tables, links, and other representations. It is the HTML code that provides an overall framework
of how the site will look. HTML was developed by Tim Berners-Lee. The latest version of HTML is called HTML5
and was published on October 28, 2014, by the W3C recommendation. This version contains new and efficient ways
of handling elements such as video and audio files.

2.1.2 Cascading Style Sheets (CSS)

Cascading Style Sheets (CSS) controls the presentation aspect of the site and allows your site to have its own unique
look. It does this by maintaining style sheets that sit on top of other style rules and are triggered based on other
inputs, such as device screen size and resolution. The CSS can be added externally, internally, or embedded in the
HTML tags.

7
Figure 2.2: Cascading Style Sheets (CSS)

2.1.3 JavaScript (JS)

JavaScript is an event-based imperative programming language (as opposed to HTML’s declarative language model)
that is used to transform a static HTML page into a dynamic interface. JavaScript code can use the Document
Object Model (DOM), provided by the HTML standard, to manipulate a web page in response to events, like user
input. Using a technique called AJAX, JavaScript code can also actively retrieve content from the web (independent
of the original HTML page retrieval), and also react to server-side events as well, adding a truly dynamic nature to
the web page experience.

Figure 2.3: JavaScript (JS)

8
Chapter 3

Industries amenable to Web

Development

Web development is crucial across industries, reshaping business operations in the digital era.E-commerce relies
on it for visually engaging stores and secure transactions. Healthcare benefits from patient portals and telemedicine
solutions. Education leverages e-learning platforms and interactive materials. The travel sector uses web development
for seamless booking and personalized recommendations. Additionally, web development enhances finance with secure
online banking and investment platforms. These industries connect, streamline processes, and deliver exceptional
user experiences with web development’s versatility.

3.1 Web Development in Healthcare:

Web development plays a crucial role in the healthcare sector by enabling patient portals, appointment scheduling,
telemedicine platforms, and access to medical information, improving patient care and communication.

• Patient Portals and Online Communication: Web development enable the creation of secure and user-friendly
patient portals, allowing healthcare providers to share medical records, test results, and treatment plans with
patients.
Through these portals, patients can conveniently schedule appointments, access telemedicine services, and
communicate with their healthcare providers, enhancing the overall patient experience and engagement.

• Access to Medical Information and Resources: Web development facilitates the development of healthcare web-
sites and platforms that offer valuable medical information, educational resources, and preventive care guidelines
to the public.

9
3.2 Web Development in E-commerce

Figure 3.1: Web Development in E-commerce

The e-commerce industry relies on web development to create visually appealing and user friendly online stores,
implement secure payment gateways, manage product catalogs, and optimize the shopping experience for customers.

• Online Storefronts and User Experience: Web development is crucial for creating visually appealing and func-
tional online storefronts in the e-commerce sector. A well designed e-commerce website enhances the overall
user experience, leading to higher customer satisfaction and increased conversion rates.

• Inventory Management and Order Processing: Web development allow efficient inventory management systems
and order processing functionalities. Through web based tools, businesses can manage inventory levels, track
product availability and ensure timely delivery of products to customers.

10
3.3 Web Development in Media and Entertainment

Figure 3.2: Web Development in Media and Entertainment

In the media and entertainment industry, web development is vital for creating captivating content platforms,
media streaming services, interactive storytelling websites, and engaging user interfaces, offering an immersive and
entertaining experience to users.

• Responsive Design for Multi-Device Access: Web development ensures responsive design, allowing media and
entertainment content to be accessed seamlessly across various devices, including desktops, smartphones,
tablets, and smart TVs.
Responsive web development enhances user experience by adapting the layout and content presentation to fit
different screen sizes and resolutions, catering to the preferences of modern audiences who consume media
content on the go.

• Interactive Storytelling and User Engagement: Web development enable the implementation of interactive sto-
rytelling elements, such as quizzes, polls, and user generated content, that actively engage audiences and
encourage participation. Websites and applications in this industry incorporate dynamic features like comment
sections, ratings, and social media integration to foster user interaction and community building around media
content.

11
Chapter 4

Front-End Web Development

Technology Stacks

Front-end web development offers a variety of technology stacks, each with its strengths and purposes. React, a
JavaScript library, emphasizes component-based architecture, enabling developers to build reusable UI components
and maintain scalable applications.
Vue.js, another JavaScript framework, stands out for its simplicity and flexibility, making it easy to integrate with
existing projects and gradually adopt its features. On the other hand, Angular, a comprehensive JavaScript framework
by Google, provides an all-in-one solution with a wide range of features and tools for building complex applications.
Developers choose between these stacks based on their project requirements, team expertise, and the desired level of
flexibility and complexity, ensuring they deliver efficient, interactive, and visually appealing front-end experiences.

Table 4.1: Comparison of Front-end Web Development Technology Stacks

Technology Description Pros Cons

React JavaScript library for Component reusabil- Steeper learning
building UI components ity curve
Vue.js Progressive JavaScript Lightweight and Smaller ecosystem
framework easy integration
Angular Front-end JavaScript Comprehensive fea- More complex than
framework by Google tures other options

12
Chapter 5

Future Trends in Front-End Web

Development

5.1 WebAssembly (Wasm)

WebAssembly is a binary instruction format that allows developers to run high-performance code written in languages
like C, C++, and Rust directly in web browsers. It enables faster loading times and smoother animations, making
web applications more responsive and efficient. WebAssembly unlocks new possibilities for complex web applications
and games, as it provides near-native performance without requiring users to download large plugins.

5.2 Progressive Web Apps (PWAs)

PWAs are web applications that offer users a native app-like experience on the web. They work offline, provide
push notifications, and load quickly, even on slow or unreliable networks. PWAs are highly engaging and accessible,
especially on mobile devices, as users can install them on their home screens without going through app stores. The
adoption of PWAs is on the rise due to their ability to bridge the gap between traditional web and native mobile
applications.

13
5.3 Integration of Voice User Interfaces (VUI) and
Chatbots
VUIs and chatbots are increasingly integrated into websites and applications to enhance user interactions. VUIs enable
users to interact with web content using voice commands, while chatbots provide real time conversational interfaces
for customer support, information retrieval, and personalized recommendations. These technologies leverage AI and
natural language processing to create more interactive and user-friendly experiences.

5.4 Goals for Development

The developer of the front end keeps these points in mind, utilizing available tools and techniques to reach this end.

Accessibility
With continuing development for mobile devices, such as smartphones and tablets, designers need to ensure that
their site comes up correctly in browsers on all devices. This can be done by creating a responsive web design using
stylesheets in CSS.

Performance
Performance goals are chiefly concerned with rendering time and manipulating the HTML, CSS, and JavaScript to
ensure that the site opens up quickly.

Speedy development
This technology enables speedy development and saves time.

14
Bibliography

[1] Jon Duckett - ”HTML and CSS: Design and Build Websites”

[2] Eric Freeman & Elisabeth Robson - ”Head First JavaScript Programming”

[3] Dr. Angela Yu - ”The Complete 2023 Web Development Bootcamp”

[4] MDN (2020-05-02). ”Front-end web developer”. Mozilla Developer. Retrieved 2022-07-04.

[5] Refsnes Data (1999-07-04). ”Web Development Roadmaps”. w3schools. Retrieved 2022-07-04.

[6] Refsnes Data (1999-07-04). ”How To Become a Front-End Developer”. w3schools. Retrieved 2022-07-04.

[7] Refsnes Data (1999-07-04). ”Front end development”. w3schools. Retrieved 2022- 07-04.

[8] Codesido, Ivan (28 September 2009). ”What is front-end development?”. Theguardian.com. Retrieved 17
January 2019.

[9] Abed, Sudad (2019). ”Inserting CSS” (PDF).

15
Chapter 6

LATEX. Code

6.1 LATEXCode
\documentclass{report}
\usepackage[utf8]{inputenc}
\usepackage{graphicx}
\usepackage{booktabs}
\usepackage{setspace}
\usepackage[backend=biber]{biblatex}
\addbibresource{references.bib}
\usepackage{geometry}
\geometry{
a4paper,
total={170mm,257mm},
left=20mm,
top=20mm,
}
\setstretch{1.3}
\begin{document}
\begin{center}
\begin{figure}[h]
\centering
\includegraphics[width = 0.8\textwidth]{logo.jpg}
\end{figure}
\LARGE
\vspace{2cm}\textbf{\fontfamily{put}\selectfont{\Huge Front-End Web Development}}
\end{center}
\begin{center}
\large
\vspace{3cm}\textbf{Amman Baheti (1MS21CS012)}\\
\vspace{0.5cm}\textbf{Hitesh Kumar (1MS21CS054)}\\
\vspace{0.5cm}\textbf{Ankit Singh (1MS21EE069)}\\
\vspace{0.5cm}\textbf{Aishwarya Bhagat (1MS21CS007)}
\end{center}
\begin{center}

16
\large
\vspace{5cm}\textit{Submitted as part of CIE for ECAEC510 (2023-24)}\\
\today
\end{center}
\newpage
\tableofcontents
\newpage
\listoffigures
\newpage
\listoftables
\newpage
\chapter{Front-End Web Development}
\section{Introduction}
\sffamily{Front-End Web Development uses HTML, CSS, and JavaScript to create a website’s
graphical user interface and experience so that users can view and interact with that website.
HTML provides the structure, CSS handles presentation and layout, and JavaScript adds
interactivity. Front-end developers ensure responsive design for various devices and
collaborate with back-end developers for dynamic content and data exchange.}
\begin{figure}[h]
\centering
\includegraphics[width = 0.5\textwidth]{frontend.png}
\caption{Front-End Web Development}
\label{fig:frontend}
\end{figure}
\newpage
\subsection{Why become a Front-End Developer?}
\begin{itemize}
\item It is a popular job, and everyone can become a Front-End Developer.
\item It is fun and creative.
\item It is flexible - you can work from anywhere!
\item Many companies are looking for Front-End Developers.
\end{itemize}
\subsection{What does a Front-End Developer do?}
\begin{itemize}
\item A Front-End Developer is someone who creates websites and web applications.
\item The Front-End Developer creates things that the user sees.
\item The main responsibility of a Front-End Developer is the User interface. Simply put,
create things that the user sees.
\item The difference between Front-End and Back-End is that Front-End refers to how a web
page looks, while the back-end refers to how it works. You also think of the Front-End as the
client side and the Back-End as the server side.
\end{itemize}
\subsection{Where do I start?}
\begin{itemize}
\item HTML, CSS, and JavaScript are the basic languages you need to know to create a
website.
\item To become a Front-End Developer, read the next chapter.

17
\item You have to code to learn how to code. Practice a lot!
\end{itemize}
\chapter{Front-End Technologies}
\section{Tools used for Front-End Development}
Modern frameworks like React, Angular, and Vue.js streamline the development process,
allowing for visually appealing, interactive, and responsive websites that enhance the user’s
browsing experience. There are several tools and platforms, such as WordPress, Joomla, and
Drupal, available that can be used to develop the front end of a website.
\subsection{HyperText Markup Language (HTML)}
\begin{figure}[h]
\centering
\includegraphics[width = 0.2\textwidth]{html.png}
\caption{HyperText Markup Language (HTML)}
\label{fig:HTML}
\end{figure}
HyperText Markup Language (HTML) is the backbone of any website development process,
without which a web page does not exist. Hypertext means that text has links, termed
hyperlinks, embedded in it. When a user clicks on a word or a phrase that has a hyperlink, it
will bring another web page. A markup language indicates text can be turned into images,
tables, links, and other representations. It is the HTML code that provides an overall
framework of how the site will look. HTML was developed by Tim Berners-Lee. The latest
version of HTML is called HTML5 and was published on October 28, 2014, by the W3C
recommendation. This version contains new and efficient ways of handling elements such as
video and audio files.\\
\\
\\
\subsection{Cascading Style Sheets (CSS)}
Cascading Style Sheets (CSS) controls the presentation aspect of the site and allows your site
to have its own unique look. It does this by maintaining style sheets that sit on top of other
style rules and are triggered based on other inputs, such as device screen size and resolution.
The CSS can be added externally, internally, or embedded in the HTML tags.
\begin{figure}[h]
\centering
\includegraphics[width = 0.2\textwidth]{css.png}
\caption{Cascading Style Sheets (CSS)}
\label{fig:HTML}
\end{figure}
\subsection{JavaScript (JS)}
JavaScript is an event-based imperative programming language (as opposed to HTML’s
declarative language model) that is used to transform a static HTML page into a dynamic
interface. JavaScript code can use the Document Object Model (DOM), provided by the HTML
standard, to manipulate a web page in response to events, like user input.
Using a technique called AJAX, JavaScript code can also actively retrieve content from the web
(independent of the original HTML page retrieval), and also react to server-side events as well,
adding a truly dynamic nature to the web page experience.
\begin{figure}[h]
\centering

18
\includegraphics[width = 0.2\textwidth]{js.png}
\caption{JavaScript (JS)}
\label{fig:HTML}
\end{figure}
\chapter{Industries amenable to Web Development}
Web development is crucial across industries, reshaping business operations in the digital era.E-commer
benefits from patient portals and telemedicine solutions. Education leverages e-learning
platforms and interactive materials. The travel sector uses web development for seamless
booking and personalized recommendations. Additionally, web development enhances
finance with secure online banking and investment platforms. These industries connect,
streamline processes, and deliver exceptional user experiences with web development’s
versatility.
\section{Web Development in Healthcare:}
Web development plays a crucial role in the healthcare sector by enabling patient portals,
appointment scheduling, telemedicine platforms, and access to medical information,
improving patient care and communication.\begin{itemize}
\item \underline{Patient Portals and Online Communication:} Web development enable the
creation of secure and user-friendly patient portals, allowing healthcare providers to share
medical records, test results, and treatment plans with patients. \\Through these portals,
patients can conveniently schedule appointments, access telemedicine services, and
communicate with their healthcare providers, enhancing the overall patient experience and
engagement.
\item \underline{Access to Medical Information and Resources:} Web development facilitates
the development of healthcare websites and platforms that offer valuable medical
information, educational resources, and preventive care guidelines to the public.
\end{itemize}
\newpage
\section{Web Development in E-commerce}
\begin{figure}[h]
\centering
\includegraphics[width = 0.5\textwidth]{Screenshot 2023-12-31 115231.png}
\caption{ Web Development in E-commerce }
\label{fig: Web Development in E-commerce}
\end{figure}
The e-commerce industry relies on web development to create visually appealing and user friendly online
optimize the shopping experience for customers.
\begin{itemize}
\item \underline{Online Storefronts and User Experience:} Web development is crucial for
creating visually appealing and functional online storefronts in the e-commerce sector. A well designed
customer satisfaction and increased conversion rates.
\item \underline{Inventory Management and Order Processing:} Web development allow
efficient inventory management systems and order processing functionalities. Through web based tools, b
timely delivery of products to customers.
\end{itemize}
\newpage
\section{Web Development in Media and Entertainment}
\begin{figure}[h]

19
\centering
\includegraphics[width = 0.5\textwidth]{Web Development in Media and Entertainment.jpeg}
\caption{ Web Development in Media and Entertainment}
\label{fig: Web Development in Media and Entertainment}
\end{figure}
In the media and entertainment industry, web development is vital for creating captivating content plat
user interfaces, offering an immersive and entertaining experience to users.
\begin{itemize}
\item \underline{Responsive Design for Multi-Device Access:} Web development ensures
responsive design, allowing media and entertainment content to be accessed seamlessly
across various devices, including desktops, smartphones, tablets, and smart TVs. \\Responsive
web development enhances user experience by adapting the layout and content presentation
to fit different screen sizes and resolutions, catering to the preferences of modern audiences
who consume media content on the go.
\item \underline{Interactive Storytelling and User Engagement:} Web development enable
the implementation of interactive storytelling elements, such as quizzes, polls, and user generated con
applications in this industry incorporate dynamic features like comment sections, ratings, and
social media integration to foster user interaction and community building around media
content.
\end{itemize}
\chapter{Front-End Web Development Technology Stacks}
Front-end web development offers a variety of technology stacks, each with its strengths and
purposes. React, a JavaScript library, emphasizes component-based architecture, enabling
developers to build reusable UI components and maintain scalable applications. \\
Vue.js, another JavaScript framework, stands out for its simplicity and flexibility, making it
easy to integrate with existing projects and gradually adopt its features. On the other hand,
Angular, a comprehensive JavaScript framework by Google, provides an all-in-one solution
with a wide range of features and tools for building complex applications.\\
Developers choose between these stacks based on their project requirements, team
expertise, and the desired level of flexibility and complexity, ensuring they deliver efficient,
interactive, and visually appealing front-end experiences.
\begin{table}[ht]
\centering
\caption{Comparison of Front-end Web Development Technology Stacks}
\vspace{0.3 cm}
\begin{tabular}{l p{3.5cm} p{3cm} p{3cm}}
\toprule
Technology& Description & Pros & Cons\\
\midrule
React & \sffamily{JavaScript library for building UI components} & \sffamily{Component
reusability} & \sffamily{Steeper learning curve} \\
Vue.js & \sffamily{Progressive JavaScript framework} & \sffamily{Lightweight and easy
integration} & \sffamily{Smaller ecosystem} \\
Angular & \sffamily{Front-end JavaScript framework by Google} & \sffamily{Comprehensive
features} & \sffamily{More complex than other options} \\
\bottomrule
\end{tabular}

20
\end{table}
\chapter{Future Trends in Front-End Web Development}
\section {WebAssembly (Wasm)} WebAssembly is a binary instruction format that allows
developers to run high-performance code written in languages like C, C++, and Rust directly in
web browsers. It enables faster loading times and smoother animations, making web
applications more responsive and efficient. WebAssembly unlocks new possibilities for
complex web applications and games, as it provides near-native performance without
requiring users to download large plugins.
\section {Progressive Web Apps (PWAs)} PWAs are web applications that offer users a native app-like exp
quickly, even on slow or unreliable networks. PWAs are highly engaging and accessible,
especially on mobile devices, as users can install them on their home screens without going
through app stores. The adoption of PWAs is on the rise due to their ability to bridge the gap
between traditional web and native mobile applications.
\newpage
\section {Integration of Voice User Interfaces (VUI) and \\Chatbots} VUIs and chatbots are
increasingly integrated into websites and applications to enhance user interactions. VUIs
enable users to interact with web content using voice commands, while chatbots provide real time conver
recommendations. These technologies leverage AI and natural language processing to create
more interactive and user-friendly experiences.
\section{Goals for Development}
The developer of the front end keeps these points in mind, utilizing available tools and
techniques to reach this end.\\
\\
\textbf{Accessibility}\\
With continuing development for mobile devices, such as smartphones and tablets, designers
need to ensure that their site comes up correctly in browsers on all devices. This can be done
by creating a responsive web design using stylesheets in CSS.\\
\\
\textbf{Performance}\\
Performance goals are chiefly concerned with rendering time and manipulating the HTML,
CSS, and JavaScript to ensure that the site opens up quickly.\\
\\
\textbf{Speedy development}\\
This technology enables speedy development and saves time.\\
\newpage
\begin{thebibliography}{100}
\bibitem@Jon Duckett - "HTML and CSS: Design and Build Websites"
\bibitem@Eric Freeman \& Elisabeth Robson - "Head First JavaScript Programming"
\bibitem@Dr. Angela Yu - "The Complete 2023 Web Development Bootcamp"
\bibitem@MDN (2020-05-02). "Front-end web developer". Mozilla Developer. Retrieved
2022-07-04.
\bibitem@Refsnes Data (1999-07-04). "Web Development Roadmaps". w3schools. Retrieved
2022-07-04.
\bibitem@Refsnes Data (1999-07-04). "How To Become a Front-End Developer". w3schools.
Retrieved 2022-07-04.
\bibitem@Refsnes Data (1999-07-04). "Front end development". w3schools. Retrieved 2022-
07-04.

21
\bibitem@Codesido, Ivan (28 September 2009). "What is front-end development?".
Theguardian.com. Retrieved 17 January 2019.
\bibitem@Abed, Sudad (2019). "Inserting CSS" (PDF).
\end{thebibliography}
\chapter{\LaTeX. Code}
\section{\LaTeX Code}
\end{document}

22