Creating a Local Development Environment

[00:00:00]
>> So before we start building our applications on our local development environment, we have some tools that we need to download. Node js is one, emulator is another one. And if you're on iOS devices, WebEx are vivre. And one thing that we will be doing is serving our pages and save just opening the files.

[00:00:27]
So we need a web server you can use any server. If you would like to use the Python server or create your own. You can do that but if you don't want to deal with that, one extension that is really useful is the web server for Chrome. What you do is you just give the whole folder structure to it and it's serves all files starting from index.html.

[00:00:55]
So, this is the cultural for developments. And one thing that is important for, VXR is it has to be served over HTTPS instead of HTTP. So if you have an experience created and if you are running into issues that's one thing to look into. Any, code editor will be useful to work with but I do use Visual Studio Code.

[00:01:28]
And if you would like to download, it's a free download. It's an open source tool. And Visual Studio Code also have a live server extension that you can download and serve your files from. For our example, I did have create a server so you don't have to worry about it.

[00:01:51]
As I mentioned, type threeJS both threeJS and BabylonJS are written with TypeScript. Anytime a project is written in TypeScript, it's much better idea to work with TypeScript instead of JavaScript. Because what TypeScript gives you is the extra type definition which allows us to get some tips from our editor about how to implement our functions, or what values that we have to pass in for some of the methods.

[00:02:27]
If you are scared of TypeScript, don't be, it has five minutes introduction if you're interested. And learn x and y is another resource that I go to anytime I need a little refresher. And other than that, if you just copy and paste the JavaScript code, it will still work on a Ts file.

[00:02:50]
The only difference is that we have to compile to JavaScript which are scripts in the folder that we are going to work is going to do. So you don't have to worry about that either. And, or if you don't have Github you can create an account or just go to the repository and download it instead of cloning it.

[00:03:17]
We will use Chrome Dev Tools. You can use edge dev tools as well, they are the same ones. But Firefox is not the one that I'm familiar with so we're going to use that one. We are ready to start developing our in our local environments. If you have already downloaded the resources that I mentioned earlier, now you can check out this repository, you have to clone it and then go into the folder and npm install everything and we will run the development environments.

[00:03:59]
So let's take a look at our Github repository and get ourselves familiar with. I always start reading a report from the bottom. First thing I look at is the NPM modules, and once you are here, if you are using visual studio, your code, you can type in control, shift, p to open up your input.

[00:04:30]
[LAUGH] I don't know what is this called. And create a new terminal If you already don't have one. And you can use an external terminal or anything else you are in, you feel comfortable with. So once we are in the workshop folder, I'm going to run npm install and wait for it to install.

[00:04:56]
The code that we are writing is going to be under source and under clients. We have ar.ts but we are going to start from the earth.ts. And once we run our npm run dev scripts, what it will do is turn TypeScript code into JavaScript code inside this folder