1 00:00:00,810 --> 00:00:04,770 In the last section we spoke about a couple of different questions we might have had after we went over 2 00:00:04,770 --> 00:00:06,620 that little code pen project. 3 00:00:06,660 --> 00:00:08,060 Now we're going to start to move forward. 4 00:00:08,070 --> 00:00:11,130 The first big topic that we're going to talk about is GSX. 5 00:00:11,220 --> 00:00:15,090 So I want to make sure that you have a really solid footing in it and understand a lot of the rules 6 00:00:15,090 --> 00:00:17,360 behind it and exactly how it behaves. 7 00:00:17,460 --> 00:00:23,320 Now in order to learn more about GSX we need to be able to write GSX in the first place. 8 00:00:23,370 --> 00:00:27,530 We need someplace we can write this code out and then mess around with it a little bit. 9 00:00:27,570 --> 00:00:33,310 Now so far we wrote a little bit of GSX overon code pen and code pen is fantastic it's a great tool. 10 00:00:33,330 --> 00:00:35,680 We're going to use it several times throughout this course. 11 00:00:35,700 --> 00:00:41,640 However my goal in this course overall is to make sure that you understand how to work on professional 12 00:00:41,640 --> 00:00:43,670 grade react projects. 13 00:00:43,740 --> 00:00:49,230 So rather than continuing to use code pen we're going to move over to our local code editors and we're 14 00:00:49,230 --> 00:00:54,630 going to generate a project on your computer that's going to more closely emulate how professionals 15 00:00:54,630 --> 00:01:01,170 work on re-act projects rather than using code then we need to generate a new project or new reac projects 16 00:01:01,170 --> 00:01:04,170 on your local computer in order to do so. 17 00:01:04,170 --> 00:01:08,550 We're going to go through a couple of different steps each of the steps that you see right here are 18 00:01:08,550 --> 00:01:12,890 pretty straightforward but understanding what's going on is a little bit more challenging. 19 00:01:12,900 --> 00:01:17,400 The first thing we have to do is make sure that you have no Jaz installed on your local machine. 20 00:01:17,520 --> 00:01:22,380 After that we're going to install a tool called create react up which we're going to use to generate 21 00:01:22,440 --> 00:01:23,910 a new re-act project. 22 00:01:24,000 --> 00:01:27,660 And after that we can then start to play around with GSX a little bit. 23 00:01:27,660 --> 00:01:31,800 Now in this video in particular I want to focus on just making sure that you have no just installed 24 00:01:31,830 --> 00:01:32,950 on your local machine. 25 00:01:33,800 --> 00:01:38,990 As a quick note if you know that you already have no genius installed then feel free to pause this video 26 00:01:38,990 --> 00:01:40,550 and move onto the next video. 27 00:01:40,550 --> 00:01:42,940 Otherwise stick around. 28 00:01:42,950 --> 00:01:47,300 Now if you're not sure if you have node already installed in your local machine you can open up a terminal 29 00:01:47,480 --> 00:01:54,000 and run the command node dash V like so when you run that command you should see a number like disappear. 30 00:01:54,020 --> 00:01:58,010 If you don't see your number if you see an error message that says command not recognized or command 31 00:01:58,010 --> 00:02:02,720 not found that means that you probably don't have node installed and you need to go through the installation 32 00:02:02,720 --> 00:02:03,720 process. 33 00:02:03,800 --> 00:02:07,580 So let's do that together right now in order to install node. 34 00:02:07,670 --> 00:02:11,770 We're going to open up a new browser tab and navigate to that link you see on the screen. 35 00:02:12,970 --> 00:02:18,280 So I'm going to take that link I can open up a new tab and I'm going to navigate to it and then you'll 36 00:02:18,280 --> 00:02:23,480 see a page like this appear note Jesus installation process is pretty straightforward. 37 00:02:23,580 --> 00:02:28,010 You'll pick the installer for your particular operating system and then if you're on Linux you can get 38 00:02:28,010 --> 00:02:30,640 the Linux version down here as well. 39 00:02:30,680 --> 00:02:34,320 So I'm on Mac OS so I would download the Mac OS installer. 40 00:02:34,370 --> 00:02:35,730 It's a pretty quick download. 41 00:02:35,780 --> 00:02:40,170 I have nonetheless gone ahead and download ahead of time so you don't have to watch me download it. 42 00:02:41,370 --> 00:02:44,610 So once you download that installer you'll see a window like disappear. 43 00:02:44,610 --> 00:02:47,880 Even if you're on Windows you're going to see a very similar message. 44 00:02:47,940 --> 00:02:51,580 All we have to do here is click Continue continue continue and so on. 45 00:02:51,720 --> 00:02:53,030 And that's pretty much it. 46 00:02:53,830 --> 00:03:00,210 Then after you go through the installation process we can then open up our terminal again and make sure 47 00:03:00,210 --> 00:03:02,690 that node was successfully installed by running it. 48 00:03:02,700 --> 00:03:04,210 Note that Dasch the. 49 00:03:04,350 --> 00:03:05,860 You should see a number appear. 50 00:03:06,060 --> 00:03:09,870 Now if you don't see that number appear after going through the installation process that's totally 51 00:03:09,870 --> 00:03:10,680 fine. 52 00:03:10,890 --> 00:03:16,500 As a quick note in order to get that number to appear you might have to restart your terminal. 53 00:03:16,500 --> 00:03:19,800 You probably don't have to restart your whole computer just your terminal. 54 00:03:19,800 --> 00:03:24,450 Make sure you close down and quit every terminal or command line window you have open and then started 55 00:03:24,450 --> 00:03:28,320 back up and try running node Dashti again. 56 00:03:28,590 --> 00:03:28,890 All right. 57 00:03:28,890 --> 00:03:33,150 So assuming that everything got set up A-OK Let's continue in the next section where we're going to 58 00:03:33,150 --> 00:03:33,860 download this. 59 00:03:33,870 --> 00:03:37,750 Create re-act up tool and then use it to generate a new project. 60 00:03:37,780 --> 00:03:39,840 It's a quick break and I'll see you in just a minute.