ASSIGNMENT 1 FRONT SHEET

Qualification BTEC Level 5 HND Diploma in Computing

Unit number and title Unit 30: Application Development

Submission date Date Received 1st submission

Re-submission Date Date Received 2nd submission

Student Name Ngo Hoang Thanh Student ID GCD18591

Class GCD0705 Assessor name

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

Grading grid

P1 P2 P3 M1 M2 D1
 Summative Feedback:  Resubmission Feedback:

Grade: Assessor Signature: Date:

Lecturer Signature:

Table of Content

A. Design Tool: ............................................................................................................................................ 4

I. Draw.io ................................................................................................................................................ 4
1. Definition ......................................................................................................................................... 4
2. Reason why I choose Draw.io ........................................................................................................ 5
II. Tool Adobe XD User interface: .......................................................................................................... 5
1. Definition ......................................................................................................................................... 5
2. Reason why I choose Draw.io ........................................................................................................ 5
B. Front-End Technology ............................................................................................................................ 6
I. HTML/CSS ......................................................................................................................................... 6
1. HTML .............................................................................................................................................. 6
2. CSS .................................................................................................................................................. 6
3. Reason why I choose HTML and CSS ............................................................................................ 7
 II. JavaScrip ............................................................................................................................................. 7
1. Definition ......................................................................................................................................... 7
2. Reason why I choose JavaScrip ....................................................................................................... 8
III. Bootstrap Framework ...................................................................................................................... 8
1. Definition ......................................................................................................................................... 8
2. Reason why I choose Bootstrap ....................................................................................................... 9
C. Back-End Technology............................................................................................................................. 9
I. Programing Language - C# ................................................................................................................. 9
1. Definition ......................................................................................................................................... 9
2. Reason why I choose C#................................................................................................................ 10
II. Operating System – Microsoft Windows .......................................................................................... 10
1. Definition ....................................................................................................................................... 10
2. Reason why I choose Windows ..................................................................................................... 11
III. Database - SQL server ................................................................................................................... 11
1. Definition ....................................................................................................................................... 11
2. Reason why I choose SQL Server ................................................................................................. 12
IV. ASP.NET MVC Framework:......................................................................................................... 12
1. Definition ....................................................................................................................................... 12
2. Reason why I choose ASP .NET Framework ................................................................................ 13
V. IIS Web Server: ................................................................................................................................. 13
1. Definition ....................................................................................................................................... 13
2. Reason why I choose ASP .NET Framework ................................................................................ 14
D. Tools for Source Control Management ................................................................................................. 14
I. GitHub ............................................................................................................................................... 14
1. Definition ....................................................................................................................................... 14
2. Reason why I choose GitHub ........................................................................................................ 15
E. Software Development Models ............................................................................................................. 16
I. Waterfall Model ................................................................................................................................ 16
1. Definition ....................................................................................................................................... 16
2. Reason why I choose Waterfall Model .......................................................................................... 17
F. Conclution ............................................................................................................................................. 17
G. Reference ............................................................................................................................................................ 18

Table of Figure

Figure 1: Draw.io ........................................................................................................................................... 5

Figure 2: HTML ............................................................................................................................................. 6
Figure 3: CSS ................................................................................................................................................. 7
Figure 4: JavaScript ........................................................................................................................................ 8
Figure 5: Bootstrap ......................................................................................................................................... 9
Figure 6: C# .................................................................................................................................................. 10
Figure 7: Microsoft Windows ...................................................................................................................... 11
Figure 8: SQL Server ................................................................................................................................... 12
Figure 9: ASP .NET Framework .................................................................................................................. 13
Figure 10: ASP .NET Framework ................................................................................................................ 14
Figure 11: GitHub ........................................................................................................................................ 15
Figure 12: Waterfall Model .......................................................................................................................... 17
Figure 13: Overview software in FPT project .............................................................................................. 18

A. Design Tool:

I. Draw.io

1. Definition

Draw.io is proprietary software for making diagrams and charts. The software
allows you to choose from an automatic layout function, or create a custom layout.
They have a large selection of shapes and hundreds of visual elements to make your
diagram or chart one-of-a-kind. The drag-and-drop feature makes it simple to create
a great looking diagram or chart.
Draw.io has options for storing saved charts in the cloud, on a server, or network
storage at a data center, depending on your needs.
 Figure 1: Draw.io

2. Reason why I choose Draw.io

I have used Draw.io to draw maps that meet the needs of the project such as Use
Case, EDR. The first benefit it brings is its very user-friendly interface and ease of
use. The second benefit is that it is completely free to help me save money on my
project. It also integrates with Google drive which automatically stores all changes
so that when something goes wrong I still don't lose my design.

II. Tool Adobe XD User interface:

1. Definition

