1. Trang chủ
  2. » Công Nghệ Thông Tin

ASM 2 Application Development 1640 FPT Greenwich (Merit Super Sale)

73 134 1

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề ASM 2 Application Development 1640 FPT Greenwich (Merit Super Sale)
Tác giả Nguyen Huy Hoang
Người hướng dẫn Dinh Duc Manh
Trường học FPT Greenwich University
Chuyên ngành Application Development
Thể loại assignment
Năm xuất bản 2022
Thành phố Hanoi
Định dạng
Số trang 73
Dung lượng 4,47 MB

Các công cụ chuyển đổi và chỉnh sửa cho tài liệu này

Cấu trúc

  • Task 1 Peer Review and Feedback Analysis (P4 – M3) (6)
    • I. Introduction (6)
    • II. Peer review and feedback analysis (6)
      • 1. List of questions (6)
      • 2. Review and Interpret feedbacks (8)
      • 3. Evaluate any new insights, ideas or potential improvements (16)
  • Task 2 Application Development (P5, M4) (17)
    • 1. Folder structure of the application (17)
    • 2. Source code samples of the application (19)
    • 3. Final screenshot (28)
    • 4. Screenshots of using GitHub to manage the source code (48)
  • Task 3 Application Evaluation (P6 – M5) (53)
    • 1. Performance of the application (53)
    • 1. Customer (54)
    • 2. Store Owner (61)
    • 3. Admin (66)
    • 2. Strengths and weaknesses of the application (69)
    • 3. Gantt chart (71)

Nội dung

Điểm của bài asm còn tùy thuộc vào người chấm. Chỉ cần paraphase bài này là có thể pass. 1 trong nhưng tool paraphase mình recommend là quillbot.The submission is in the form of 1 document.● You must use the Times font with 12pt size, turn on page numbering; set line spacing to 1.3 andmargins to be as follows: left = 1.25cm, right = 1cm, top = 1cm, bottom = 1cm. Citation andreferences must follow the Harvard referencing style. ASSIGNMENT FRONT SHEET Qualification BTEC Level HND Diploma in Computing Unit number and title Unit 2: Networking Infrastructure Submission date Date Received 1st submission Resubmission Date Date Received 2nd submission Student Name Student ID Class 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 P4 M1 M2 D1 ❒ Summative Feedback: Grade: Lecturer Signature: ❒ Resubmission Feedback: Assessor Signature: Date: Table of Contents I Network Network definiton Ξ First of all, network also known as computer networking, which can be understand as a group of computers utilizing a principles of general communication protocols over digital connections for the intention of sharing resources located upon or accommodated by network nodes ... https:www.dnsstuff.comdatabreach 10 1 Dobran, B., 2 019 Information Security Risk Management: Build a Strong Program Online Available at: https:phoenixnap.combloginformation security riskmanagement garg, r., 20 21 Threats... List and give examples with dates 12 Propose a method to assess and treat IT security risks (M1) 18 TASK DESCRIBE AT LEAST ORGANIZATIONAL SECURITY PROCEDURES (P2) .20 Definition... Dan Swinhoe, 20 21 The 15 biggest data breaches of the 21st century, s.l.: s.n Ohri, A., 20 21 What Is DMZ Network Online Available at: https:www.jigsawacademy.comblogscyber security whatisdmz

Trang 1

ASSIGNMENT 2 FRONT SHEET

Qualification

BTEC Level 5 HND Diploma in Business

Unit number and title

Unit 30: Application Development

Submission date 27/12/2022 Date Received 1st submission

Student Name Nguyen Huy Hoang Student ID GCH200739

Trang 3

 Summative Feedback:  Resubmission Feedback:

Trang 4

Signature & Date:

Trang 5

Table of Contents

Task 1 – Peer Review and Feedback Analysis (P4 – M3) 6

I Introduction 6

II Peer review and feedback analysis 6

1 List of questions 6

2 Review and Interpret feedbacks 8

3 Evaluate any new insights, ideas or potential improvements 16

Task 2 – Application Development (P5, M4) 17

1 Folder structure of the application 17

2 Source code samples of the application 19

Order Management/ Cart/ Checkout/ Owner feature: 19

Other Controller: 24

View: 26

3 Final screenshot 28

4 Screenshots of using GitHub to manage the source code 48

Task 3 – Application Evaluation (P6 – M5) 53

1 Performance of the application 53

1 Customer 54

2 Store Owner 61

3 Admin 66

2 Strengths and weaknesses of the application 69

3 Gantt chart 71

Trang 6

The project's creator will present and describe the system in this second section while also gathering data from a survey We sell books on our FPTBook, an online library, for a profit We, a three-person team, collaborate to create this website

II Peer review and feedback analysis

1 List of questions

Open Question Add about the experience of user when using FPTBook

Trang 7

Closed Question Ask about the experience in Homepage in which the books are showed

Closed Question Ask about the detail pages

Closed Question Ask about the store owner page

Closed Question Ask about admin page

Trang 8

2 Review and Interpret feedbacks

The survey states that this section is to find out 12 participated in the survey According to the results, 60% of respondents prefer our project in the range of 3 to 5, while 40% fall into range 2 This means that practically everyone has been pleased with our method

Trang 9

The responses to this query show us that the system has only almost pleased everyone, most features are take opinion of 33.3% normal and 66.7% good

Trang 10

We take pride in the fact that our system's user interface scored 100% on scales 4 and 5 That indicates that our page is attractive and appealing

Trang 11

The Store Owner page, on the other hand, has 33.3% on the point 3, 4 and 5 This so us that our page for store owners has been worked very well

Trang 12

As we can see in this result, people vote for 4 is 66.7% of the admin page and the other is 3 has 33.3% We shall preserve the design for the time being since this is odd

Trang 13

Based on the results of the poll, we should enhance every page and feature All of 3 pages may continue to appear in that format for some time

Trang 14

In this choice phase of the register inquiry, 66.7% of the respondents want to add it and 33.3% are confused and don't actually want it We still agreed that it could be a good idea to introduce this feature

Trang 15

We are aware that every user wants a reliable user cart It is true that every system needs a cart feature We want to upgrade that function very shortly

Most idea is about update interface from the survey result

Trang 16

❖ Integrate ReactJs to overhaul the front-end of website

Advantages of Reactjs to my FPTBook project:

➢ Process streamlining To begin with, employing React makes component programming much simpler overall The free syntactic extension JSX makes it much simpler to display subcomponents and quote HTML

➢ Each website owner is aware of how easy support, upgrades, and regular upkeep can develop into a stress pond that never seems to dry out A little adjustment to one component may have a significant impact on all the others, causing either a few undesirable alterations or complete pandemonium Because ReactJS reuses assets, developers may work less stressfully because they can utilize the same digital items again Not to add, utilizing already used parts speeds up the process and lowers the mistake margin

➢ Developed a virtual document object paradigm to help high-volume, dynamic web applications perform smoothly with fewer (or no) hiccups A better user experience, better performance, and faster application are all benefits of the virtual document object paradigm

➢ ReactJS comes with a full toolkit that not only provides slick performance but also enables developers to include cutting-edge

technology and solutions into their projects without experiencing any difficulties

➢ Not to add, ReactJS gives developers the option to test and debug code using native tools

❖ When a user wishes to delete or remove an item from their shopping cart, display a confirmation box When a user clicks the delete or remove button, I will show a confirm box to prevent miss clicks Three roles will play in the system: Admin, Staff, and Customer Every position will have unique features, functions, and user interfaces Administrators and employees of the system may add, modify, and remove things Items may be found by the customer and added to the shopping cart The website will include a navigation bar

