Welcome back.
I want to take one video to just go over thing that might trip up a lot of people when they're first starting
off with React. Remember, React is only a view layer library. Thus React only enables you to build component
driven user interfaces. And, it has some solutions, such as its own local state management, and a simple
way to handle events to make interactions on our website happen.
But at the end of the day, it's a simple library that helps with the view.
Once you start building large scale applications, you need to add on top of React.
The power of React comes from this ability to tack on new features, new libraries to it. In order to
customize it, to your own liking to your own app.
So, as applications grow or you start working for a large company, you'll see them use some other tools
on top of React. And I wanted to go over quickly, some of the ones that are the most common, common to see
out there.
We first have 'REACT ROUTER' and that is for routing.
So changing pages and changing routes in our url, it's pretty much the standard, when it comes to any React and
Redux project.
So highly highly recommended.
Very easy to use.
Very easy to learn as well.
It'll take you a day and you can pick it off fairly easily.
You also have things like utility libraries. And these are libraries that add to the current javascript
tools, that you get out of the box.
So think of it as added functions to javascript.
The most popular are 'Ramda'.
If you wanna really keep the functional programming ideology, a really really good library. And there's
also the most popular 'Lo dash', which again gives you extra tools that you can use with javascript. You also
want to think about styling with React.
And again, there's a number of tools that people use for styling. There's 'glamorous' which I really really
like.
There's, 'styled components' which again is very nice, and quite similar to 'glamorous'.
And then there's things like 'CSS modules'.
Let's say, these three are probably, the best to use, if you want to tack on a smarter way to deal with
styles in React.
And again, these are quite easy to pick up.
You can spend a day on them and get the hang of it.
Next, we have something called the 'gatsby dot js(gatsbyjs)'.
And, this is really really good for static web sites in React.
So that is simple text based websites.
Actually, if you go to the React documentation,
their documentation is actually served with 'gatsby dot js(gatsbyjs)', because well they're just simple text based
pages.
That works really really well.
Then there's also 'Next
dot js', extremely popular for server side rendered apps.
And that's something that we'll talk about when we get to the server side section. And we'll actually
build a simple 'Next.js' app. But very popular and I highly recommend if you're building anything
server side. Next probably what React is known for and I just picked two options here but there are
so many out there.
React is really really good because we're able to build reusable components.
So, if I build a really cool calendar component, I can put it online and other people can just grab that
component, and use it in their projects as well.
So some of the bigger ones are 'material', 'material ui' components, that again you can just use.
And there's also the 'semantic ui' library that has a ton of React components that you can use.
Again, another awesome reason to use React is, these components that people share. And you can just add
on to your website.
And then finally there's tools that make Redux better, more efficient.
You have things like, 'reselect', that you'll see in most Redux projects that help with something called
selectors, and improve the performance of your apps.
You also have things like 'Redux-Saga' which, which handles asynchronous actions in Redux.
So, think of it as redux-thunk but supercharged. So as things get more and more complex, you have
more and more asynchronous actions,
you might wanna start looking at things such as 'Redux Saga'.
It is a little bit complicated to learn it first.
And, there's people that love it and hate it.
But definitely something that tries to solve the problem of
what do we do when we start getting bigger and bigger and bigger apps.
And then, you also have something like 'IMMUTABLE' js, that you can use as a library to make sure that
your state remains immutable and enforce that among your developer teams.
Now, I don't expect you to know every single one of these, and use every single one of these in your projects.
As a matter of fact, I want to caution against them. And every time you add something, ask yourself, do
I really need it?
What's the benefit that I'm getting out of this?
Because adding any library to our project, adds extra weight, adds extra javascript that we need to deliver
to the client.
So make sure, if you're adding any of these things, that you have a justifiable reason that actually improves
the value of your product.
And it also helps with the development.
So when you think of value, don't just think customers and users also think of developer teams and
people you work with. Are they going to benefit if you add 'IMMUTABLE' js to your codebase.
Or, is the extra learning curve and the frustration that, that developers might have by using 'IMMUTABLE', worth
the safeguards that it might add to your project.
But anyway, I wanted to emphasize that, as a senior developer, always consider pros and cons, whether you
need something and if you do need something, really analyze, what is the best tool for the job.
I feel like I'ave broken a record.
I've said this numerous times but, it is a really important concept. So dont just add 'IMMUTABLE' js because
you read it in a blog post, then everybody's raving about it.
Each project is different, so you need to be able to make those decisions for yourself, for your project
for your developer team.
All right, enough talking from me, I'll see you in the next one. Bye-Bye