Adobe XD is a vector-based user experience design tool for web apps and mobile
apps, developed and published by Adobe Inc. It is available for macOS and
Windows, although there are versions for iOS and Android to help preview the
result of work directly on mobile devices. Adobe XD supports website wireframing
and creating click-through prototypes.

2. Reason why I choose Draw.io

 Prototypes of Android, iOS and web applications.

 Can make wireframes of that project screen. After applying transition effects
and animations, we can elaborate on the details to enhance the look and feel.
 After the prototype has been made, we can actually run that app in different
screen sizes all sizes of Android Mobiles, iOS Mobiles and also web
applications.
 Some basic designing particles are provided by Adobe XD library so that we
can use it directly in our project.
  While this process of prototyping the whole project in Adobe XD and then
testing it can take a long time, it will decrease the chance of design failure to
almost zero.

B. Front-End Technology

I. HTML/CSS

1. HTML

HTML is the language for describing the structure of Web pages. HTML gives
authors the means to:
Publish online documents with headings, text, tables, lists, photos, etc.
Retrieve online information via hypertext links, at the click of a button.
Design forms for conducting transactions with remote services, for use in searching
for information, making reservations, ordering products, etc.
Include spread-sheets, video clips, sound clips, and other applications directly in
their documents.
With HTML, authors describe the structure of pages using markup. The elements of
the language label pieces of content such as “paragraph,” “list,” “table,” and so on.

Figure 2: HTML

2. CSS

CSS is the language for describing the presentation of Web pages, including colors,
layout, and fonts. It allows one to adapt the presentation to different types of
 devices, such as large screens, small screens, or printers. CSS is independent of
HTML and can be used with any XML-based markup language. The separation of
HTML from CSS makes it easier to maintain sites, share style sheets across pages,
and tailor pages to different environments. This is referred to as the separation of
structure (or: content) from presentation.

Figure 3: CSS

3. Reason why I choose HTML and CSS

HTML (the Hypertext Markup Language) and CSS (Cascading Style Sheets) are
two of the core technologies for building Web pages. HTML provides the structure
of the page, CSS the (visual and aural) layout, for a variety of devices. Along with
graphics and scripting, HTML and CSS are the basis of building Web pages and
Web Applications. Almost any website must use HTML and CSS, and so does my
project.

II. JavaScrip

1. Definition

JavaScript is a scripting or programming language that allows you to implement

complex features on web pages — every time a web page does more than just sit
there and display static information for you to look at — displaying timely content
updates, interactive maps, animated 2D/3D graphics, scrolling video jukeboxes, etc.
— you can bet that JavaScript is probably involved. It is the third layer of the layer
cake of standard web technologies. It is the third layer of the cake layer of standard
web technologies besides html and css
 Figure 4: JavaScript

2. Reason why I choose JavaScrip

The reason I chose JavaScrips is because it helps me turn my site from a static web
to a dynamic one. In addition it also provides the ability to create rich interfaces.
Moreover, it also helps me to collect user information automatically and instantly
without reloading the page or accessing the database.

III. Bootstrap Framework

1. Definition

Bootstrap is a free and open-source CSS framework directed at responsive, mobile-

first front-end web development. It contains CSS- and (optionally) JavaScript-based
design templates for typography, forms, buttons, navigation, and other interface
components.
 Figure 5: Bootstrap

2. Reason why I choose Bootstrap

The reason I choose to use Bootstrap is because it saves a lot of completion on the
project. It also doesn't require any complicated knowledge. As long as I know a
little bit about HTML, CSS, JavaScrips and jQuery it will help me create a
professional website. In addition, it also supports in Responsive to help create an
interface suitable for users when used on all devices to increase interaction with
users.

C. Back-End Technology

I. Programing Language - C#

1. Definition

C# is a modern, general-purpose, object-oriented programming language developed

by Microsoft and approved by European Computer Manufacturers Association
(ECMA) and International Standards Organization (ISO).
C# is designed for Common Language Infrastructure (CLI), which consists of the
executable code and runtime environment that allows the use of various high-level
languages on different computer platforms and architectures.
Advantages of C#
 Object-Oriented Language
 Automatic Garbage Collection
 Cross Platform
 Backward Compatibility
 Better Integrity and Interoperability

Applications of C#
 Games using Unity
  Web Applications Client-Server Applications
 Windows Applications Applications that run on desktops
 Web Services Applications
 Console Applications
 Class Libraries

Figure 6: C#

2. Reason why I choose C#

The reason I chose C # is because it is a primary language because it is a highly

optimized language. In addition, the C # language also has a .NET Framework that
supports a lot of things that make it easy to complete a project. Besides, there is a
very powerful MVC model due to the inclusion of C # in HTML which makes it
convenient to create Front-End. Overall, this is a very good plan for this project.

