LESSON 1: FRAMEWORK AND WEB DEVELOPMENT Client-side frameworks

Web Framework • Unlike the server side, client-side frameworks have

nothing to do with business logic. Their work takes
• a software framework that is designed to support
place inside the browser. Thus, one can improve and
the development of web applications including web
implement new user interfaces. Numerous
services, web resources, and web APIs.
animated features can be created with frontend
• provide a standard way to build and deploy web frameworks as well as SPA (single page
applications on the World Wide Web.
applications).
• aim to automate the overhead associated with
• Each of the client-side frameworks differs in
common activities performed in web development
function and use. For comparison purposes, here
• Software tool that provides a way to build and run they are:
web applications. As a result, you don’t need to ➢ Backbone+Marionette
write code on your own and waste time looking for ➢ Angular
possible miscalculations and bugs. ➢ [Link]
Types of Web Frameworks ➢ [Link]

There are two main functions of frameworks: Web Frameworks: Features and Architecture

• server side (backend)

• client side (frontend)

Server-side Frameworks

• The rules and architecture of these frameworks

allows you to create simple pages, landings and
forms of different types
• These frameworks can also form the output data
and improve security in case of web attacks.
• Server-side frameworks work mostly on particular
but important details without which an application
can’t work properly. Here are top backend
frameworks and the languages they work in:
➢ Django - Python
➢ Zend - PHP*
➢ [Link] - JavaScript
➢ Ruby on Rails – Ruby
 avoid clickjacking. As a result, the framework itself is
authentic and authorized.
• The MVC that is, a Model, View and Controller are
the three things each web framework is made of. URL Mapping
• It is considered to be a basic structure, but there can
• If you want to simplify the indexing of your website
be several contrasts among them.
by search engines while creating a clear and eye-
• The model contains all the data and business logic
catching site name, this web frameworks’ feature is
layers, its rules and functions.
custom made for it. URL Mapping can also facilitate
• The view, on the other hand, is responsible for all
access to your sites’ URLs.
visual representations of data, like diagrams, charts
etc. Applications
• As for the controller, it simply converts the input
• Numerous types of web applications are supported
data into the scope of commands of the previous
by web frameworks. The most common and best
ones.
frameworks for app development support the
construction of blogs, forums, general purpose
websites, content management systems, etc.
Web Framework Features
Things to Check Before Choosing a Web Framework
Web Caching
• How old is the development framework?
• Web caching simply helps store different documents
• Is it an open-source option?
and avoids annoying phenomenon of the server
• Consideration of licensing
overload. Users can use it in various systems if
• Documents and plugins availability
several conditions are met. It also works on the
server side. For example, you may notice cached • Ease of beginners, start up and learning curve
patterns
content links on the SERP (Search Engine Results
Page) of a search engine like Google. • Options of default unit testing systems
• Security and protection features
Scaffolding • Future application maintenance, trends, and
support
• This is another important technique to know and
use, which is supported by some MVC frameworks. WEB DEVELOPMENT
Typical parts of application or the entire project
structure (in case of initialization) can be generated • Web development is the building and maintenance
by the framework automatically. This approach of websites; it’s the work that happens behind the
increases the speed of the development cycle and scenes to make a website look great, work fast and
standardizes the codebase. perform well with a seamless user experience.
• A front-end dev takes care of layout, design and
Web template system interactivity using HTML, CSS and JavaScript. They
take an idea from the drawing board and turn it into
• A web template system is a set of different
reality.
methodologies and software implemented to
construct and deploy web pages. Template engines • The backend developer engineers what is going on
are used to process web templates. They are a tool behind the scenes. This is where the data is stored,
for web publishing in a framework. and without this data, there would be no frontend.
The backend of the web consists of the server that
Security hosts the website, an application for running it and
a database to contain the data.
• Online security has plenty of criteria for identifying
• Full stack dev take care of both the front end and
and permitting or rejecting access to different
the back end, and need to know how the web works
functions in a web framework. It also helps
on all levels, in order to determine how the client
recognize the profiles that use the application to
and server sides will relate. Naturally working up to
this level of expertise will take longer, as there is
more to learn.
Lesson 2: API

• The term API is an acronym, and it stands for Client

