Content deleted Content added
dc section headers |
rm confusing duplicate section numbers |
||
Line 13:
== Evolution of the World Wide Web and web development ==
====
Tim Berners-Lee created the [[World Wide Web]] in 1989 at CERN.<ref>{{Cite web |date=2023-12-04 |title=A short history of the Web |url=https://home.cern/science/computing/birth-web/short-history-web |access-date=2023-12-10 |website=CERN |language=en}}</ref>
Line 20:
Web 1.0 is described as the first paradigm wherein users could only view material and provide a small amount of information.<ref name=":02">{{Cite journal |last=Soni |first=Anuj |last2=Gupta |first2=Sachin |last3=Talwandi |first3=Navjot Singh |date=September 2023 |title=Evolution Of Web Technologies in Recent Years |url=https://www.jetir.org/papers/JETIR2309347.pdf |journal=Journal of emerging technologies and innovative research |volume=10 |issue=9 |issn=2349-5162}}</ref> Core protocols of web 1.0 were [[HTTP]], HTML and [[Uniform Resource Identifier|URI]].<ref name=":1">{{Cite web |title=Some Trends in Web Application Development {{!}} IEEE Conference Publication {{!}} IEEE Xplore |url=https://ieeexplore.ieee.org/document/4221621/ |access-date=2023-11-30 |website=ieeexplore.ieee.org |doi=10.1109/fose.2007.26}}</ref>
====
[[Web 2.0]], a term popularised by Dale Dougherty, then vice president of O'Reilly, during a 2004 conference with Media Live, marks a shift in internet usage, emphasizing interactivity.<ref>{{Cite web |title=Web 2.0 |url=http://www.paulgraham.com/web20.html |access-date=2023-12-10 |website=www.paulgraham.com}}</ref><ref>{{Cite web |date=2007-12-28 |title=How Web 2.0 Works |url=https://computer.howstuffworks.com/web-20.htm |access-date=2023-12-10 |website=HowStuffWorks |language=en-us}}</ref>
Line 27:
In the realm of Web 2.0 environments, users now have access to a platform that encourages sharing activities such as creating music, files, images, and movies.<ref>{{Cite web |last=Hall |first=Heather |date=2022-05-01 |title=Web 2.0 Explained: Everything You Need To Know |url=https://history-computer.com/web-2-0/ |access-date=2023-12-10 |website=History-Computer |language=en-US}}</ref> The architecture of Web 2.0 is often considered the "backbone of the internet," using standardized [[XML]] (Extensible Markup Language) tags to authorize information flow from independent platforms and [[online database]]s.<ref name=":02" />
====
[[Web3|Web 3.0]], considered the third and current version of the web, was introduced in 2014. The concept envisions a complete redesign of the web. Key features include the integration of [[metadata]], precise information delivery, and improved [[user experience]]s based on preferences, history, and interests.
Line 36:
However, Web 3.0 poses challenges, such as the need for advanced web design expertise, difficulty in identifying a user's ID, and increased client requests to servers, making it more complex to build an intelligent web.
====
Web 4.0 is presented as the most advanced web technology with intelligent and highly interactive features. Web 4.0 is also known as symbiotic web. Web 4.0 is still in its early stages, yet it has already had a significant impact on how people use the World Wide Web. Web 4.0 aims to be an all-encompassing technology, merging the best features of Web 2.0 and Web 3.0.
Line 66:
A typical Web Development process can be divided into 7 steps-
===
Debra Howcraft and John Carroll proposed a methodology in which web development process can be divided into sequential steps. They mentioned different aspects of analysis.<ref name=":2">{{Cite web |last=Howcroft |first=Debra |last2=Carroll |first2=John |date=2000 |title=A proposed methodology for web development. |url=https://aisel.aisnet.org/ecis2000/73/}}</ref>
Line 93:
Following this analysis, a more refined set of objectives is documented. Objectives that cannot be presently fulfilled are recorded in a Wish List, constituting part of the Objectives Document. This documentation becomes integral to the iterative process during the subsequent cycle of the methodology.<ref name=":2" />
===
It is crucial for [[web developer]]s to be engaged in formulating a plan and determining the optimal architecture and selecting the [[Software framework|frameworks]].{{cn}} Additionally, developers/consultants play a role in elucidating the total cost of ownership associated with supporting a website, which may surpass the initial development expenses.
Line 102:
* [[Solution stack|Tech stack]]
===
Following the analysis phase, the development process moves on to the [[Web design|design]] phase, which is guided by the objectives document. Recognizing the incremental growth of websites and the potential lack of good design architecture, the methodology includes iteration to account for changes and additions over the life of the site. The design phase, which is divided into [[Information design|Information Design]] and [[Graphic design|Graphic Design]], results in a detailed Design Document that details the structure of the website, [[Data structure|database data structures]], and [[Common Gateway Interface|CGI]] scripts.
Line 113:
* Approval
===
No matter how visually appealing your website is, good communication with your clients is critical. The primary purpose of content production is to create a communication channel through the [[user interface]] by delivering relevant information about your firm in an engaging and easily understandable manner. This includes:
Line 124:
The stage of content production is critical in establishing the branding and marketing of your website or web application. It serves as a platform for defining the purpose and goals of your online presence through compelling and convincing content.
===
During this critical stage, the website is built while keeping its fundamental goal in mind, paying close attention to all graphic components to assure the establishment of a completely working site.
Line 133:
The coding process includes creating all of the site's software and installing it on the appropriate [[Web server|Web servers.]] This can range from simple things like posting to a Web server to more complex tasks like establishing [[database]] connections.
===
In any web project, the testing phase is incredibly intricate and difficult. Because [[Web application|web apps]] are frequently designed for a diverse and often unknown user base running in a range of technological environments, their complexity exceeds that of [[Information system|traditional Information Systems]] (IS). To ensure maximum reach and efficacy, the website must be tested in a variety of contexts and technologies. The website moves to the delivery stage after gaining final approval from the designer. To ensure its preparation for launch, the quality assurance team performs rigorous testing for functionality, compatibility, and performance.
Line 144:
* Check [[Web browser|Browser]]
===
The web development process goes beyond deployment to include a variety of post-deployment tasks.
Line 163:
The goal of [[Front-end web development|front-end development]] is to create a website's [[user interface]] and visual components that users may interact with directly. On the other hand, [[Frontend and backend|back-end development]] works with databases, server-side logic, and application functionality. Building reliable and user-friendly online applications requires a comprehensive approach, which is ensured by collaboration between front-end and back-end engineers.
===
[[Front-end web development|Front-end development]] is the process of designing and implementing the user interface (UI) and [[user experience]] (UX) of a [[web application]]. It involves creating visually appealing and interactive elements that users interact with directly. The primary technologies and concepts associated with front-end development include:
====
The 3 core technologies for front- end development are-
Line 173:
* '''JavaScript-''' It is used to add interactions to the web pages. Advancement in [[JavaScript]] has given rise to many popular front- end frameworks like React, Angular and Vue.js etc.
====
[[User experience design]] focuses on creating interfaces that are intuitive, accessible, and enjoyable for users. It involves understanding user behavior, conducting usability studies, and implementing design principles to enhance the overall satisfaction of users interacting with a website or application. This involves [[Website wireframe|wireframing]], [[Software prototyping|prototyping]], and implementing design principles to enhance user interaction. Some of the popular tools used for UI Wireframing are -
Line 186:
Another key aspect to keep in mind while designing is [[Web accessibility|Web Accessibility]]- Web accessibility ensures that digital content is available and usable for people of all abilities. This involves adhering to standards like the [[Web Content Accessibility Guidelines]] (WCAG), implementing features like alternative text for images, and designing with considerations for diverse user needs, including those with disabilities.
====
It is important to ensure that web applications are accessible and visually appealing across various devices and screen sizes. [[Responsive web design|Responsive design]] uses CSS media queries and flexible layouts to adapt to different viewing environments.
====
A [[Web framework|framework]] is a high-level solution for the reuse of software pieces, a step forward in simple library-based reuse that allows for sharing common functions and generic logic of a ___domain application.<ref name=":3">{{Cite journal |last=Salas-Zárate |first=María del Pilar |last2=Alor-Hernández |first2=Giner |last3=Valencia-García |first3=Rafael |last4=Rodríguez-Mazahua |first4=Lisbeth |last5=Rodríguez-González |first5=Alejandro |last6=López Cuadrado |first6=José Luis |date=May 2015 |title=Analyzing best practices on Web development frameworks: The lift approach |url=https://linkinghub.elsevier.com/retrieve/pii/S0167642314005735 |journal=Science of Computer Programming |language=en |volume=102 |pages=1–19 |doi=10.1016/j.scico.2014.12.004|doi-access=free }}</ref>
Line 198:
* '''[[Vue.js]]:''' A progressive JavaScript framework that is approachable yet powerful, making it easy to integrate with other libraries or existing projects.
====
Managing the state of a web application to ensure data consistency and responsiveness. State management libraries like [[Redux (JavaScript library)|Redux]] (for [[React (software)|React]]) or [[Vuex]] (for [[Vue.js]]) play a crucial role in complex applications.
===
[[Server-side|Back-end development]] involves building the server-side logic and [[database]] components of a [[web application]]. It is responsible for processing user requests, managing data, and ensuring the overall functionality of the application. Key aspects of back-end development include:
====
An essential component of the architecture of a web application is a [[Server (computing)|server]] or [[Cloud computing|cloud instance]]. A [[Cloud computing|cloud instance]] is a virtual server instance that can be accessed via the [[Internet]] and is created, delivered, and hosted on a public or private cloud. It functions as a physical server that may seamlessly move between various devices with ease or set up several instances on one server. It is therefore very dynamic, scalable, and economical.
====
[[Database management]] is crucial for [[Data storage|storing]], [[Data retrieval|retrieving]], and managing data in web applications. Various database systems, such as [[MySQL]], [[PostgreSQL]], and [[MongoDB]], play distinct roles in organizing and structuring data. Effective database management ensures the responsiveness and efficiency of data-driven web applications. There are 3 types of databases:
Line 223:
The choice of a database depends on various factors such as the nature of the data, scalability requirements, performance considerations, and the specific use case of the application being developed. Each type of database has its strengths and weaknesses, and selecting the right one involves considering the specific needs of the project.
====
[[API|Application Programming Interfaces]] are sets of rules and protocols that allow different software applications to communicate with each other. APIs define the methods and data formats that applications can use to request and exchange information.
Line 234:
* '''Operating System APIs:''' These APIs allow applications to interact with the underlying [[operating system]], accessing features like file systems, hardware, and system services.
====
[[Programming language]]s aimed at server execution, as opposed to client browser execution, are known as [[Server-side scripting|server-side languages]]. These programming languages are used in web development to perform operations including [[data processing]], database interaction, and the creation of [[Dynamic web page|dynamic content]] that is delivered to the client's browser. A key element of server-side programming is [[server-side scripting]], which allows the server to react to client requests in real time.
Line 249:
# '''Perl:''' [[Perl]] is a versatile scripting language often used for web development. It is known for its powerful [[Text processing|text-processing]] capabilities.
====
Implementing security measures to protect against common vulnerabilities, including [[SQL injection]], [[cross-site scripting]] (XSS), and [[cross-site request forgery]] (CSRF). [[Authentication]] and [[authorization]] mechanisms are crucial for securing data and user access.
====
Thorough [[Web testing|testing]] and [[debugging]] processes are essential for identifying and resolving issues in a web application. Testing may include [[unit testing]], [[integration testing]], and [[Acceptance testing|user acceptance testing]]. Debugging involves pinpointing and fixing errors in the code, ensuring the reliability and stability of the application.
Line 259:
* '''Continuous Integration and Deployment (CI/CD):''' [[CI/CD]] pipelines automate testing, [[Deployment environment|deployment]], and delivery processes, allowing for faster and more reliable releases.
===
Full-stack development refers to the practice of designing, building, and maintaining the entire [[Solution stack|software stack]] of a web application. This includes both the [[Client-side|frontend]] (client-side) and [[Server-side|backend]] (server-side) components, as well as the [[database]] and any other necessary infrastructure. A full-stack developer is someone who has expertise in working with both the frontend and backend technologies, allowing them to handle all aspects of web application development.
* '''[[MEAN (solution stack)|MEAN]]''' (MongoDB, Express.js, Angular, Node.js) and '''[[MEAN (solution stack)|MERN]]''' (MongoDB, Express.js, React, Node.js) are popular full-stack development stacks that streamline the development process by providing a cohesive set of technologies.
===
Efficient web development relies on a set of tools and environments that streamline the coding and collaboration processes:
Line 282:
== AGILE Methodology in Web Development ==
===
[[Agile software development|Agile]] is a set of principles and values for software development that prioritize flexibility, collaboration, and customer satisfaction. The four key values are:
Line 290:
* Responding to change over following a plan.
===
# '''Iterative and Incremental Development:''' Building and refining a web application through small, repeatable cycles, enhancing features incrementally with each iteration.
Line 300:
# '''Continuous Integration and Continuous Delivery (CI/CD):''' Implementing automated processes to continuously integrate code changes and deliver updated versions, ensuring a streamlined and efficient development pipeline.
== Trends and
The future of web development holds exciting possibilities as the digital landscape continues to evolve at a rapid pace. As we navigate through the technological advancements of the coming years, several trends are poised to shape the way we build and interact with websites. Some potential future trends in web development are:{{cn}}
* [[WebAssembly]] (Wasm)
| |||