❖ Apply Soft Delete for owner and admin site Soft deletion mainly provides you a chance to retrieve data after deletion and delays the permanent destruction of backup material Soft delete retention period refers to the length of time during which this erased material is still accessible If you require the deleted data after deletion (when it is in a soft erased state), you may undelete This resets the data's protection while retaining its current state Then, you may utilize it to carry out restoration operations or, in this case, resume backups

❖ Apply JWT for token-based authentication-authorization:

▪ Stateless authentication means that no data about user sessions is kept on the server

▪ not restricted to certain servers, pathways, or domains No problems with cross-origin resource sharing (CORS)

Trang 17

▪ When opposed to XML-based SAML (Security Assertion Markup Language) information sharing, which is often used with cookies, JSON-based JWT is more condensed

▪ Using systems for authentication and authorization like Auth0, JWT may additionally provide user rights for certain resources So, in addition to authentication, JWT may also be used for authorization

❖ Need to show confirm before deleting anything in owner, admin page

❖ Complete confirm account by Email

Task 2 – Application Development (P5, M4)

We are utilizing the Visual Studio 2022 IDE to code for our project In order to build the web application, we utilize the ASP.NET Core 6.0 framework This is a Linux, Mac, or Windows-compatible open-source framework for creating web applications We begin the app's development using SQL Server 2019 by Windows

1 Folder structure of the application

Because this project is based on MVCVM architecture model pattern, this pattern separates the web structure into 4 primary components (model, controller, view and view model) dependent and interconnected to each other They are usually used to determine the presence of data from how the data is transmitted from the user to the data shown These components are also viewed as layers like a data layer, presentation layer, and business logic layer

Trang 18

Each controller has a view folder, and the folder has an intuitive structure Because this project is based on MVCVM model, the controller defines the business logic of the website is operating It is anything from storing a website’s data to accessing third-party services to meet its business requirements Mainly all the heavy operations are performed within the model regarding database operation Controller also performs as an entry point for each request because the request is first passed to controller & then models are going to be instantiated once we get the info the model returns data to the controller and its task is to send to respective view It examines information from the Request object (from view by user) and creates and returns a Response object The response returned by the controller could be an HTML page, JSON, XML, a file download, a redirect, a

404 error or anything else The controller runs whatever arbitrary logic the application needs to render the content of a page

Model/data layer acts as a memory for the requested service Request from a user who needs data manipulation must be sent to the model via the controller to perform DB operations like storing data, accessing data, update/deleting data

Trang 19

The "wwwroot" subdirectory contains everything else, including bootstrap, front, and JavaScript

2 Source code samples of the application

Order Management/ Cart/ Checkout/ Owner feature:

This functionality enables customers to add quantity-based orders to an order list He or she may see all of the orders from various accounts on the Store Owner page If I'm a customer, all I can see is my own account's order list

Trang 20

Each property of the Order class is mapped to each field in the Order table in the database via available ORM feature of ASP.Net core Commonly, the ID property automatically is set as the Primary key of this entity ASP.Net core also provides datatypes which are corresponding to datatypes

in MS SQL server

Additionally, these classes also have their getter and setter methods which help manipulate with data and ensure encapsulation of these data Two Doctrine Entity classes above actually have a relationship between them Specifically, property ID in Order class is referenced by Orders property in Detail class; In other words, ID property is the field that has been set as primary key in Order Table and Orders_id field from Detail Table is Foreign key of it Moreover, each Order can be associated with many Order detail; But, each Order detail can be associated with only one Order This relationship can be summarized that many Order Details to one Order(or equivalently, one Order to many Order Details)

To apply this relationship, ASP.Net provides relational mapping in the database with setting the order details in order as a ICollection(Orders has been a property but it has been set with Relation(ManyToOne) type which references directly to Order class) This looks like only one association type appeared in Detail class, but seen from the two different sides of the relation (Symfony has been automatically declared Details property in Order details with OneToMany relation and it also returned details property as ICollection Object) Once ManyToOne mapping was initialized, it told Doctrine to utilize the orders_id column on the Details table to relate each record in that table with a record in the Order table

