1. Trang chủ
  2. » Tất cả

A11633 môn Web design ;asdliv;odvihoihvv

79 1 0

Đ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

Định dạng
Số trang 79
Dung lượng 4,87 MB

Nội dung

Merit ăefsdfasdvzccvsfgtrbtbyntbsdfiasjhdgvkasvLSIUCHVowiuhwafviubsdlvkjbxzlkjcvglkzushdfoluasydfpoiyuasvjaghskvjgslkfdvhjlaúyvouyasodvhasdvawkjdvhcaksdbc kljabsklvjhaslkdfhjoiwukjbjnsalkdvbcliugsadkfjhlksadvbliuhawerlfkjsal;jdfh;oohasg;dflkhjas;ldkfjawwieyf;lsjhdflkasgh

ASSIGNMENT FRONT SHEET Qualification BTEC Level HND Diploma in Computing Unit number and title 10: Website Design & Development Submission date 25/2/2023 Date Received 1st submission Re-submission Date Date Received 2nd submission Student Name Le Minh Duc Student ID GCH211370 Class GCH1105 Assessor name Lai Manh Dung 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 Duc Grading grid P1 P2 P3 P4 M1 M2 M3 D1 ❒ Summative Feedback: Grade: Signature & Date: ❒ Resubmission Feedback: Assessor Signature: Date: 1633 – WEBSIDE DE SIGN AND DEVELOPME NT BY LE MI N H D UC (GC H 1 ) TABLE OF CO NT ENT 1.Introduction​ 2.How does the website work? and Server technologies: Hosting service, HTML, DNS, TCP/IP, OS, IDE, Web Techlonogies, Back end and front end IDEs A.Evaluate a range of tools and techniques available to design and develop a custom-built website HOW D OES W EBSID E W ORK ? Computers connected to the internet are called clients and servers The user side includes devices connected to the internet and has browser applications such as Google chorme, Microsoft egde, Servers are computers that store webpages, sites, or apps When a client device wants to access a webpage, W EB SERVER A web server is software and hardware that uses HTTP and other protocols to respond to client requests made over the World Wide Web The main job of a web server is to display website content through storing, processing and delivering webpages to users Besides HTTP, web servers also support SMTP (Simple Mail Transfer Protocol) and FTP (File Transfer Protocol), used for WEB BR OW ER S A web browser takes you anywhere on the internet, letting you see text, images and video from anywhere in the world H OSTI NG SERVI CES Web hosting is an online service that enables you to publish your website or web application on the internet When you sign up for a web hosting service, you basically rent some space on a physical server where you can store all the files and data necessary for your website to work properly HTML HTML stands for Hyper Text Markup Language It is used to design web pages using a markup language HTML is the combination of Hypertext and Markup language Hypertext defines the link between web pages DNS Internet domain names are located and converted into Internet Protocol (IP) addresses using the domain name system (DNS), a naming database The IP address that a computer uses to find a website is mapped to that website's name by the domain name system  Development Frameworks for Mobile: - Mobile development frameworks have seen an equally amazing surge with the rise of mobile, which is gaining ground quickly Mobile development frameworks provide developers with a framework that aids in the creation of mobile apps, much like their desktop equivalents They can be divided into two categories: cross-platform frameworks, which provide an app that is compatible with any phone, and native mobile apps, which are designed specifically for either Apple or Android (codeinstitute.net, 2022) 3.2 Common Web Development Framework  Django (www.djangoproject.com)  High-level Python web framework Django promotes quick development and streamlined, practical design It was created by seasoned programmers and handles a lot of the hassle associated with web development, freeing you up to concentrate on building your app without having to invent the wheel It is open source and free Figure 3- Django - Web Development framework  React Js:  The Facebook team created yet another front-end JavaScript framework to make it simpler for them to make updates to the website's code The use of virtual DOM, one of its more well-liked features, enables more smooth site performance and ensures that high-load applications render more quickly Figure - React Js - Web development framework  Flutter:  A cross-platform app framework that generates native code enables you to create apps for both Apple and Android using the same programming language and code base It was created by Google and is open-source and free Figure - Flutter - Web Development framework 3.3 Evaluate the impact of Web Technology and Frameworks with regards to website design, functionality and management  In contrast to many other development tools, frameworks provide a pre-defined codebase and guidelines to simplify web development Reducing the application development lifecycle also shortens time to market while accelerating the development process The following are the effects of using frameworks when creating websites - Easy Debugging Process: Enhancing code quality and readability for developers is the main objective of framework-based web application development Frameworks provide the most efficient way to design and build web applications while also making software maintenance and problem fixing simple Developers can simultaneously conduct unit tests thanks to the debugging and QA testing facilities that are built into many web frameworks On the other hand, high-level software testing demands that QA engineers employ tools like Selenium, JMeter, and Katalon Studio - Improved Code Efficiency: Since online frameworks are made to make code more understandable and reusable, they are the quickest and most effective way to develop standalone web applications A dynamic - - - coding environment and sophisticated features like hot reload and live reload are also advantageous to developers because they speed up web development Easy Code Reusability: Web frameworks away with the necessity for programmers to write complex programs containing thousands of lines of code To create a smooth bootstrapping process, they might take the pre-built codebase and make minor adjustments a lot of popular frameworks, including Django and React With the use of JavaScript, developers can easily reuse code to create multiple web applications from a single codebase Similar to this, web frameworks try to make development easier by automating tasks like caching, URL mapping, session management, and other similar tasks Accelerated Development: The prevalence of cyberattacks has serious implications for site design security On the other hand, using frameworks when developing web applications enables you to protect and shield your web app from common risks like DDoS and SQL injection as well as data manipulation It's because most web frameworks come with security features enabled by default Enhanced Security: The prevalence of cyberattacks has serious implications for site design security On the other hand, using frameworks when developing web applications enables you to protect and shield your web app from common risks like DDoS and SQL injection as well as data manipulation It's because most web frameworks incorporate security measures by default F Review and Evaluate IDEs What is IDEs?  Software for creating applications known as an integrated development environment (IDEs) combines standard developer tools into a single graphical user interface (GUI) Typically, an IDEs includes:  Source code editor: A text editor with features like syntax highlighting with visual cues, offering languagespecific auto-completion, and checking for flaws as code is being produced can help with writing software code  Creating a local version of the product for usage by the developer typically involves using tools that automate repetitive, straightforward operations like compiling computer source code into binary code, packaging binary code, and running automated tests  Debugger: An application used to test other applications and show graphically where a bug exists in the source code(redhat, 2022) Popular kinds of IDEs  There are numerous proprietary and open source IDE choices available because to the wide variety of technical and commercial use cases for IDEs Typically, the key factors that set IDEs apart from one another are:  The number of supported languages: Some IDEs specialize in a single language, making them a better fit for a certain programming paradigm For instance, IntelliJ is primarily recognized as a Java IDE Other IDEs offer a wide variety of languages all at once, such as the Eclipse IDE, which supports Python, XML, Java, and other languages  Supported operating system(s): If an IDE isn't cloud-based, a developer's operating system will limit the IDEs that are practical, and if the application being created is meant for users of a particular operating system (like Android or iOS), this may be an additional restriction  Automation features: Despite the fact that the majority of IDEs come with the three essential capabilities of a text editor, build automation, and debugger, many also offer extra features like refactoring, code search, and continuous integration and continuous deployment (CI/CD) tools(redhat, 2022)  Impact on system performance: If a developer wants to run additional memory-demanding apps simultaneously, the memory footprint of an IDE may be something to take into account  Plugins and extensions: Some IDEs give developers the option to modify workflows to suit their requirements and preferences Evaluate the impact of IDEs with regards to website design, functionality and management  Integrated development environments increase the productivity of developers By reducing setup time, speeding up development chores, keeping developers informed of the most recent dangers and best practices, and standardizing the development process so that everyone can follow along, these IDEs increase productivity  Faster setup : Without an IDE interface, programmers must spend time configuring numerous development tools Software engineers can have the same set of capabilities in one location by integrating an IDE, eliminating the need to frequently switch tools  Faster development tasks: The productivity of developers is increased by the tighter integration of development jobs Developers can, for instance, scan code and check grammar as they edit, providing real-time feedback as syntax problems are introduced To complete tasks, programmers are no longer need to switch between apps The tools and capabilities of the IDE also assist programmers with resource organization, error prevention, and shortcut implementation  IDEs can assist in restructuring the development process by encouraging comprehensive planning for even greater advantage They encourage programmers to view their actions as part of the complete software development lifecycle (SDLC) rather than as a collection of discrete tasks  Continual learning: The capacity to remain knowledgeable and up to date is another advantage An IDE, for instance, frequently adds fresh samples, project templates, and other content to its help sections Developers are more likely to benefit their team and the company by adding value, which increases productivity, if they are always learning and staying up to date on best practices  Standardization: Additionally, it controls the development process, enabling programmers to collaborate easily and helps new recruits get up to speed so they can start working right away(Veracode, 2022) G.Evaluate a range of tools and techniques available to design and develop a custom-built website Tools 1.1 Visual studio code  Advantage:  The fact that it supports a wide range of programming languages is its most crucial characteristic It also functions well as a debugger  Almost all widely used programming languages are supported The plugin's support contributes to boosting its power to new heights  It supports a wide variety of languages, including GO, Typescript, and C# It features a good plugin management that makes it simple to find and keep up-to-date plugins you prefer(Nazim A, 2022)  Disadvantage:  You may become a little puzzled if you need to install and tweak your own plugins at times  It is bothersome because some specialized features might not be known by everyone These traits are also rather difficult to locate, and I only discovered them via investigation  Initial poor compatibility with M1 Macs, including frequent freezing, abrupt shutdowns, and odd behavior during collaboration sessions  I know the program is not at fault when you write your code, but the ways it remembers you are bothersome," said the programmer (Nazim A, 2022) 1.2 Netbeans  Advantage:  Everything is integrated: Svn, git, diff, task management, debugging, database administration, and even a browser are examples Everything is just a few clicks away; you don't need to remember complicated console commands or use another program  Cross platform: Eclipse operates on a platform that supports JRE  It’s a standard: A good tool developer always creates an Eclipse plugin Many task manager applications have an Eclipse plugin or at the very least a Mylyn connector Google started its Android SDK as an Eclipse plugin Every major programming language has support or a plugin  Constant development: Its plugins and core are updated frequently  Disadvantage:  Bloat: You desire a plug-in There are twelve prerequisites  Plugin nightmare: Sometimes different versions of the same required plugin are needed by various plugins Even the base Eclipse release version or the order in which plugins are installed can occasionally make a difference Typically, only the Eclipse for Java or Eclipse for Mobile development releases are compatible with graphic design plugins The identical plugins installed for the core Eclipse release will not function (Tamás Garancsi, 2018) Techniques 2.1 HTML  Advantage:  HTML is Browser friendly: HTML supports a wide range of applications, including Google Chrome, Mozilla Firefox, Opera, and others This makes HTML incredibly program friendly due to its standing among the best programs currently available  Allowed to utilize: HTML is permissible to use because it is an open-source language In the same way that there is no compelling reason to purchase additional tools for, say, creating HTML code, it is a huge benefit for businesses and individuals  Simple to learn: HTML is an easy-to-learn building block for web development It comes as no surprise to learn that school students may also use HTML to create a simple website with images and tones  Basic design: Basic in nature, HTML has a clear structure with specified labels and features To put it another way, if you practice frequently, you'll get used to the simple HTML structure and genuinely desire to write HTML code without any trouble  Lightweight and quick: A simple markup language is HTML By reducing stacking time, it gives clients more time  Utilization of formats: Developers can use many formats with HTML By cutting down on the time needed to create the plan codes, it considerably simplifies the task for web programmers  Disadvantage:  Static language: Language that is static: HTML is a static language This implies that the HTML website pages will remain unchanged until they are physically changed It also does not support dynamic outcomes  Invests in some opportunity to design: For engineers, right now is the best moment to stay up with the color scheme of web pages and HTML-based configuration tables, records, and structures  Restricted security: Everyone needs to feel secure However, HTML has one key drawback, in that it only provides limited security features  Extensive code: In any case, a lot of code should be written for simple website pages Similar to how lengthy code adds complexity for the improvement team Layouts for basic sites can help us overcome this problem (aplustopper, 2022) 2.2 CSS  Advantage:  With CSS, you only need to declare a repeating style for an element once and use it repeatedly because CSS will automatically apply the necessary styles  The primary benefit of CSS is that it applies style uniformly across various websites Multiple locations can be controlled by a single instruction, which is beneficial  For each page, web designers should add a few lines of programming to increase site speed  Because a change to one line of code impacts the entire website and maintenance time, cascading sheets simplify both website construction and maintenance  Because it is less complicated, the effort is drastically decreased  Changes that are consistent and spontaneous are formed  Devices can easily read CSS updates There is a need for responsive web design because consumers use a wide variety of smart devices to visit websites online  It is capable of shifting position It assists us in figuring out how the positions of the web elements that are present on the page have changed  These significant values of inconsequential tags that blend in with a jumble of pages represent the bandwidth savings  The user can easily change the online page  It lessens the size of files transferred  Disadvantage:  CSS, from CSS to CSS3, causes misunderstanding among web browsers  What works with one browser may not always work with another when it comes to CSS  The application must be tested for compatibility by web developers using a variety of browsers  The availability of security is limited  If any compatibility issues arise after making the changes, we must verify them  All browsers are affected by the same change  The world of programming languages is challenging for novices and non-developers alike Different CSS levels, such as CSS, CSS 2, and CSS 3, can be very confusing  compatibility with browsers (some styles sheet are supported and some are not)  On various browsers, CSS functions differently CSS is supported in different ways by IE and Opera  When utilizing CSS, cross-browser difficulties could arise  Confusion is brought on by the several tiers, which are confusing to newbies and non-developers (geeksforgeeks, 2022) 2.3 JavaScript  Advantage:  Speed: Because JavaScript is a "interpreted" language, it speeds up the compilation process for other programming languages like Java  Simplicity: JavaScript is simple to comprehend and pick up Both consumers and developers will find the framework to be straightforward  Popularity: JavaScript can be found practically everywhere because it is supported by all modern browsers  Interoperability: Because JavaScript seamlessly integrates with other programming languages, many developers favor using it to create a variety of apps  Server Load: Due to the client-side nature of JavaScript, data validation can be done within the browser itself rather than being forwarded to the server There is no need to completely restart the webpage in the event of any disagreement Only the chosen section of the page receives updates from the browser  Rich Interfaces: JavaScript offers developers a variety of interfaces for making appealing websites  Extended Functionality: In order to save time and money, third-party add-ons like Greasemonkey (a Mozilla Firefox extension) enable developers to incorporate short segments of prefabricated code into their code  Versatility: JavaScript can now be used for both front-end and back-end development NodeJS is used in back-end development, although various libraries, such as AngularJS, ReactJS, etc., are helpful in front-end development  Less Overhead: JavaScript shortens the code, which enhances the efficiency of webpages and web applications  Disadvantage:  Client-side Security: Since the user can see the JavaScript code, it could be misused by others These actions can involve using the source code anonymously Additionally, it is relatively simple to insert code into the website that jeopardizes the security of data transmitted via the website  Browser Support: Different browsers interpret JavaScript in different ways The code must therefore be tested across several platforms before publication Some new functionalities are not supported by older browsers, therefore we also need to check them  Lack of Debugging Facility: Although some HTML editors allow for debugging, they are not as effective as editors for C or C++ Additionally, the developer has a difficult time figuring out the issue because the browser doesn't display any errors  Single Inheritance: JavaScript does not support multiple inheritance; only one inheritance is supported This property of object-oriented languages might be necessary for some programs  Sluggish Bitwise Function: JavaScript operates on 32-bit bitwise operands and stores numbers as 64-bit floatingpoint numbers JavaScript performs operations on the 32-bit signed integers before converting them back to 64-bit JavaScript numbers The process of converting a number to an integer continuously requires more time As a result, the script runs slower and requires more time to execute  Rendering Stopped : The website's entire JavaScript code can stop rendering due to a single error in the code It appears to the user as though JavaScript is absent The browsers, however, are very forgiving of these mistakes (Anon 2022,) 2.4 PHP  Advantage:  Extremely scalable  Free to use  Support of community  Easy to use  Lightning speed  Disadvantage:  Not as versatile  Limited debugging tools  Can’t modify core behavior  There are easier to use languages out there  Security is not the best References Anon, 2022 Javatpoint [Online] Available at: https://www.javatpoint.com/what-is-world-wide-web [Accessed 13 February 2023] Anon, 2022 topdev [Online] Available at: https://topdev.vn/blog/web-server/ [Accessed February 2023] Anon, 2022 techtarget [Online] Available at: https://www.techtarget.com/whatis/definition/Web-server# [Accessed February 2023] Anon, 2022 CDnetwork [Online] Available at: https://www.cdnetworks.com/web-performance-blog/what-is-a-dns-server/ [Accessed February 2023] Anon, 2022 domaintools [Online] Available at: https://www.domaintools.com/support/what-is-a-domain-name-and-what-does-it-do/ [Accessed February 2023] Anon, 2022 TrustRadius [Online] Available at: https://www.javatpoint.com/what-is-world-wide-web [Accessed February 2023] Anon , , 2023, gecksforgeeks [Online] Available at: https://www.geeksforgeeks.org/tcp-ip-model/ [Accessed February 2023] Anon , 2022, type.blog [Online] Available at: https://types.blog/types-of-server-hardware/ [Accessed February 2023] Anon , 2022, tutorialspoint [Online] Available at: https://www.tutorialspoint.com/operating_system/os_overview.htm [Accessed February 2023] Anon , 2022, developer.mosilla, [Online] Available at: https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/How_the_Web_works [Accessed 5February 2023] Anon , 2022, developer.mosilla, [Online] Available at: https://www.geeksforgeeks.org/difference-between-static-and-dynamic-web-pages/ [Accessed February 2023] Sagar Khillar, 2018, developer.mosilla, [Online] Available at: http://www.differencebetween.net/technology/difference-between-frontend-and-backend [Accessed February 2023] Anon , 2022, browserstack [Online] Available at: https://www.browserstack.com/guide/top-web-design-tools [Accessed February 2023] Anon , 2022 [Online] Available at: https://wordpress.com/ [Accessed February 2023] Anon , 2022, colouringdepartment [Online] Available at: https://colouringdepartment.com/tips-and-tricks/website-builders-vs-custom-websites [Accessed February 2023] Anon , 2023, gecksforgeeks [Online] Available at: https://www.geeksforgeeks.org/web-technology/ [Accessed February 2023] Anon , 2022, codeinstitute.net [Online] Available at: https://codeinstitute.net/global/blog/what-is-a-framework/ [Accessed February 2023] Anon , 2022, Veracode [Online] Available at: https://www.veracode.com/security/integrated-development-environment [Accessed February 2023] Anon , 2022, Redhat [Online] Available at: https://www.redhat.com/en/topics/middleware/what-is-ide [Accessed February 2023] Nazim A, 2022, Capterra [Online] Available at: https://www.capterra.com/p/186634/Visual-Studio-Code/reviews/ [Accessed February 2023] Tamás Garancsi, 2018, quora [Online] Available at: https://www.quora.com/What-are-the-advantages-and-disadvantages-of-NetBeans-and-Eclipse [Accessed February 2023] Anon , 2022, aplustopper [Online] Available at: https://www.aplustopper.com/advantages-and-disadvantages-of-html/ [Accessed February 2023] Anon , 2022, gecksforgeeks [Online] Available at: https://www.geeksforgeeks.org/advantages-and-disadvantages-of-css/ [Accessed February 2023] Anon 2022, data-flair.trainning[Online] Available at: https://data-flair.training/blogs/advantages-disadvantages-javascript/ [Accessed February 2023] ... is the portion of the website that visitors cannot access Backend web development is responsible for everything that occurs Developer A web designer''s task is to redesign websites with an eye... managed(P1) What’s Webs and How is Web work?  Define: A collection of websites or web pages kept on web servers and linked to local computers over the internet is referred to as the World Wide Web, or... constructing, and maintaining of websites is referred to as web development It covers things like web publishing, web programming, database management, and web design It is the development of

Ngày đăng: 05/03/2023, 18:38