ASSIGNMENT 1 FRONT SHEET

Qualification BTEC Level 5 HND Diploma in Computing

Unit number and title 10: Website Design & Development

Submission date Date Received 1st submission

Re-submission Date Date Received 2nd submission

Student Name Phung Huu Minh Khanh Student ID GDD210033

Class GCD1102 Assessor name Phyo Myn Tun

Student declaration

I certify that the assignment submission is entirely my own work and I fully understand the consequences of plagiarism. I understand
that making a false declaration is a form of malpractice.

Student’s signature Km

Grading grid

P1 P2 P3 P4 M1 M2 M3 D1

GDD210033 PHÙNG HỮU MINH KHÁNH 1

❒ Summative Feedback: ❒ Resubmission Feedback:

Grade: Assessor Signature: Date:

GDD210033 PHÙNG HỮU MINH KHÁNH 2

Signature & Date:

Table of Contents
I. Domain name system (DNS)........................................................................................................................................................................... 6
1. Explain the concept of DNS ............................................................................................................................................................................ 6
2. Purpose of DNS .............................................................................................................................................................................................. 6
3. Types of DNS Server ....................................................................................................................................................................................... 7
3.1. DNS Recursive Resolver:.......................................................................................................................................................................... 7
3.2. DNS Root Name Server:........................................................................................................................................................................... 8
3.3. TLD Name Server: ................................................................................................................................................................................... 9
4. How domain names are organized and managed ..........................................................................................................................................11
II. Explanation of web element .........................................................................................................................................................................11
1. Communication protocols .............................................................................................................................................................................11
2. Server hardware ...........................................................................................................................................................................................13
3. Operating systems ........................................................................................................................................................................................16
4. Web server software.....................................................................................................................................................................................18
A. Apache HTTP server: .............................................................................................................................................................................19
B. Microsoft Internet Information Services (IIS): ........................................................................................................................................20
C. LightTPD:...............................................................................................................................................................................................21

GDD210033 PHÙNG HỮU MINH KHÁNH 3

 D. Jigsaw Server:........................................................................................................................................................................................22
