Front-end web development - Misplaced Pages

(Redirected from Front-end Web development) Graphical user interface development

Software development
Part of a series on
Core activities Data modeling Processes Requirements Design Construction Engineering Testing Debugging Deployment Maintenance
Paradigms and models Agile Cleanroom Incremental Prototyping Spiral V model Waterfall
Methodologies and frameworks ASD DevOps DAD DSDM FDD IID Kanban Lean SD LeSS MDD MSF PSP RAD RUP SAFe Scrum SEMAT TDD TSP UP XP
Supporting disciplines Configuration management Deployment management Documentation Software quality assurance Project management User experience
Practices ATDD BDD CCO CI CD DDD PP SBE Stand-up TDD
Tools Compiler Debugger Profiler GUI designer UML Modeling IDE Build automation Release automation Infrastructure as code
Standards and bodies of knowledge CMMI IEEE standards ISO 9001 ISO/IEC standards PMBOK SWEBOK ITIL IREB OMG
Glossaries Artificial intelligence Computer science Electrical and electronics engineering
Outlines Outline of software development
v t e

Front-end web development is the development of the graphical user interface of a website through the use of HTML, CSS, and JavaScript so users can view and interact with that website.

Tools used for front-end development

There are several tools and platforms, such as WordPress, Joomla, and Drupal, available that can be used to develop the front end of a website.

HyperText Markup Language

Main articles: HTML and Markup language

HyperText Markup Language (HTML) is the modern standard for displaying and structuring web content across the internet. HTML defines what elements will be displayed on a website, and how they will be arranged. All major web browsers are designed to interpret HTML, and most modern websites serve HTML to the user. Hypertext is text displayed on a computer with references to other text, these references (or links,) are termed "hyperlinks." When an internet user interacts with a hyperlinked item, the website serves the user the linked data. This data can be another HTML web-page, JavaScript, or anything else. The latest major release of HTML is HTML5, originally published on October 28, 2014 as a W3C recommendation.

Cascading Style Sheets

Main article: CSS

Cascading Style Sheets (CSS) control the presentation and style of a website. CSS uses a cascading system to resolve style conflicts by applying style rules based on specificity, inheritance, and importance. Media queries allow for adjustments to the site's layout and appearance depending on factors such as screen size and resolution. CSS can be applied in three ways: external stylesheets linked in an HTML file, internal <style> blocks, or inline within individual elements.

JavaScript

JavaScript is an event-based imperative programming language (as opposed to HTML's declarative language model) that is used to transform a static HTML page into a dynamic interface. JavaScript code can use the Document Object Model (DOM), provided by the HTML standard, to manipulate a web page in response to events, like user input.

Using a technique called AJAX, JavaScript code can also actively retrieve content from the web (independent of the original HTML page retrieval), and also react to server-side events as well, adding a truly dynamic nature to the web page experience.

WebAssembly

WebAssembly, supported by all the major browsers (i.e. from the major vendors Google, Apple, Mozilla and Microsoft), is the only alternative to JavaScript for running code in web browsers (without the help of plug-ins, such as Flash, Java or Silverlight; all being discontinued, as browsers are dropping plug-in support). Prior to its adoption, there was asm.js (a subset of JavaScript; and thus strictly works in all browsers), that's also used as a compiler target with efficient support in browsers such as Internet Explorer 11; and for such browsers that do not support WebAssembly directly, it can be compiled to asm.js and those browsers supported that way. Generally speaking programmers do not program in WebAssembly (or asm.js) directly, but use languages such as Rust, C or C++ or in theory any language, that compile to it.

Goals for development

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

Accessibility

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

Performance

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

Speedy development

This technology enables speedy development and saves time.

References

MDN (2020-05-02). "Front-end web developer". Mozilla Developer. Retrieved 2022-07-04.
Refsnes Data (1999-07-04). "Web Development Roadmaps". w3schools. Retrieved 2022-07-04.
Refsnes Data (1999-07-04). "How To Become a Front-End Developer". w3schools. Retrieved 2022-07-04.
Refsnes Data (1999-07-04). "Front end development". w3schools. Retrieved 2022-07-04.
^ Codesido, Ivan (28 September 2009). "What is front-end development?". Theguardian.com. Retrieved 17 January 2019.
"HTML Standard". html.spec.whatwg.org. Retrieved 2024-09-30.
"The web and web standards - Learn web development | MDN". developer.mozilla.org. 2024-08-02. Retrieved 2024-09-30.
"HTML5". w3. October 28, 2014. Retrieved September 30, 2024.
"Web Standards". W3C. Retrieved 2024-09-30.
Abed, Sudad (2019). "Inserting CSS" (PDF).

Categories: