We ended the previous lecture with a question,
is React a library or is it a framework and what exactly is React?
Let's examine these questions in a bit more detail in this lecture.
Let's start out with the very first question.
What exactly is React and how is it different from
the other frameworks or libraries that we have mentioned in the previous lecture?
When you visit React website,
you see it clearly specified right on
the front page that React is a JavaScript library for building user interfaces.
Now again, depending on who you ask some people tend to
call React a library and others tend to call it a framework.
Now, let's not bother ourselves
too much in splitting our hairs over whether it is a framework,
or a library but let's concentrate more on what it actually helps us accomplish.
It is more important for us to understand that rather
than worrying about whether it is a framework or a library.
The React approach to implementing them applications is what we are after in this course.
So, React also states that it uses a declarative approach.
Now that leaves you in a confused state because we
saw that frameworks generally tend to use the declarative approach.
But in React, the declarative approach used by React
as specified on its website says that,
it makes it easy to create interactive UIs
with simple views for each state within your application.
And also React takes care of automatically updating the UI and then rendering
any changes to their specific components as required on your page.
You just heard me mentioning the term Component.
React Indeed is a component based approach.
In a Component based approach,
we encapsulate behaviors into small units called Components.
We will examine Components in more detail in the next lesson.
There it will become more clear to you how,
and why a component based approach is useful for
implementing our Web applications in React.
Furthermore, React makes no assumptions about
the entire technology stack that you're going to
use for implementing your Web applications.
React plays well with any technology stack that you can use behind the seats.
React itself concentrates only on the user interface side of the story,
and that leaves it up to the application designer to decide how they want to
implement the architecture and how they want
your application to interact with the back-end server.
So, as we go through this course,
we will examine one approach that we use for implementing
the entire technology stack which includes the Flux architecture approach,
and in specifically the use of Redux for implementing a state based storage for
our Web application and also the use of Fetch for interacting with our back-end server.
Again I've mentioned a few terms like Flux, Redux, and Fetch.
We will examine these towards the second half of this course.
It's obviously useful to examine the history behind the React approach.
So, to understand where React originated,
and how it came about to the state it is today.
React was first designed by Jordan Walke who was part of the Facebook team.
It was first deployed for Facebook's news feed around 2011.
Subsequently in 2013, React was open sourced at this JS conference.
React took off as an approach for implementing Web applications from then onwards.
React is designed for speed,
speed of implementing the application, simplicity, and scalability.
So, the three essence of React,
and why it has become so popular in the real value.
So, as we examine React more in this course,
you'll become more and more familiar with why
this approach is very suited for implementing Web applications.
As you enter the React world you will be bombarded with
a lot of vocabulary that is used in the React world.
So, you will hear people talking about One-way data
flow especially in the context of the Flux Architecture.
You will often hear people mentioning about JSX,
we will examine JSX in the very next lecture and understand
what role it plays in developing a React application.
We'll hear about Components which we will examine in
the next lesson and also in the second module of this course in more detail and
we'll here about the state and how
a React Component interacts with
the state of your application and the way you store the state of your application,
or do you store the state in a specific component.
We'll also hear about Props,
a way of passing data between the various components.
Also we'll hear about Virtual Dom,
and how is it different from Real DOM.
Why React manipulate the Virtual DOM,
and how the Virtual DOM eventually gets incorporated,
or rendered onto the Real DOM.
And Element, the React Element,
which is the smallest unit of building up a React application.
A component being a collection of React elements.
Then we hear about the Flux and Redux architectures in a bit more detail.
Again, as we go along this course we will examine
these concepts and these terminology in more detail.
Again, don't get overwhelmed with the vocabulary that you hear in the React world.
If you learn step by step,
you'll begin to pretty soon get a very good handle on all this vocabulary and
you can easily go ahead and impress people by throwing these words at them,
and trying to impress them or how much you know about React.
So, this is the jargon that you will end up learning also at the end of this course.
Enough of the jargon.
Let's go ahead and get our hands dirty by
starting to build a full fledged React application,
which will form part of all the exercises as you go through the rest of this course.
We will start with our first exercise where we'll install the create-react-app,
which we will use to scaffold out our very first React application in the first exercise,
and then we will start building upon this application throughout
the remaining exercises of this course.
Jogesh K. MuppalaAssociate Professor