“Application Programming Interface.”
The HTTP client sends a request to the server in the
• An API (Application Programming Interface) is an
form of a request method, URI, and protocol version,
interface between two applications that enables
followed by a MIME like message containing request
them to communicate with each other.
modifiers, client information, and possible body content
• Any communication between two applications that
over a TCP/IP connection.
involves calling a function from within the first
software and sending a request to retrieve some Server
data from the second software is an API.
The HTTP server responds with a status line, including
• APIs are sets of definitions and protocols that allow
the message's protocol version and a success or error
software components to talk and interact with each
code, followed by a MIME like message containing
other using a simple set of commands.
server information, entity meta information, and
possible entity body content.

API Calls

An API call is the process of a client application

submitting a request to a server's API. An API call also
comprises everything that happens after the request is
submitted. This includes when the API retrieves
information from the server and delivers it back to the
client.

What is API authorization?

• API authorization determines what actions a client

can perform once they are authenticated by the API.
Authentication comes before authorization. This is
where the client's identity is confirmed via an API
key, authentication tokens, or other credentials.
• One common form of authentication used in the
authorization process is an API key.

What is an API key?

• An API key is a unique identifier used to

authenticate calls to an API. The key is made up of a
string of letters and numbers that identify the client.
(Remember, this is the application or site making
HOW IT WORKS
the request.)
• API: The "hidden" portion of a website that is meant Benefits of APIs
for computer consumption
• Server: A powerful computer that runs an API 1. New data available: an API allows all of the
• Client: A program that exchanges data with a server information generated at the government level to
through an API be available to every citizen, not just a select few.
2. Efficiency: when access is provided to an API, the Partner APIs.
content generated can be published automatically
• These APIs are shared externally but only with those
and is available for every channel. It allows it to be
with a business relationship with the API company.
shared and distributed more easily.
Some businesses use partner APIs because they
3. Integration APIs allow content to be embedded
want control over who can access their resources
from any site or application more easily. This
and how they get used.
guarantees more fluid information delivery and an
integrated user experience. Open APIs.
4. Adaptation needs change over time and APIs help
to anticipate changes. When working with this • Open APIs, or public APIs, are available for external
technology, data migration is supported better, and use. While some open APIs are free, others require
the information is reviewed more closely. In short, a subscription fee, which is often tiered based on
APIs make service provision more flexible. usage.

What are APIs used for Benefits of APIs

Data sharing. 1. Automation: with APIs, computers rather than

people can manage the work. Through APIs,
• Any time a program needs to get data from a third agencies can update work flows to make them
party (e.g., a travel app compiling flight times from quicker and more productive.
airlines), data can be shared through an API. 2. Application: because APIs can access the app
components, the delivery of services and
App integrations.
information is more flexible.
• When two digital applications work in conjunction 3. More scope: with an API an application layer can be
HubSpot and Gmail, for example an API is likely created which can be used to distribute information
involved. and services to new audiences which can be
personalized to create custom user experiences
Embedded content.
4. Personalization: through APIs any user or company
• To embed a piece of content that is hosted on a can customize the content and services that they
different website like a YouTube video a request is use the most.
made to the embedded content's owner to retrieve
How to Use an API
it.
1. Select an API.
Internal systems.
2. Choose your authorization method.
• APIs aren't only for sharing data externally.
Businesses frequently divide their software 3. Review the API documentation.
infrastructure into smaller components. These
4. Write a request to an endpoint.
elements communicate with each other through
APIs, like in a microservice architecture. 5. Connect your app.
Types of APIs We have two new concepts here:
Private APIs. • protocol
• format
• These APIs are only made available to a company's
internal team to boost productivity and
transparency. Developers working for the company
can use these APIs as needed. Third party
developers can’t.
Protocol & Format • Body

• The protocol is the set of rules that defines how URL

applications can interact with each other
• is a unique address for a thing (a noun). Which
• Format specifies how the data can be sent to and
things get addresses is entirely up to the business
accessed by other applications.
running the server
• The most used protocol is HTTP, which stands for
• become an easy way for the client to tell the server
Hypertext Transfer Protocol, but SOAP, REST and
which thing it wants to interact with
XML
In a typical REST API, a resource will have two URL
patterns assigned to it:

• Plural or collection: This represents a collection or

group of resources.
• Singular: This respresents a single resource.

Method

• The request method tells the server what kind of

HTTP protocol
action the client wants the server to take. In fact,
• HTTP is the protocol used by web browsers referred the method is commonly referred to as the request
to as clients for communicating with web servers. "verb. “

Here’s how this process looks: There are four main types of methods:

