Stop Low Resolution Warning Sign

Transcript

Transcript of the tutorial. TOP


          
        
          All right then, gang.

          So I think we've reached the point in the course now where we've nailed all of the JavaScript basics
          
          and we can start to do things which I think are a lot more fun, like interact with a browser or a web
          
          page, and we can do things like add content to a web page with JavaScript, or we could change the
          
          style of a web page with JavaScript, or we could do things like React to use events like click events
          
          when they click on a button.
          
          And we can also do things like create an annoying pop up and I'm going to show you how to do that as
          
          well, because at the end of the day, this is the kind of thing that JavaScript was initially created
          
          for, to make a web page and a user's experience on a web page more interactive.
          
          So we'll be kicking off this chapter by learning, first of all about the document object model.
          
          This is going to be the mothership of this chapter, and everything we do to interact with the browser
          
          is going to be governed by the document object model, also known as the Dom for short.
          
          Then we're going to look at how we can add change and remove content from a web page.
          
          We're also going to talk about user events like click events or mouse move events and see how we can
          
          react to those in JavaScript.
          
          And finally, we'll put everything together that we learn to make a nice little pop up effect on a web
          
          page.
          
          Now for this chapter and pretty much everything going forward, you need to make sure you have your
          
          web server still running so we can preview what to do in the browser.
          
          Now, in one of the first chapters in VS Code, I showed you this package live server and I showed you
          
          how to spin up a local development server using that so we can preview our web pages in it.
          
          But just in case you've forgotten, I'm going to show you again now.
          
          So remember, first of all, you need the live server package installed, so you need to search for
          
          that there.
          
          If you've not got it already, then come to the HTML page that you want to open with the live server.
          
          Right click and go to open with live server and that is going to open it up in a browser so you can
          
          preview it.
          
          So you need to make sure you're running your page on a live server for the rest of this chapter.
          
          And pretty much the rest of the course.