Trang 21

Accompanying controller action is Route Particularly, as soon as my website has received a request from clients, it calls a controller action to generate the response The routing configuration determines what controller actions are called to run for each incoming URL It also provides other useful features, like generating SEO-friendly URLs (e.g /order/Detail/5 instead of order?detail_id=5 in pure C# code)

ASP.Net IIS server will look for routes defined as annotations in any class in the Controller directory if this configuration is used In the cart controller source code below, when a user accesses the /cart URL, this configuration determines a route’s name called “index” When a match is found, the cart Controller will run index() method Thereby, it can be told that the Route’s name also is very essential in generating URLs; hence, each route’s name must be unique in the application

For detail illustrating how the controller applied in my project, here are some code screenshots of cart controllers

Trang 22

Cart controller could be viewed as one of the most special controllers in my project because it has been coded not in the general format of other

controllers If other controllers have fully action to control sites (render index - detail views, render form, call to “formType” to add or edit), the

cart controller is more like an API controller (controller implicitly handles intermediary layer that processes data transfer between systems.) and

almost the action of this controller will be called or fetch from front-end using AJAX

This controller has been applied Session (used to store the cart item view model of each product when adding it to cart, it will be stored as a list

with each element as each book item) Start with the AddToCart action in the cart controller (route’s name ‘AddToCart’), this function uses the

session to store and add the info of products in form of cart item view model object sent when the user clicks on “add to cart” in each product

Particularly, this function actually used the Request of HttpContext which is configured in ClientHelper class to perform the Set() method to

manipulate with this Session To apply this approach, I have needed to install ASPNETCORE SESSION package from Nuget The ASPNETCORE

SESSION package system automatically looks for a service whose id exactly matches the type-hint With this package, my project could manage

services in the controller with minimal configuration of the session It read the type-hints in controller functions and passes the appropriate services

to each method automatically

Based on this, methods in the controller can call directly to Session Back to the AddToCart function, to make the data in the cart reusable, this

was necessary to check it in session “Carts” methods has been declared and it has been assigned to method get() via Session Particularly, the

system has been checked and examined the session’s name ‘cart’ with type is List of CartItem VM If this session’s name ‘cart’ had existed, this

variable immediately increase with one unit, if not this variable wit set to one unit Using the Set method to add the list with new item and this

will return the metadata in JSON format to be handled in front-end

Trang 23

After adding completed, the Session-set method will be called to set the variables ‘myCart’ into Session’s name ‘cart’ to ensure that when AddToCart method is called again, the session checking will receive the cart Session before This Function will return the redirectToAction(allows

to return a redirection based on the name of the route) with the name ‘cart’(the main interface of the cart)

The PlusCart and MinusCart methods operate quite similar to the AddToCart function They just differ to AddToCart that: in AddToCart, the number

of new instance of ‘cartitemVM’ will be declared, but in PlusCart or MinusCart, it will be decreased or removed with other using ways of set method

Come to index function, which functions need to handle session and manage data from session storage To perform these tasks working with Session was seeming to be not enough, I needed to implement ISession as dependency injection(a powerful and flexible session subsystem that provides session management via a clear object-oriented interface utilizing storage drivers) in client helper class to manage the session which was existed in server

To get the data from the session, it was also necessary to call the get() method via the ClientHelper object to examine the Session’s name ‘cart’ However, just getting data was not enough to generate the products with full information and quantity in the cart; hence, one multiple dimension array has been initialized to store this information

For more realistic, all books in the cart and their quantity needed to be automatically calculated to provide the exact total price Additionally, to handle all data from the cart(books, quantity, total prices and etc,…) another method action will be in charge of this task and it is the CheckOut action(route’s name “CheckOut”) When mapping Url via Route with the name ‘CheckOut’, this action immediately is invoked The main tasks of this action are handling data from the session and inserting them into two tables which are the Order table and Detail table in the database To perform these tasks, this function needed to initialize some objects in parameter and they include Identity User claim (Identity platform help to

Trang 24

from the “Carts” List and set them to object of the Detail entity class After that, the AddAsync() method(which is a method of EntityFramework help insert the object into an db) inserts these data of two objects The SaveChanges () method has been used to confirm

After all, the remove() method will be called to remove this cart session and the function also returns redirectToAction(‘home index) (redirect immediately to route’s name homepage)

Other Controller:

Trang 25

The Confirm action updates the status of the order in the database after adding the order object produced by the ASP.NET MVC model binder to the Orders entity collection A model binder is an ASP.NET MVC feature that simplifies working with data provided by a form by converting posted form values to CLR types and passing them as arguments to the action method

This Delete action invokes the Remove function to change the entity's status to Deleted after retrieving the chosen object A SQL DELETE command

is created when SaveChanges is invoked Additionally, it calls the action method from DeleteConfirmed to Delete In order to give the HttpPost method a distinctive signature, the code titled the HttpPost Delete function DeleteConfirmed (The CLR mandates that methods that are overloaded have unique method arguments)

The intricate information that our shopping cart controller must provide to its views doesn't neatly transfer to the items in our model Model classes should reflect our domain, not the user interface, thus we don't want to change them to fit our views One way would be to use the ViewBag class to transfer the data to our views, like we did with the Store Manager dropdown data However, delivering a lot of data through ViewBag becomes difficult to manage

The ViewModel design may be used as a remedy for this With the help of this pattern, we can develop strongly-typed classes that are tailored to our particular view situations and that provide attributes for the dynamic data that our view templates need These view-optimized classes may then be filled up by our controller classes and sent to our view template for usage

Trang 26

The view is the location where the user will see the predicted outcome The view is in charge of making requests to the controller and receiving responses It's a folder that holds all of the Razor boilerplates A template is one of the best ways to organize and render HTML from inside to View, whether required to render HTML from a controller or generate the contents of an email In ASP.NEt, designing View has been being supported strongly by Razor template engine which supports the creation of short, legible and flexible templates that are more web designer-friendly and powerful in several respect

Users may add book to their cart without registering, but in order to check out, they must register as customer A Cart Controller, which allows anonymously adding products to a cart, and a Checkout action, which manages the checkout process, will be used to segregate the shopping and payment processes In this part, we'll start by building the shopping cart, and in the one that follows, we'll design the checkout process

In the code screenshot above, @model is in charge of as a intermediary to pass data from action to view and Inumerable for loop through the model data However, I'll use jQuery to "wire up" the click event for any links in this view that have the HTML class RemoveLink rather than a

Trang 27

Html.ActionLink to remove goods from the basket This click event handler will just issue an AJAX callback to our Cart controller

action rather than publishing the form Our jQuery callback then parses the JSON serialized result that the Cart sends and makes four rapid

modifications to the page using jQuery:

• The deleted book is removed from the list

• Updates the header's cart count

• Updates the user's message and the price of their cart

We don't require a separate view for the Cart controller since the remove scenario is being handled by an Ajax callback inside the Index view

The whole source code for the /Cart/Index view is provided below:

When calling my ‘Cart’ action, ASP.NET MVC creates an instance of the controller (using

ControllerFactory

), and since my method

is static, it is not related to any instance, and thus, it will not be called by MVC use /Cart/PluxCart as the URL to call this API

Trang 28

Profile Page

Trang 29

Details Page

Trang 31

Cart Page

Trang 36

Owner Page

Ngày đăng: 09/06/2023, 11:17

TỪ KHÓA LIÊN QUAN

🧩 Sản phẩm bạn có thể quan tâm