Coding

What is React – academind.com Snippet

2 years ago
  • 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

You may also like