How Web Applications Work
Understand how web applications function by learning about MongoDB as a flexible NoSQL database, Node.js as a JavaScript server environment, and Angular as a front-end framework. This lesson helps you grasp the basics of modern web development components essential for building dynamic, interactive applications.
We'll cover the following...
MongoDB
MongoDB is an open-source NoSQL (also referred to as a non-relational or document-oriented) database that represents and stores data in JSON-format documents. Relational databases such as Microsoft SQL Server, MySQL, and PostgreSQL represent and store data in tables using rows
In relational databases, each table has a schema that defines the columns and data types for each row in the table. In non-relational or document-oriented databases, there’s no defined schema, and every document can be structured differently. This gives non-relational databases more flexibility with documents. We can update these without the need to modify database schemas to include any new columns along with their data types.
This doesn’t mean that non-relational databases are better than relational databases. Like with most engineering decisions, the right tool depends on the job. Because this course focuses on front-end development, we won’t be doing much with our database other than writing and reading data through the API. That said, it’s worth knowing the two types of databases (relational and non-relational) and some of the common database names you may encounter.
Node.js
Node.js is an open-source, cross-platform run-time environment for executing JavaScript code server-side. Historically, JavaScript was used for client-side scripting with scripts embedded in a webpage’s HTML.
Node.js enables JavaScript to script server-side and potentially produce dynamic web page content before a page is sent to a user’s browser.
Note: In our case, Node.js won’t produce our web pages. Instead, it will receive and send data to our Angular application that generates the web pages our user sees. We’ll explore this in more detail soon.
As a result of Node.js, web application development can now revolve around a single programming language rather than rely on a separate language to write server-side scripts. Node.js is a server-side scripting language much like Go, Ruby, Python, PHP, Java, or C#.
While Node.js is a package manager, npm. npm is bundled with Node.js and allows developers to use a variety of packages to extend Node.js functionality.
When we set up our API, we’ll be using npm to install some packages that were used to build our Angular application’s API.
Angular
Angular is a TypeScript based open-source front-end framework built by Google. Note that Angular is not at all related to AngularJS, an earlier framework also written by Google…
Like many other front-end frameworks, Angular provides features for writing modern web applications. These include:
- A file structure to organize our application
- A command-line interface that creates files.
- Modules and components to group our HTML, CSS, and client-side scripting (TypeScript/JavaScript)
- Forms for gathering user input
- Services to interact with 3rd party APIs
- Routing for our application’s various pages.
Some of these features will become more as we use them, but the primary takeaway is that a framework gives us an easy way to use our HTML, CSS, and TypeScript knowledge to build web applications without having to build each feature ourselves.
Frameworks analogy
You can think of frameworks as a level creator for the web. In a video game’s level creator, there are certain assets available for use, such as structures, textures, enemies, or items. You may even be given the option to build a structure from base components to create a new structure that you can re-use and share with others. Web frameworks essentially do the same thing. Rather than providing us textures and structures that exist within the game’s universe, however, we’re given the various tools we need to create modern web applications such as routing, form builders, form validation, and services to abstract many of the details of making HTTP requests from us. It gives us the basic building blocks for creating a web application.