1. The request in this case is sent by the browser, and GET - which means that you want to get data from the
includes the request method, the URI and the second application
protocol version, followed by other information.
POST - you want to create information and add it in the
2. The server receives the request, and runs a program
second application
to process it.
3. The server returns the HTTP response to the PUT - you want to change data in the second application
browser.
DELETE - you want to delete information from the
HTTP GET: Your Safe Bet second application
• The HTTP standard says that a GET request is a HTTP REQUEST
request for a representation. It’s not intended to
Headers
change any resource state on the server. This means
that if you have a URL to a resource and don’t know • provide meta information about a request. They are
anything more, you can always make a GET request a simple list of items like the time the client sent the
and get a representation in return. Your GET request request and the size of the request body.
won’t do something disastrous like delete all the
data. We say that GET is a safe method. Body

HTTP Requests • The request body contains the data the client wants
to send the server.
To make a valid request, the client needs to include four
things: HTTP RESPONSE

• URL (Uniform Resource Locator) In the response, the start line includes:
• Method • the HTTP version,
• List of Headers
• the status code, which tells you whether or not the Understanding REST Headers and Parameters
API transaction worked
Headers
• folders and parameters that indicate where to
search for data and what exactly to look for The REST headers and parameters contain a wealth of
information that can help you track down issues when
How to Read an HTTP Response
you encounter them. HTTP Headers are an important
RESPONSE CODE SAMPLES part of the API request and response as they represent
the meta data associated with the API request and
• 200 (OK) response. Header’s carry information for:
• 301 (Moved Permanently)
• 400 (Bad Request) ➢ Request and Response Body
• 500 (Internal Server Error) ➢ Request Authorization
➢ Response Caching
How to Read an HTTP Response ➢ Response Cookies
• The entity body, sometimes called just the body The headers that you will encounter the most during API
• This is a document written in some data format, testing are the following, you may need to set values for
which the client is expected to understand. these or set assertions against these headers to ensure
• If you think of a GET request as a request for a that they convey the right information and everything
representation, you can think of the entity body as works fine in the API:
the representation
• These are a series of key value pairs describing the • Authorization: Carries credentials containing the
entity body and the HTTP response in general. authentication information of the client for the
resource being requested.
• Response headers are sent between the status code
and the entity body. • WWW Authenticate: This is sent by the server if it
needs a form of authentication before it can
• The most important HTTP header is Content Type,
respond with the actual resource being requested.
which tells the HTTP client how to understand the
Often sent along with a response code of 401, which
entity body. It’s so important that its value has a
special name. means ‘unauthorized’.
• Accept Charset: This is a header which is set with
• We say the value of the Content Type header is the
the request and tells the server about which
entity body’s media type. (It’s also called the MIME
character sets are acceptable by the client.
type or the content type. Sometimes “media type”
is hyphenated: media type.) • Content Type: Indicates the media type (text/html
or text/JSON) of the response sent to the client by
JSON (JavaScript Object Notation) the server, this will help the client in processing the
response body correctly.
• If you’re a web developer, you probably recognize
• Cache Control: This is the cache policy defined by
this entity body as a JSON document.
the server for this response, a cached response can
• In case you don’t, here’s a very quick introduction to
be stored by the client and re used till the time
JSON. JSON, described in RFC 4627, is a standard for
defined by the Cache Control header.
representing simple data structures in plain text. It
uses double quotes to describe strings: Parameters
➢ "This is a string"
REST parameters specify the variable parts of your
➢ It uses square brackets to describe lists: [1, 2, 3]
resources:
➢ It uses curly brackets to describe objects
(collections of key value pairs): {"key": "value “} • the data that you are working with. In a REST
request the resource that you are working with is
specified in the URL Uniform Resource Locator. The
URL is a special case of the URI Uniform Resource
Identifier which consists of four parts:
Sample:

scheme_name:hierarchical_part?query#fragment

RESTful Resources

RESTful service it is very desirable to have all your

resources structured by their hierarchy. These are then
specified in the hierarchical part of the URL.

The hierarchical parts are all

1. required,
2. unique. This means that none of them can be
omitted, and all of them can appear only once.
Certain parts of the URL are going to be fixed (such
as the server’s name, port, and endpoint), and
certain parts are going to be parametrized. The
parametrized parts are often denoted in code and in
documentation by curly braces.

Sample:

[Link]
_id}/{book_id}