5. Explain the relationship between technologies above with regards to design, publish and accessing a website.............................................22
III. Website technologies................................................................................................................................................................................24
1. Explanation of static and dynamic web .........................................................................................................................................................24
1.1. Static web ..............................................................................................................................................................................................24
1.2. Dynamic web .........................................................................................................................................................................................25
1.3. The differences between a static and dynamic web:...............................................................................................................................26
2. Drive to front-end and back-end technologies ..............................................................................................................................................27
2.1 Frontend ...........................................................................................................................................................................................28
2.2 Backend ............................................................................................................................................................................................28
3. Clarify the capabilities and relationship front-end and back-end ...................................................................................................................29
IV. Online creation tools and custom-built .....................................................................................................................................................30
1. Examples of online creation tool ...................................................................................................................................................................30
A. WIX.com (https://www.wix.com) ..........................................................................................................................................................30
B. WordPress (https://wordpress.com) .....................................................................................................................................................32
2. Comparison table:.........................................................................................................................................................................................33

GDD210033 PHÙNG HỮU MINH KHÁNH 4

List of Figures
Figure 1: DNS Recursive Resolver. .......................................................................................................................................................................... 7
Figure 2: DNS Root Name Server............................................................................................................................................................................ 8
Figure 3: TLD Name Server. ................................................................................................................................................................................... 9
Figure 4: Apache HTTP server. ..............................................................................................................................................................................19
Figure 5: Microsoft Internet Information Services (IIS). .........................................................................................................................................20
Figure 6: LightTPD. ...............................................................................................................................................................................................21
Figure 7: Jigsaw Server. ........................................................................................................................................................................................22
Figure 8: WIX.com. ...............................................................................................................................................................................................30
Figure 9: WordPress. ............................................................................................................................................................................................32

List of Tables
Table 1: Table of between static and dynamic web pages. ....................................................................................................................................27
Table 2: Table of Comparison. ..............................................................................................................................................................................34

GDD210033 PHÙNG HỮU MINH KHÁNH 5

I. Domain name system (DNS)(P1)
1. Explain the concept of DNS

The DNS is a database of domain name and IP address records that helps browsers to discover the correct IP address that
corresponds to a hostname URL typed into it. When we want to access a website, we usually put its domain name into the web
browser, such as cdnetworks.com, wired.com, or nytimes.com. Web browsers, on the other hand, require specific IP addresses
to load content for the website. The DNS is responsible for converting domain names to IP addresses so that resources may be
loaded from the website's server (CD Networks, 2021).

Websites may have multiple IP addresses corresponding to a single domain name. Large sites, such as Google, will have people
requesting a server from all over the world. Even though the site name typed in the browser is the same, the server that a
computer in Singapore tries to query will most likely be different from the one that a computer in Toronto tries to access. DNS
caching comes into play here (CD Networks, 2021).

2. Purpose of DNS

The Domain Name System (DNS) Server is a server that matches website hostnames (such as example.com) to their associated
Internet Protocol or IP addresses. The DNS server keeps a database of public IP addresses and the domain names that belong
to them. According to the IPv4 or IPV6 protocols, each device connected to the internet has a unique IP address that aids in
identification. The same is true for web servers, which function as hosts for websites (CD Networks, 2021).

DNS servers assist us to avoid memorizing such long numbers as IP addresses (and even more complex alphanumeric ones in
the IPV6 system) by automatically translating the website names we type into the browser address bar into these numbers,
allowing the servers to load the correct web pages (CD Networks, 2021).

GDD210033 PHÙNG HỮU MINH KHÁNH 6

 3. Types of DNS Server

DNS servers are classified into four types: recursive resolvers, root nameservers, TLD nameservers, and authoritative
nameservers. In a normal DNS lookup (where there is no caching in place), these four DNS servers collaborate to send the IP
address for a particular domain to the client (the client is usually a stub resolver - a simple resolver built into an operating
system) (CLOUDFLARE, 2021):

3.1. DNS Recursive Resolver:

Figure 1: DNS Recursive Resolver.

The first stop in a DNS query is a recursive resolver (also known as a DNS precursor). The recursive resolver serves as a
go-between for a client and a DNS nameserver. When a recursive resolver receives a DNS query from a web client, it
will either respond with cached data or send a request to a root nameserver, followed by another request to a TLD
nameserver, and finally to an authoritative nameserver.

The recursive resolver responds to the client after obtaining a response from the authoritative nameserver providing
the requested IP address. The recursive resolver will cache information obtained from authoritative name servers

GDD210033 PHÙNG HỮU MINH KHÁNH 7

 throughout this procedure. When a client asks for the IP address of a domain name that was previously requested by
another client, the resolver can avoid connecting with the nameservers and simply deliver the requested record from
its cache.

3.2. DNS Root Name Server:

Figure 2: DNS Root Name Server.

Every recursive resolver knows the 13 DNS root nameservers, and they are the initial step in a recursive resolver's search for DNS
records. A root server takes a recursive resolver query that contains a domain name, and the root nameserver replies by sending
the recursive resolver to a TLD nameserver depending on the domain's extension (.com, .net, .org, etc.). The Internet Corporation
for Assigned Names and Numbers (ICANN) is in charge of the root nameservers (ICANN).

It's worth noting that just because there are 13 root nameservers doesn't mean there are only 13 computers in the root
nameserver system. There are 13 different types of roots nameservers, but each one has several copies all around the world that
employ Anycast routing to offer fast answers. If you tallied up all the instances of root nameservers, you'd end up with 632 distinct
servers (as of October 2016).

GDD210033 PHÙNG HỮU MINH KHÁNH 8

 3.3. TLD Name Server:

Figure 3: TLD Name Server.

TLD Name Servers keep track of all domain names that share a common domain extension, such as .com, .net, or
whatever follows after the last dot in a URL. A.com TLD nameserver, for example, includes information for every
website that ends in '.com.' If a user searched for google.com, the recursive resolver would submit a query to a.com
TLD nameserver, which would answer by directing to the authoritative nameserver (see below) for that domain. The
Internet Assigned Numbers Authority (IANA), a division of ICANN, is in charge of managing TLD nameservers. The
IANA divides TLD servers into two categories:

 Generic top-level domains (TLDs) are domains that are not nation-specific; some of the most well-known
generic TLD include .com, .org, .net, .edu and.gov.
 Nation code top-level domains (ccTLDs) are any domains that are unique to a country or state .uk, .us, .ru and
.jp are some examples.

There is a third category for infrastructure domains, although it is rarely utilized. This category was designed for the.
arpa domain, which was a transitional domain used in the development of current DNS; its value now is primarily
historical.

GDD210033 PHÙNG HỮU MINH KHÁNH 9

GDD210033 PHÙNG HỮU MINH KHÁNH 10
 4. How domain names are organized and managed

Subdomains, which are subordinate tiers of the root domain of the Domain Name System, are used to arrange domain names.
Top-level domains (TLDs) are the first-level collection of domain names and include generic top-level domains (gTLDs) like
<.com=, <.net=, and <.org=, as well as country code top-level domains (ccTLDs). In the instances google.fr and google.com.au,
the ccTLDs are indicated to the right of the dot, such as <.fr= or <.au=. Second and third-level domain names, such as
DomainTools or Google, are classified as top- level domains in the DNS system. End users can often reserve these domains to
run websites, establish publicly accessible Internet resources, and link the Internet to local area networks. Second-level
domains often convey the name of the organization and/or are descriptive of the service offered, whereas third-level domains
typically point to a specific server inside an organization (DomainTools, 2021).

II. Explanation of web element. (P2)

1. Communication protocols
Communication protocols enable various network devices to communicate with one another. They are utilized in analog and digital
communications and may be used for various tasks ranging from moving information between devices to connecting to the internet
(CompTIA, 2021).

The Department of Defense (DoD) created and developed TCP/IP in the 1960s, and it is based on standard protocols. It is an
abbreviation for Transmission Control Protocol/Internet Protocol. TCP/IP is a condensed version of the OSI model. It has four layers,
as opposed to the OSI model's seven. The layers are as follows (GeeksforGeeks, 2020):

1.1. Network Access Layer: This layer is a mix of the OSI model's Data Link Layer and Physical Layer. It searches for hardware
addressing, and the protocols included at this layer enable physical data transfer.

GDD210033 PHÙNG HỮU MINH KHÁNH 11

 1.2. The Internet Layer: The same duties as the OSI Network Layer. It specifies the protocols that are in charge of logical
data transfer across the whole network. This layer's primary protocols are as follows:

1.3. IP: Stands for Internet Protocol, and it is in charge of sending packets from the source host to the destination host based
on the IP addresses in the packet headers. IP is available in two flavors: IPv4 and IPv6. The majority of websites are now
utilizing IPv4. However, IPv6 use is increasing since the quantity of IPv4 addresses is restricted in comparison to the
number of users.

 ICMP: An abbreviation for Internet Control Message Protocol. It is wrapped within IP datagrams and is in charge
of informing hosts about network difficulties.

 ARP: Address Resolution Protocol. Its job is to determine a host's hardware address from a known IP address.
ARP is classified into four types: reverse ARP, proxy ARP, gratuitous ARP, and inverse ARP.

2. Host-to-Host Layer: This layer is equivalent to the OSI model's Transport layer. It is in charge of end- to-end communication and
data delivery that is error-free. It protects upper-layer applications from data complexity. This layer has two major protocols:

 Transmission Control Protocol (TCP): This protocol is well-known sfor providing dependable and error-free
communication between end systems. It accomplishes data sequencing and segmentation. It also features an
acknowledgment function and manages data flow via a flow control mechanism. It is a very effective protocol,
but it has a lot of overhead as a result of these qualities. Increased overhead equals higher costs.

 User Datagram Protocol (UDP): On the other hand, it lacks such characteristics. It is the preferred protocol if your
application does not require dependable transit because it is highly cost-effective. In contrast to TCP, which is a
connection-oriented protocol, UDP is a connectionless protocol.

GDD210033 PHÙNG HỮU MINH KHÁNH 12

3. Application Layer: This layer fulfills the duties of the OSI model's top three layers: application, presentation, and session. It is in
charge of node-to-node communication as well as user-interface requirements. This layer includes protocols such as HTTP, HTTPS,
FTP, TFTP, Telnet, SSH, SMTP, SNMP, DNS, DHCP, NFS, X Window, and LPD. For further information on these protocols, see
Protocols in the Application Layer. Protocols that are not included in the linked article include:

 HTTP and HTTPS: HTTP is an abbreviation for Hypertext Transfer Protocol. The World Wide Web uses it to
coordinate connections between web browsers and servers. HTTPS is an abbreviation for HTTP-Secure. It is a
hybrid of HTTP and SSL (Secure Socket Layer). It is useful when the browser has to fill out forms, sign in,
authenticate, and conduct financial transactions.

 SSH: Secure Shell is an abbreviation for Secure Shell. It's a terminal emulation program comparable to Telnet.
Because of its capacity to maintain the encrypted connection, SSH is favored. It establishes a secure session over
a TCP/IP connection.

 NTP: is an abbreviation for Network Time Protocol. It is used to synchronize our computer's clocks to a single
standard time source. It is extremely handy in circumstances such as bank transactions. Consider the following
scenario in the absence of NTP.

2. Server hardware
The rapid expansion of cloud computing platforms, as well as the previous wave of virtualization, have drastically impacted
the function of the server in SMBs and businesses (Moore, 2020).

Type of server hardware and its purpose (Moore, 2020):

 Tower servers: A tower server is housed in an upright, stand-alone cabinet, similar to a tower-style PC. Because
of their low component density, these servers give the benefit of easier cooling. They are also quite affordable,
making them a viable solution for small firms with limited resources. Tower servers, on the other hand, require
more room than other servers’ kinds.

GDD210033 PHÙNG HỮU MINH KHÁNH 13

  Rack servers: A rack server, as the name implies, is intended to be installed on a server rack in a data center. Rack
servers frequently function as all-purpose computer nodes in data centers, serving a wide range of applications.
These servers are smaller than a tower server. Rack servers and server racks are designed to meet similar sizing
specifications, allowing servers from many suppliers to be stacked together. Engineers can also easily install new
servers or replace existing ones because of standardization. Cable management, on the other hand, maybe a
headache when it comes to managing rack servers, which are connected to power supply, networking equipment,
and storage devices.

 Blade servers: They are a small device that holds several thin, modular circuit boards known as server blades. Each
blade houses a single server, which is typically dedicated to a single application. Because blade servers are often
dedicated, administrators have better control over how they are accessed and data is transmitted between
devices. Blade servers have a higher processing density than other server models, which may provide a price and
performance benefit. Other advantages of blade servers include cooling (each blade is independently cooled by
fans), minimum wiring, low power consumption, and storage consolidation. Because of its hot-swappable,
modular components, blade server systems are also easier to repair than rack servers. On the negative, historically,
blade servers have been constructed on proprietary designs, making vendor lock-in a potential stumbling block
for consumers.

 Hyper-converged infrastructure (HCI): HCI systems attempt to provide a more user-friendly alternative to
traditional IT infrastructure by combining computational power, storage, and hypervisor technologies in a single
system. A mid-level data center engineer should be able to accomplish the duties of initial hardware
configuration, hypervisor deployment, and software-defined storage implementation in roughly an hour with a
typical hyper-convergence offering. Vendor goods have set up wizards for gathering the necessary information.
The majority of the implementation operations are automated.

 Mainframes: Client-server architectures were predicted to decimate mainframes in the 1990s, yet such high-end
servers still exist. Today's mainframes can handle high numbers of concurrent transactions and severe I/O loads

GDD210033 PHÙNG HỮU MINH KHÁNH 14

 without sacrificing speed. Typical mainframe customers include financial services organizations that execute
concurrent, real-time transactions. The fundamental disadvantages of mainframes are their size and cost.

GDD210033 PHÙNG HỮU MINH KHÁNH 15

 3. Operating systems
An operating system's objective is to offer a platform on which a user may execute applications conveniently and efficiently.
An operating system is a piece of software that oversees the allocation of computer hardware. The hardware coordination
must be suitable to ensure the proper operation of the computer system and prevent user programs from interfering with
the system's normal operation (Singh, 2021).

The following are some of the most important features of an operating system (Singh, 2021):

 Security: To safeguard user data, the operating system employs password protection and other similar measures. It
also protects applications and user data from illegal access.
 Control over system performance: Keeps an eye on the general health of the system in order to help it operate
better. To get a thorough picture of the system's health, keep track of the time between service requests and system
responses. This can aid performance by giving critical information for troubleshooting issues.
 Job accounting: System software This information may be used to measure resource utilization for a specific user or
group of users by keeping track of time and resources utilized by various tasks and users.
 Error detecting aids: The operating system continuously monitors the system in order to discover errors and prevent
a computer system from failing.
 Coordination between other software and users: Operating systems also organize and distribute interpreters,
compilers, assemblers, and other software to computer users.
 Memory Management: The operating system is in charge of managing the primary memory, also known as main
memory. Main memory is composed of a vast array of bytes or words, with each byte or word allocated a unique
address. The CPU can immediately access the main memory, which is rapid storage. A program must first be loaded
into the main memory before it can be run. For memory management, an operating system performs the following
tasks: It manages main memory, that is, which bytes of memory are used by which user program. Memory addresses
that have already been assigned and memory addresses that have not yet been used in multiprogramming, the

GDD210033 PHÙNG HỮU MINH KHÁNH 16

 operating system determines which processes have memory access and for how long. It allocates memory to a
process when it asks it and deals locate memory when the process terminates or performs an I/O activity.

GDD210033 PHÙNG HỮU MINH KHÁNH 17

  Processor Management: In a multi-programming environment, the operating system determines the sequence in
which programs access the processor and how much processing time each process gets. This OS operation is known
as process scheduling. For processor management, an operating system performs the following tasks. Maintains a
record of the status of processes. A traffic controller is a program that performs this function. Allocates a processor's
CPU to a process. When a process is no longer necessary, the processor is de-allocated.
 Device Management: An operating system handles device connectivity through its individual drivers. It manages
devices by doing the following tasks. It keeps track of all the devices that are linked to the system. The Input/Output
controller is software that is responsible for every device. Determines which processes have access to a certain device
and for how long. Devices are allocated effectively and efficiently. When a gadget is no longer needed, it is
deallocated.
 File Management: A file system is arranged into directories to facilitate efficient or simple navigation and usage.
These folders may include additional directories and files. The following file management tasks are performed by an
operating system. It keeps track of where information is kept, user access settings, and the condition of each file,
among other things... The file system is the name given to all of these features.

4. Web server software

A web server is software that handles network requests from users and serves them with files that generate web pages. The
Hypertext Transfer Protocol is used for this interaction (HTTP) (Gupta, 2019).

Web servers are basically machines that are used to store HTTP files that make up a website, and when a client requests a
certain website, it sends the requested website to the client. For example, suppose you wish to open Facebook on your laptop
and type the URL into Google's search field. Now, the laptop will submit an HTTP request to another computer known as the
webserver to access the Facebook webpage. This machine (webserver) holds all of the files (typically in HTTP format) that
comprise the website, such as text, pictures, gif files, and so on. Following the processing of the request, the web server will
deliver the required website- related files to your computer, allowing you to access the website (Gupta, 2019).

GDD210033 PHÙNG HỮU MINH KHÁNH 18

 Distinct websites can be kept on the same or different web servers, but this has no bearing on the website you are viewing on
your computer. The web server can be any type of software or hardware, although it is generally software that runs on a
computer. One web server can accommodate several users at the same time, which is necessary since otherwise there would
have to be a web server for each user, which is almost impossible given the present world population. A web server is never
disconnected from the internet because if it is, it would be unable to receive any requests and hence will not be able to process
them (Gupta, 2019).

There are several free and paid web servers accessible on the market. Some of them are as follows (Gupta, 2019):

A. Apache HTTP server:

Figure 4: Apache HTTP server.

It is the most widely used web server, with over 60% of the world's web server computers running it. The Apache
Software Foundation created the Apache HTTP web server. It is open-source software, which implies that we may
access and modify its code to shape it to our liking. The Apache Web Server is simple to install and use on practically
any operating system, including Linux, macOS, and Windows.

GDD210033 PHÙNG HỮU MINH KHÁNH 19

 B. Microsoft Internet Information Services (IIS):

Figure 5: Microsoft Internet Information Services (IIS).

Microsoft Internet Information Services (IIS) is a high-performance web server. It is tightly integrated with the
operating system and hence quite simple to manage. It was created by Microsoft, and it offers an excellent customer
support system that is easy to approach if there is a problem with the server. It has all of the functionality of the
Apache HTTP Server except that it is not open-source software and so its code is unavailable, which means we
cannot modify it to meet our needs. It is simple to install on any Windows device.

GDD210033 PHÙNG HỮU MINH KHÁNH 20

 C. LightTPD:

Figure 6: LightTPD.

An abbreviation for 'Lightly.' It presently powers around 0.1 percent of the world's websites. Lighttpd has a low CPU
burden and is hence significantly easy to run. It has a small memory footprint and hence requires less memory space
to execute than other web servers, which is always a plus. It also features speed optimizations, which means we
may optimize or adjust its performance based on our needs. It is open-source software, which implies that we may
access its code and modify it to meet our demands before uploading our own module (the changed code).

GDD210033 PHÙNG HỮU MINH KHÁNH 21

 D. Jigsaw Server:

Figure 7: Jigsaw Server.

Jigsaw was developed in Java and can execute both CGI (common gateway interference) scripts and PHP
applications. It is not a full-fledged server; rather, it was created as an experimental server to illustrate new web
protocols. It is open-source software, which implies that we may access its code and modify it to meet our
demands before uploading our own module (the changed code). It may be installed on any device that supports
the Java language and Java modifications.

5. Explain the relationship between technologies above with regards to design, publish and accessing a website
There are some concepts that we must understand clearly again (MND Web Docs, 2021):

− Your internet connection: This enables you to transmit and receive data via the internet.

− TCP/IP: Transmission Control Protocol and Internet Protocol are communication protocols that specify how data
should be sent over the internet.

− DNS: Domain Name Servers function similarly to an address book for websites. When you enter a web URL into your
browser, the browser consults the DNS to determine the website's true address before retrieving the webpage. The
browser must determine which server hosts the webpage to send HTTP messages to the correct location.

− HTTP: an application protocol that specifies a language for clients and servers to communicate with one another.

GDD210033 PHÙNG HỮU MINH KHÁNH 22

 − Component files: A website is comprised of several files. These files are classified into two types:

• Code files: Websites are typically developed with HTML, CSS, and JavaScript, while more technologies will be
included later.

• Assets: This is a catch-all term for anything else that makes up a website, such as photographs, audio, video,
Word documents, and PDFs.

When you enter a site URL into your browser (MND Web Docs, 2021):

 The browser connects to the DNS server to determine the true address of the server where the webpage is hosted.

 The browser sends an HTTP request message to the server, requesting that a copy of the website be sent to the
client. This message, as well as any other data communicated between the client and the server, is transmitted
through TCP/IP across your internet connection.

 If the server authorizes the client's request, it gives the client an email "200 OK" message, which says "Of course,
you may visit that website!" This is it ", and then begins transmitting the website's files to the browser in the form
of a series of little pieces known as data packets.

 The browser assembles the little parts into a whole web page and shows it to you.

When browsers submit requests to servers for HTML files, those HTML files frequently contain <link> elements that refer to
external CSS stylesheets and <script> elements that refer to external JavaScript scripts.

It's critical to understand the sequence in which those files are interpreted by the browser while the website loads (MND
Web Docs, 2021):

 The browser parses the HTML file first, which allows it to recognize any <link> to external CSS stylesheets and
scripts in the <script> element.

GDD210033 PHÙNG HỮU MINH KHÁNH 23

  As the browser parses the HTML, it sends requests to the server for any CSS files it finds from <link> elements and
any JavaScript files it finds from <script> elements and parses the CSS and JavaScript from those requests.

 The browser builds an in-memory DOM tree from the parsed HTML, a CSSOM structure from the parsed CSS, and
compiles and runs the parsed JavaScript.

 A visual representation of the page is painted on the screen when the browser creates the DOM tree, applies the
styles from the CSSOM tree, and runs the JavaScript. The user sees the page content and may begin to interact
with it.

III. Website technologies. (P3)

1. Explanation of static and dynamic web

1.1. Static web

In technical terms, a static website is created using HTML and CSS. It is made up of a collection of code files that are used to
represent the site's many physical pages. These websites are quick and simple to create. They are inexpensive and an excellent
alternative for small enterprises. A static website has the appearance of an online brochure, with forms and hyperlinks that
allow potential buyers to explore different pages on the screen. A static website’s pages, once built, will stay static and cannot
be modified or changed without coding knowledge. That instance, if a rookie business owner wants to change some content
on his or her static website, he or she must hire a website developer to do it (Admin, 2017)

Benefits (Admin, 2017):

GDD210033 PHÙNG HỮU MINH KHÁNH 24

  Time-saving: The main advantage of a static website is that it is easy to create. A static website may be created
significantly faster by a competent web developer than a dynamic one.
 Cost-effective: Static websites are less expensive to construct than dynamic ones. They are ideal for small enterprises
on a tight budget.
 Inexpensive Hosting: Static websites may have dedicated servers at a lower cost and with more convenience.
 Easy indexing: Because static websites are simply a collection of coded HTML or CSS files, search engines such as Google,
Bing, and others can quickly index them.
 Fast transferring: Because static websites do not have complicated architecture like dynamic websites, they can be sent
from server to client swiftly and effortlessly.

Hazards include (Admin, 2017):

 Difficult to change: The most significant disadvantage of a static website is that its content cannot be quickly modified.
The material cannot be updated by a beginner. To update, add, or replace any material on a static website, you'll need
the help of a web developer. Even a little adjustment to the website would necessitate changing all of the HTML files
separately.
 Not good for the long run: A static website is not suitable for the long run because any firm would want several upgrades
to keep up with the newest trends. To make modifications, one would have to modify each page file again, which can
use a lot of resources.
 Limited functionality: A static website does not provide all of the features that a dynamic website provides. A static
website can have text, photos, videos, and hyperlinks in its content, but it cannot perform any additional specific
activities.

1.2. Dynamic web

A dynamic website is created utilizing sophisticated server technologies such as PHP, JavaScript, or ASP to create more dynamic
web pages. By dynamic web pages, we mean pages that are interactive and alter dynamically based on time, region, and user
type. Dynamic websites can be linked to a huge database, allowing them to retrieve information as needed. This aids in the

GDD210033 PHÙNG HỮU MINH KHÁNH 25

 creation of a more user-driven page that adapts as the user desires. On a dynamic website, the content and information on
the page alter in response to user commands (Admin, 2017).

Advantages (Admin, 2017):

 Easy to update: The most significant benefit of a dynamic website is that it can be simply modified to meet the
demands of the business owner. There is no need for professional expertise to update the dynamic website, and a
single modification in the template file will result in a design change on all pages that use that file.
 Interactive: Dynamic websites interact with users and alter based on their actions.
 Quick responsiveness: A dynamic website can be quickly modified to become responsive to multiple screen sizes,
something a static website cannot.
 Smooth navigation: A dynamic website provides smoother navigation and allows the user to bounce from one page to
the next without difficulty.

Disadvantages include (Admin, 2017):

 Higher cost: Dynamic websites may be expensive to design, and the cost of hosting is often significant. However, once
constructed, they would not require any extra funding for upgrades or alterations.
 Slow processing: Because dynamic websites must execute a lot of operations using complicated technology, they are
slower to process and load.
1.3. The differences between a static and dynamic web:

The table below displays the distinction between static and dynamic web pages is as follows (Singh, 2020):
No. Static web page Dynamic web page
Pages in static web pages will remain The content of pages on dynamic websites varies
1 unchanged until manually changed. depending on the visitor.

GDD210033 PHÙNG HỮU MINH KHÁNH 26

 In terms of complexity, static web pages are Dynamic websites are difficult to understand.
2 simple.
Information on static websites is seldom The information on a dynamic web page change
3 changed. regularly.
Loading a static web page takes less time Loading a dynamic web page takes longer.
4 than loading a dynamic web page.
A database is not utilized in Static Web A database is utilized in dynamic websites.
5 Pages.
Static web pages are created using CGI, AJAX, ASP, ASP.NET, and other languages are
6 programming languages such as HTML, used to create dynamic web pages.
JavaScript, CSS, and others.
There is no application software on static Dynamic web pages include application programs
7 web pages. for various services.
Static web pages need less time and money Dynamic websites need a greater amount of time
8 to design. and money to design.
Table 1: Table of between static and dynamic web pages.

1.4. Conclusion

After considering the benefits and drawbacks of both dynamic and static websites, it is possible to conclude that a dynamic
website, albeit more expensive, is a preferable option for website creation. It is a one-time investment that may help any
internet business grow (Admin, 2017). These are some of the benefits and drawbacks of both dynamic and static websites.
The usefulness and resourcefulness of both sorts of websites are determined by individual demands and goals. Whereas some
individuals like the simplicity and comfort of static websites, others are enthralled by the deep functionality and intuitiveness
of dynamic websites. Both have pros and disadvantages (Admin, 2017).

2. Drive to front-end and back-end technologies

GDD210033 PHÙNG HỮU MINH KHÁNH 27

 2.1 Frontend

The frontend is the component of the website that you can view and interact with directly to access the system's
backend features. It includes everything the user can see, touch, and feel. The position of a web designer has evolved
significantly over time, but the essential duties of website creation have not. The frontend is all about the website's
bells and whistles, such as the graphical user interface, which includes flashy buttons, bright graphics, navigation
menus, and so on. The frontend is sometimes known as "client-side" since the activity occurs on the client-side, which
in this case is the user. A client is often the computer application that is viewing it, such as a web browser (Khillar, 2018).

The frontend is primarily the web browser, and everything the user sees and interacts with on the website is within the
purview of frontend development. Frontend development contributes to a better user experience in terms of design
and simplicity of use, and it is the responsibility of the web designer too, well, design websites. A web designer does
not work with coding. He is in charge of overseeing all parts of developing and revamping websites with both
aesthetically appealing features and a user-friendly design. A frontend developer's job is to create an environment that
the user can see and touch using a combination of technologies such as HTML, CSS, and JavaScript (Khillar, 2018).

2.2 Backend

The backend, commonly known as the "server-side," is the component of the website that you cannot view or interact
with. Backend web development is responsible for everything that happens behind the scenes. It all comes down to
how the website functions; it's more of an indirect service provider for frontend development. It is the component of
the system that has no direct interaction with the users. It operates on the server-side, as opposed to the frontend, but
communicates with it to verify everything is working properly. Every program has a considerable amount of non-user
interface code that deals with all the sophisticated processes in the background. Backend specialists are often
programmers and developers (Khillar, 2018).

GDD210033 PHÙNG HỮU MINH KHÁNH 28

 Backend developers are in charge of everything that does not require developing a user interface, such as writing APIs,
establishing libraries, or adding utility to whatever the web designer does. They improve communication between the
presentation and business layers. In contrast to frontend web designers, they play an important part in web
development and their position is very collaborative. In a nutshell, backend web development is the combination of
developing and maintaining a software application's basic functional logic. To put it simply, backend developers build
code to ensure that everything works properly on the frontend. They tend to spend more time than web designers
working out reasoning and applying algorithms to guarantee the website runs effectively. It is a website's central
processing unit (Khillar, 2018).

3. Clarify the capabilities and relationship front-end and back-end

The relationship can be explained that (Khillar, 2018):

 Meaning: The frontend of a website is the section that people can see and interact with, such as the graphical
user interface (GUI) and the command line, which includes the design, navigating menus, words, photos,
videos, and so on. The backend, on the other hand, is the component of the website that visitors cannot view
or interact with. It all comes down to how everything works.
 Role: Both are important in web development, and while they have their distinctions, they are like two sides of
the same coin. The visual parts of a website that a user may see and experience are referred to as the
frontend. Backend web development, on the other hand, is responsible for everything that happens in the
background. It's more of a frontend web experience enabler.
 Summary: While both the frontend and backend are essential to how a website functions, there are some
functional distinctions between them. Regardless, they are like two sides of the same coin. The former is
everything a user sees and interacts with, whereas the latter is everything a user cannot see. The client-side is
referred to as the frontend, whereas the server-side is referred to as the backend. Both are critical
components of web development, yet their roles, responsibilities, and working environments are very
different. The front end is what consumers see, but the back end is where everything happens.

GDD210033 PHÙNG HỮU MINH KHÁNH 29

IV.Online creation tools and custom-built. (P4)
1. Examples of online creation tool
A. WIX.com (https://www.wix.com)

Figure 8: WIX.com.

 Wix's cutting-edge technology enables anybody to create a personalized, professional web presence. Whether
creator’s first-time creators or seasoned veterans, they'll discover the features and solutions they need to design
a great website with complete creative freedom (WIX, 2021).
 Wix's worldwide user base, open SDK, and unrivaled design capabilities combine to provide a one-of-a-kind
environment. Wix allows partners, developers, web designers, and other online professionals to sell their
products and services to millions of people. Wix offers a world-class platform to more than 200 million people
globally, allowing anybody to express themselves and establish their online presence. Whether the creator is an
entrepreneur, designer, developer, singer, photographer, or restaurant owner, he or she will discover specific
capabilities to build a great website and manage your business (WIX, 2021).

GDD210033 PHÙNG HỮU MINH KHÁNH 30

  Wix is always creating new tools to help you succeed. Ascend by Wix offers users an all-in-one business solution
that allows them to engage with customers and automate their processes. Users may sell their things and be
paid online with Wix Stores. Create a personalized logo with Wix Logo Maker to develop their brand and uncover
a comprehensive collection of SEO tools to assist them in competing in organic search. Wix Video Maker allows
them to create promotional films in seconds and a Wix Blog allows them to share their story with their online
network. With our open development platform, Velo by Wix, you can create powerful web apps using serverless
computing and hassle-free coding (WIX, 2021). Discover these and hundreds of other useful tools for website
designers and managers (WIX, 2021).

GDD210033 PHÙNG HỮU MINH KHÁNH 31

 B. WordPress (https://wordpress.com)

Figure 9: WordPress.

WordPress is a free and open-source Content Management System (CMS) that enables users to create dynamic
websites and blogs. WordPress is the most popular blogging system on the web, and its back-end CMS and components
enable website maintenance, customization, and management (tutorialspoint, 2015).

Features (tutorialspoint, 2015):

 User Management: It allows you to manage user information such as changing the user's position to
(subscriber, contributor, author, editor, or administrator), creating or deleting the user, changing the
password, and altering the user information. The user manager's primary responsibility is authentication.
 Media Management: It is a tool for managing media files and folders on your website, allowing you to
effortlessly upload, organize, and manage media assets.
 Theme System: It allows you to change the appearance and functionality of your website. Images, stylesheets,
template files, and custom pages are all included.
 Extend with Plugins: Several plugins are available that give specific functions and features based on the needs
of the user.
 Search Engine Optimization (SEO): It includes a number of SEO tools that make on-site SEO simple.

GDD210033 PHÙNG HỮU MINH KHÁNH 32

  Multilingual: It allows the user to translate the entire material into the language of their choice.
 Importers: It enables the importation of data in the form of posts. Custom files, comments, post pages, and
tags are all imported.

2. Comparison table:
The tale below will compare online creation tools and custom-built:

Online creation tools Custom built website

A template-based site may appear to A bespoke website, on the other hand, allows you
be an adequate answer for your to work within your budget and add features as
present needs, but what happens needed. Your developer will design the site to
when your company expands? Extra properly meet your present goals, while also
Design
flexibility features you don't need might ensuring that it is easily expandable as you grow.
dramatically slow down your site's There are no inherent constraints to the amount
loading speed as traffic increases. of visitor traffic that custom sites can manage
Functional restrictions are only without affecting functionality (Lischer, 2021).
compounded when the number of
visitors increases (Lischer, 2021).
The bandwidth of a website, which The bandwidth of the website is determined by
controls how fast it performs, is the cost of the hosting service.
Performance determined by the cost of the hosting
Complete control and customization of the
option. Backend technology to increase site
There is no back-end intervention performance.
provided.

GDD210033 PHÙNG HỮU MINH KHÁNH 33

 The functional restrictions of website
templates are also present. To begin
with, not all templates are intended to
be entirely responsive (i.e., to work as
well on mobile devices as they do on a
Functionality desktop.) Given that mobile traffic now
accounts for more than half of all
internet traffic, responsiveness is no
longer an option (Lischer, 2021).
If you intend to perform any major e-commerce
with your website, a bespoke site is also required.
Template-based sites lack the flexibility required
to support the backend required for an e-
commerce strategy. Website templates can also
pose a security risk. Hackers adore template-
based sites because a single piece of malicious
code can be used to compromise thousands of
sites at the same time. Custom sites are less
vulnerable to assaults due to their unique
construction (Lischer, 2021).

Lack of control over UX in cases when Flexible in terms of customizing and optimizing
UX bespoke or additional technologies the site's technology for capturing leads or selling
cannot be implemented as templates things.
running on a structured system.

Template websites are ready-made Custom-built websites are created using

web pages or collections of web pages
that are essentially clones of a
website's key core foundation pieces
UI that can then be minimally customized
and populated with your content
(Wallis, 2020).
Table 2: Table of Comparison.
techniques that result in a user interface that is
unique to the website. Furthermore, the
experience in reaction to user inputs (any action
taken by the user) that designers may employ to
generate a variety of outputs. Above all, custom-
made websites will deliver your own "built from
the ground up website" and a far more
distinctive experience for your customers
(Wallis, 2020).

GDD210033 PHÙNG HỮU MINH KHÁNH 34

References
1. WeblinkIndia.net (n.d.) Static vs dynamic website: Advantages and disadvantages, WeblinkIndia.Net, [online] Available at:
https://www.weblinkindia.net/blog/static-vs-dynamic-website-advantages-disadvantages (Accessed December 3, 2022).
2. Anon (2022) Benefits of using frameworks for web application development, Oodles ERP, [online] Available at:
https://erpsolutions.oodles.io/blog/web-development-frameworks-benefits (Accessed December 3, 2022).
3. CDNetworks (2022) What is a DNS server?, CDNetworks, [online] Available at: https://www.cdnetworks.com/web-
performance-blog/what-is-a-dns-server/ (Accessed December 3, 2022).
4. Anon (n.d.) DNS server types | cloudflare, [online] Available at: https://www.cloudflare.com/learning/dns/dns-server-types/
(Accessed December 3, 2022).
5. Anon (n.d.) 14 technologies every web developer should be able to explain, Differential, [online] Available at:
https://www.differential.com/posts/14-technologies-every-web-developer-should-be-able-to-explain/ (Accessed December
3, 2022).
6. Anon (n.d.) Web technology, GeeksforGeeks, [online] Available at: https://www.geeksforgeeks.org/web-technology/
(Accessed December 3, 2022).
7. Anon (2019) Web server and its type, GeeksforGeeks, [online] Available at: https://www.geeksforgeeks.org/web-server-and-
its-type/?ref=gcse (Accessed December 3, 2022).
8. Khillar, S. (2018) Difference between frontend and backend, Difference Between Similar Terms and Objects, [online] Available
at: http://www.differencebetween.net/technology/difference-between-frontend-and-backend/ (Accessed December 3,
2022).
9. Anon (2022) Custom website vs Template website: Which is right for you?, Ignyte, [online] Available at:
https://www.ignytebrands.com/custom-website-vs-template-website/ (Accessed December 3, 2022).
10. Anon (n.d.) WordPress - Overview, Tutorials Point, [online] Available at:
https://www.tutorialspoint.com/wordpress/wordpress_overview.htm (Accessed December 3, 2022).

GDD210033 PHÙNG HỮU MINH KHÁNH 35

 11. Anon (n.d.) About Us, About Us | Wix.com, [online] Available at: https://www.wix.com/about/us (Accessed December 3,
2022).

GDD210033 PHÙNG HỮU MINH KHÁNH 36