JavaScript for Modern Web Development

Building a Web Application Using HTML, CSS, and JavaScript

Alok Ranjan

• Publisher: BPB Publications
• Year: 2020
• ISBN:
  9789389328721
• Topic: Informatik
• Subtopic: Webprogrammierung

Beginner to Expert in Web development with JavaScript: From HTML to React-Redux Key Features

• Acquire web development skills to build independent applications
• Learn the basics of HTML, CSS, JavaScript, React and Redux
• Understand how they can be used to build beautiful applications
• Learn how to debug and unit test your applications properly to build good end products
• Follow best practices to write good quality code and build performant applications
• 
  Description
  This book will take you on a complete journey of learning web development, starting right with the basics. The book begins with the history of web development and JavaScript, how it has evolved over these years, and how it still keeps growing with new features. Next, you will learn the basic pillars of web development - HTML, CSS, and JavaScript.
  You will learn about the functional, object-oriented programming and asynchronous behaviour, and how JavaScript provides for these. Empowered with the basics, you will proceed to learn the new features of JavaScript, ES2015, and the latest ES2019. Next, you will apply your learning to build a real application to see how the Web takes shape.
  At the end, you will also have an introductory section on ReactJS, one of the modern frameworks for UI development and also develop a simple weather application using React. What will you learn
  By the end of the book, you will be building real web applications to put your knowledge to practice. This book introduces all the concepts to get started with web application development. To further excel in this field, you really need to practice by building a lot many applications, implementing your own ideas or imitating existing websites.
  

CHAPTER 1

History of JavaScript and How it Revolutionized Web Development

“We are all now connected by the Internet, like neurons in a giant brain.”

― Stephen Hawking, one of the most influential scientists of this era.

From the initial hesitant reception of the first proposal of the web to more than 1 billion websites on the internet today, the web has grown exponentially. It continues to grow with 4.1 billion Internet users in the world as of December 2018. JavaScript, the simple scripting language which came into existence to be able to add dynamicity and interactiveness to the web quickly, rose from very humble beginnings to become a powerful language and continues to grow in its features. The power of JavaScript is the real reason behind the growth of the web and its capabilities, because of the ease with which JavaScript facilitates modern web development for both client-side as well as server-side. Be it pure vanilla JavaScript or the JavaScript in the form of frameworks like React and Node, and JavaScript has become next to irreplaceable in the world of web development.

Structure

• A brief history of the World Wide Web
• Web transition over the years
• Advent of JavaScript
• ECMAScript –Standardization of JavaScript
• Role of JavaScript in modern web development

Objective

After studying this chapter, you will get an understanding of the history of the web and JavaScript and also how it has grown in terms of new features as well as in the form of various frameworks and libraries.

A brief history of the World Wide Web

In March 1989, Sir Tim Berners-Lee anticipated the need for an information management system to be able to share data globally and submitted a proposal for the same. The response of his boss Mike Sendall was ‘Vague, but exciting’ and he got the approval to proceed. He designed a new way of accessing the information on other computers and called his creation, the World Wide Web.

By October 1990, Tim had written the three fundamental technologies that formed the rock-solid foundation of the world wide web:

• HyperTextMarkup Language (HTML): It is the markup language for creating content on the web.
• Uniform Resource Identifier (URI): It is the unique address used to identify each resource on the web, also commonly called a URL(Uniform Resource Locator).
• HyperText Transfer Protocol (HTTP): It is the protocol for access to linked resources from across the web.

From http://info.cern.ch/, the address of the world’s first website and Web server, running on a NeXT computer at CERN, the web continued to grow with simple line-mode browsers to Mosaic 1.0 being the first web browser to allow images and text to load on the same page. Netscape Navigator was launched in 1994, which became a huge hit.

Sir Tim Berners-Lee founded the World Wide Web Consortium (W3C), to make sure the web stays free and accessible to all. His vision of the World Wide Web was of an open, universal space, where anyone and everyone was free to express their ideas and showcase their creativity. This freedom initiated an astounding transformation in the world, bringing out the best of innovation that has changed the world in the last three decades.

Web transition over the years

Over the years, the web has seen major changes, starting from the mostly read-only, shareable web1.0 to socially enabling web 2.0 to highly intelligent and powerful 3.0, and it continues to evolve and grow:

Figure 1.1: Web Transition over the years
(Image reference: Radar Networks and Nova Spivac 2007, www.radarnetworks.com)

Web 1.0

You have content to share? Share it!

It started with Web 1.0, the first phase of web development, the read-only web where the content was mostly static with hyperlinks to view the content and bookmarking to save the links. The emails were sent through HTML forms.

It was mostly to share content over the web with minimal user interaction or content generation during the interaction. The content of the website was stored in files on the server from where the data was retrieved and rendered on the client on receiving a request. The comments given by the visitors were added to a common Guestbook page rather than to the direct content to avoid slowing down the website. The users could search for content and read it, so it is sometimes referred to as the “read-only web”.

Web 2.0

Do you have an opinion? Speak up!

With the arrival of databases, upgraded servers, improved connection speeds, the static Web1.0 transitioned to the interactive Web 2.0. Now the user was also creating live content on the web through comments, tweets, videos, and posts. This phase saw the advent and growth of social media giants like Facebook and Twitter, video streaming website like YouTube. The focus shifted on user experience as the user was also a participant in creating web content. Also, there was added capability to include content from one website into some other external website through the use of APIs (application programming interfaces).

The web was becoming more and more powerful with the capabilities at hand being limitless. What came next was nothing less than miraculous!

Web 3.0

You don’t need to live with inefficiencies! You get what you ask for!

The third generation web can be coined as the intelligent web comprising of semantic web technologies, distributed databases, distributed computing, micro-formats, natural language processing, data mining, machine learning and reasoning, recommendation agents, and artificial intelligence technologies. Now the machines are empowered to understand and decode the information and provide a more intuitive user experience where they understand exactly what the user has searched for.

What lies beyond is the extent of where our imagination and innovation can take us!

Advent of JavaScript

JavaScript was created by Brendan Eich in 1995 during his association with Netscape Communications.

Netscape was the most popular browser at those times, but it was being threatened by the arrival of Microsoft’s Internet Explorer. To combat this, Netscape partnered with Sun so that they could be the official browser of the much-awaited Sun’s platform – Java, and maintain their popularity.

JavaScript came out as a result of the need to make the web dynamic. It was positioned as an easy to use language which even the Web designers and part-time developers could use to put together components such as images and plugins directly into the Web page markup.

It was developed under the name Mocha, first shipped as LiveScript and later changed to JavaScript just to position it as a companion to Java and benefit from the ongoing marketing value of the hot programming language.

Bui-in a rush to be placed as Java’s companion, there were many features of JavaScript which were disliked by the users for being a deviation from the other programming languages of that time which the users were habituated to use.

Some of such features include:

• AutomaticSemicolon Insertion (ASI)
• Automatic type coercion when using common operators like ‘==’
• Lack of block scoping
• Lack of classes
• Lack of dedicated modularization capability
• Unusual inheritance (prototypical)

Netscape released JavaScript for browsers in December 1995,and also introduced an implementation of the language for server-side scripting.

From the very humble beginnings of being a companion to becoming the de-facto standard language of the web, JavaScript has come a really long way.

Despite the criticisms and multiple attempts by huge companies to suppress and replace, JavaScript continues to grow, as it is open, standardized, and a powerful language tightly coupled with the DOM and the best way to make dynamic we...