II. Operating System – Microsoft Windows

1. Definition

Microsoft Windows, also called Windows and Windows OS, computer operating
system (OS) developed by Microsoft Corporation to run personal computers (PCs).
Featuring the first graphical user interface (GUI) for IBM-compatible PCs, the
Windows OS soon dominated the PC market.
 Figure 7: Microsoft Windows

2. Reason why I choose Windows

I chose Microsoft Windows for my project because it is very popular and can be
easily compatible with many different devices. In addition, it is extremely easy to
use, just take a little time to get used to it, you can completely use. In terms of
security, it may not be as good as Linux or Max OS but the developers and fix the
vulnerabilities for free. Finally, the most prominent advantage of the Windows
operating system is its rich application. Since most applications are based on
Windows OS-compatible platforms, its applications are richer than other operating
systems.

III. Database - SQL server

1. Definition

As a basic definition, Microsoft SQL Server is a Related Database Management

System(RDBMS) that runs on the SQL programming language. It has the capacity
to support a huge variety of transaction processing applications as well as business
intelligence and analytics in corporate IT environments.
The RDBMS gives you the advantage of working with a table structure based on
rows, which allows you to connect data elements and functions. Unlike a Database
Management System (DBSM), it enables you to maintain the security, integrity and
consistency of the data you’re working with.
 As with most software, it is important to ensure you or your employees are fully
trained on Microsoft SQL. Proper training can help ensure you’re not missing out
on vital features or losing valuable information due to mismanagement.

Figure 8: SQL Server

2. Reason why I choose SQL Server

The reason that I chose Microsoft SQL Server is because Microsoft SQL Server
operates on Windows environment and is the best database to use and develop on
.Net framework. It allows me to maintain the confidentiality, integrity, and
consistency of the data I'm working on - this helps ensure customer trust in my level
of security. Not only that, it also optimizes data accuracy and storage, giving you
the benefit of eliminating the need to store duplicate data in a database while I'm
working on another computer. . Furthermore, SQL Server uses Policy-Based
Management to keep your security policies compliant and up-to-date for easy
management and maintenance during use thanks to an efficient data management
approach. make sure my data is always available and recoverable in case of other
on-site data loss.

IV. ASP.NET MVC Framework:

1. Definition

ASP.NET is an open-source, server-side web-application framework designed for

web development to produce dynamic web pages. It was developed by Microsoft to
allow programmers to build dynamic web sites, applications and services.
 It was first released in January 2002 with version 1.0 of the .NET Framework and is
the successor to Microsoft's Active Server Pages (ASP) technology. ASP.NET is
built on the Common Language Runtime (CLR), allowing programmers to write
ASP.NET code using any supported .NET language. The ASP.NET SOAP
extension framework allows ASP.NET components to process SOAP messages.
ASP.NET's successor is ASP.NET Core. It is a re-implementation of ASP.NET as a
modular web framework, together with other frameworks like Entity Framework.
The new framework uses the new open-source .NET Compiler Platform (codename
"Roslyn") and is cross platform. ASP.NET MVC, ASP.NET Web API, and
ASP.NET Web Pages (a platform using only Razor pages) have merged into a
unified MVC 6.

Figure 9: ASP .NET Framework

2. Reason why I choose ASP .NET Framework

The reason I chose the ASP.NET platform for my project is because it is low cost
but has very strong language support. ASP.NET is incorporated in a Windows
server environment. Not only that, it also provides some great support: basic
framework for handling web requests, website template creation syntax, called
Razor, for creating dynamic websites in C #, library for popular web templates,
such as Model View Controller (MVC), syntax highlighting editor extension, code
completion, and other site-specific functions.

V. IIS Web Server:

1. Definition

Internet Information Services (IIS) is a flexible, general-purpose web server from

Microsoft that runs on Windows systems to serve requested HTML pages or files.
 An IIS web server accepts requests from remote client computers and returns the
appropriate response. This basic functionality allows web servers to share and
deliver information across local area networks (LAN), such as corporate intranets,
and wide area networks (WAN), such as the internet.
A web server can deliver information to users in several forms, such as static
webpages coded in HTML; through file exchanges as downloads and uploads; and
text documents, image files and more.

Figure 10: ASP .NET Framework

2. Reason why I choose ASP .NET Framework

The reason I chose IIS is because it provides Windows systems, choosing to use IIS
requires the choice of Windows Server, and thus increases the operating costs.
Windows is also more susceptible to malware attacks and is known to be a less
secure server option. So why can you consider Windows / IIS option on LAMP
system. Windows and IIS are supported by Microsoft, while Apache is only
supported by the user community. IS supports Microsoft's .NET framework and
ASPX scripting. Media package modules are available to allow streaming of audio
and video content.

D. Tools for Source Control Management

I. GitHub

1. Definition

GitHub, Inc. is a provider of Internet hosting for software development and version
control using Git. It offers the distributed version control and source code
management (SCM) functionality of Git, plus its own features. It provides access
 control and several collaboration features such as bug tracking, feature requests,
task management, continuous integration and wikis for every project.
Headquartered in California, it has been a subsidiary of Microsoft since 2018.
GitHub offers its basic services free of charge. Its more advanced professional and
enterprise services are commercial.Free GitHub accounts are commonly used to
host open-source projects. As of January 2019, GitHub offers unlimited private
repositories to all plans, including free accounts, but allowed only up to three
collaborators per repository for free.Starting from April 15, 2020, the free plan
allows unlimited collaborators, but restricts private repositories to 2,000 minutes of
GitHub Actions per month.As of January 2020, GitHub reports having over 40
million users and more than 190 million repositories (including at least 28 million
public repositories), making it the largest host of source code in the world.

Figure 11: GitHub

2. Reason why I choose GitHub

Since in this project we were working in groups of 2 we decided to use GitHub.

Here are the benefits that GitHub gives us:
 Performance: Git provides the best performance when it comes to version
control systems. Committing, branching, merging all are optimized for a
better performance than other systems.
 Security: Git handles your security with cryptographic method SHA-1. The
algorithm manages your versions, files, and directory securely so that your
work is not corrupted.
 Branching Model: Git has a different branching model than the other VCS.
Git branching model lets you have multiple local branches which are
independent of each other. Having this also enables you to have friction-less
context switching (switch back and forth to new commit, code and back),
 role-based code (a branch that always goes to production, another to testing
etc) and disposable experimentation (try something out, if does not work,
delete it without any loss of code).
 Staging Area: Git has an intermediate stage called “index” or “staging area”
where commits can be formatted and modified before completing the
commit.
 Distributed: Git is distributed in nature. Distributed means that the
repository or the complete code base is mirrored onto the developer’s
system so that he can work on it only.
 Open Source: This is a very important feature of any software present today.
Being open source invites the developers from all over the world to
contribute to the software and make it more and more powerful through
features and additional plugins. This has led the Linux kernel to be a
software of about 15 million lines of code.

E. Software Development Models

I. Waterfall Model

1. Definition

The Waterfall Model was the first Process Model to be introduced. It is also
referred to as a linear-sequential life cycle model. It is very simple to understand
and use. In a waterfall model, each phase must be completed before the next phase
can begin and there is no overlapping in the phases.
The Waterfall model is the earliest SDLC approach that was used for software
development.
The waterfall Model illustrates the software development process in a linear
sequential flow. This means that any phase in the development process begins only
if the previous phase is complete. In this waterfall model, the phases do not overlap.
Waterfall approach was first SDLC Model to be used widely in Software
Engineering to ensure success of the project. In "The Waterfall" approach, the
whole process of software development is divided into separate phases. In this
Waterfall model, typically, the outcome of one phase acts as the input for the next
phase sequentially.
 Figure 12: Waterfall Model

2. Reason why I choose Waterfall Model

Here are the reasons why I have to choose to use the Waterfall model for this
project:
 Simple and easy to understand and use
 Easy to manage due to the rigidity of the model. Each phase has specific
deliverables and a review process.
 Phases are processed and completed one at a time.
 Works well for smaller projects where requirements are very well
understood.
 Clearly defined stages.
 Well understood milestones.
 Easy to arrange tasks.
 Process and results are well documented.

F. Conclution
 Figure 13: Overview software in FPT project

G. Reference

References
Anon., n.d. [Online]
Available at: https://www.computerhope.com/jargon/d/drawio.htm

Anon., n.d. [Online]

Available at: https://www.w3.org/standards/webdesign/htmlcss.html

Anon., n.d. [Online]

Available at: https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/What_is_JavaScript

Anon., n.d. [Online]

Available at: https://en.wikipedia.org/wiki/Bootstrap_(front-end_framework)

Anon., n.d. [Online]

Available at: https://www.webopedia.com/definitions/c-sharp/

Anon., n.d. [Online]

Available at: https://www.britannica.com/technology/Windows-OS

Anon., n.d. [Online]

Available at: https://en.wikipedia.org/wiki/ASP.NET
Anon., n.d. [Online]
Available at: https://searchwindowsserver.techtarget.com/definition/IIS

Anon., n.d. [Online]

Available at: https://en.wikipedia.org/wiki/GitHub

Anon., n.d. [Online]

Available at: https://www.toolsqa.com/git/what-is-git/

Anon., n.d. [Online]

Available at: https://en.wikipedia.org/wiki/Adobe_XD

https://www.computerhope.com/jargon/d/drawio.htm, n.d. [Online].