- 00:00:01 what is react react as a JavaScript
- 00:00:05 library that allows us to build engage
- 00:00:07 in client-side web apps so web apps
- 00:00:10 running in the browser but let's take a
- 00:00:13 step back we have our client we have our
- 00:00:15 browser we're sending a request to a
- 00:00:17 server we get back HTML pages this is
- 00:00:20 what you know this is how the web works
- 00:00:22 now let's leave that web world for a
- 00:00:25 second and let's consider a mobile phone
- 00:00:27 with real mobile apps so not web pages
- 00:00:30 but real apps if you think about these
- 00:00:33 apps they're highly engaging we can tap
- 00:00:36 around and we get a really engaging user
- 00:00:38 experience with near-instant responses
- 00:00:41 no page reloads and so on now react
- 00:00:45 helps us to bring parts of that
- 00:00:47 experience or the entire experience to
- 00:00:49 the web we can use react in two
- 00:00:52 different ways the first is to enhance
- 00:00:54 some things of some of the HTML pages we
- 00:00:58 actually can do this with just
- 00:01:00 JavaScript we can execute some code
- 00:01:03 there because it's the only language
- 00:01:05 that runs in the browser after the page
- 00:01:07 has been loaded – for example swap out
- 00:01:10 images on a HTML page to create an image
- 00:01:13 carousel without loading a new page for
- 00:01:15 every click which is far closer to the
- 00:01:18 mobile app experience and react helps us
- 00:01:20 with that it gives us a lot of helpers
- 00:01:22 that makes writing this code much easier
- 00:01:25 than with vanilla JavaScript the second
- 00:01:28 option is to create a single page
- 00:01:29 application here we get rid of two of
- 00:01:32 the pages and we only have one left
- 00:01:33 which is sent back by the server and on
- 00:01:36 that page we again use javascript to
- 00:01:38 re-render everything as needed to really
- 00:01:41 give the user an instant response
- 00:01:42 because we never load a second page any
- 00:01:45 data we need to send from the front end
- 00:01:48 to the server would be done behind the
- 00:01:49 scenes here again we can use react to
- 00:01:53 make that easier so that's the main goal
- 00:01:55 of react make things easier that we
- 00:01:58 could all to do with normal JavaScript
- 00:02:01 react allows us to react to events
- 00:02:03 handle user input update UI dynamically
- 00:02:07 re render parts of the page or the
- 00:02:09 entire page
- 00:02:10 and make all these things easier gift
- 00:02:12 user feedback and so on it allows us to
- 00:02:14 power the entire front end without
- 00:02:16 problems and that's important though the
- 00:02:18 front end doesn't run on the server it
- 00:02:21 runs in the browser
- 00:02:23 speaking off servers we'd return that
- 00:02:26 HTML page for a single page application
- 00:02:28 if we want to exchange data we do this
- 00:02:31 via a checks request and we can also do
- 00:02:33 this with a totally different server
- 00:02:35 react therefore is a collection of tools
- 00:02:38 like jQuery it makes the development
- 00:02:40 easier for us that's its main goal we
- 00:02:43 could do it all with when a lot
- 00:02:44 JavaScript but it would be harder but at
- 00:02:46 the end we use JavaScript with these
- 00:02:48 extra tools