Launching with Composition API with Ben Hong
Project Setup
In this stage, we will be setting up our environment so we're ready for the rest of the mission.
π Resources
π Transcript
00:00:03.090 --> 00:00:04.370 Hey, it's Ben here.
00:00:04.990 --> 00:00:07.970 As the sole engineer on the space station, I'll need your help in order to get
00:00:07.970 --> 00:00:11.540 these tasks fix so that we can launch other explorers into the vast unknown.
00:00:12.410 --> 00:00:15.630 Commander V has requested that we give the new Composition API a go.
00:00:15.860 --> 00:00:17.270 So that's what we'll be using together.
00:00:18.140 --> 00:00:20.990 I'll be here as your guide to assist you since I know this is your first
00:00:20.990 --> 00:00:22.700 time working with the Composition API.
00:00:23.330 --> 00:00:25.760 Before we get started, you'll need to make sure that you have the following
00:00:25.760 --> 00:00:30.065 installed on your machine: git, which you can verify in the terminal with git
00:00:30.065 --> 00:00:34.875 dash dash version, as well as the latest stable version of node, if possible,
00:00:35.055 --> 00:00:38.445 which at the time of this recording is version 14, but you can check this
00:00:38.445 --> 00:00:40.275 by running node dash dash version.
00:00:42.735 --> 00:00:46.035 You also need to clone or for this repository that we have here for you.
00:00:48.225 --> 00:00:50.655 Let's go ahead and pair on this to make sure you have everything you need.
00:00:51.315 --> 00:00:54.165 I'm in my terminal and let's start by checking the get is installed
00:00:54.255 --> 00:00:55.995 by running get desktop version.
00:00:57.135 --> 00:00:59.295 As long as you see the version here, you should be good to go.
00:00:59.655 --> 00:01:03.315 Then we'll also check the node version with no desktop version.
00:01:03.855 --> 00:01:06.045 As you can see here, I'm on version 14.
00:01:06.795 --> 00:01:09.345 Now that we have this, let's go ahead and go over to our browser
00:01:10.065 --> 00:01:15.135 and check out the repo, which is under, get up.com/netlify/explorers.
00:01:15.164 --> 00:01:16.815 That's composition dash API.
00:01:17.805 --> 00:01:22.635 We'll go ahead and clone this by clicking on the clone tab and copying the SSH URL.
00:01:23.985 --> 00:01:25.544 And jumping back into our terminal.
00:01:25.964 --> 00:01:27.945 We'll go ahead and go inside of my projects directory.
00:01:28.515 --> 00:01:30.074 And I'm going to go ahead and click it in here.
00:01:32.985 --> 00:01:33.735 Now it's closed.
00:01:33.764 --> 00:01:35.985 I'll go ahead and change the directory into our explorers
00:01:35.985 --> 00:01:37.274 composition API project.
00:01:38.475 --> 00:01:42.014 And then we'll go ahead and run npm install to install all of our dependencies
00:01:45.464 --> 00:01:46.985 Now that everything's installed correctly.
00:01:47.074 --> 00:01:50.255 Let's go ahead and start up our local server by running NPM run.
00:01:50.255 --> 00:01:50.675 Serve.
00:01:53.009 --> 00:01:59.460 Now when we visit our localhost:8080, and our browser, we should see
00:01:59.550 --> 00:02:01.169 our app running as expected.
00:02:01.889 --> 00:02:03.899 And now that you're up and running, it's time for us to
00:02:03.899 --> 00:02:05.490 talk about the composition API.
00:02:06.000 --> 00:02:07.110 See you in the next video.