Check out a free preview of the full API Design in Node.js, v3 course:
The "Code Repo Tour" Lesson is part of the full, API Design in Node.js, v3 course featured in this preview video. Here's what you'd learn in this lesson:

Scott walks through the package.json, the Babel configuration, and gives an overview of what the course repository contains.

Get Unlimited Access Now

Transcript from the "Code Repo Tour" Lesson

[00:00:00]
>> Scott Moss: Okay, so to get started with the Repo, go ahead and check out to lesson one. Let's just do a quick tour of what we have, because we will already have some stuff that comes with it, that way we can focus on just doing the API and not so much about the other things.

[00:00:14] So first thing is, let's take a look at the package.json, and look at some of the dependencies in here. So a few things is we have decrypt, we use that to hash the passwords that we're gonna be using for our users and authentication. Body parser, cors, these are some packages that we're gonna be using for our servers that we build.

[00:00:33] And we'll talk more about that later. But then we have cuid.env. These are just tools that we use for testing. And we won't be using those too much. And then, we got express itself, which is gonna be the framework that we use. JSON web token is gonna be some package that helps us build all of our authentication.

[00:00:56] And then load the ashes of utility library, Mongoose to interact with the database, we'll talk more about that. And Morgan and valid data, are just gonna be packarges that we use for our API plugins, and also tools to authenticate our schemas. And then as far as scripts go, we got a few scripts here, so we have the build script.

[00:01:16] This project is gonna be built with Babble, so although no desk support, especially the latest version though, it does support really cool features that ES6 provides. It doesn't really have the ES6 imports and exports, so we're gonna use Babble for that cuz I prefer that, so this builds with Babble.

[00:01:31] And then, we have a whole board of test commands. These test commands the reason they are so many is because, the projects is gonna be organised in different branches. And I want the test that you run for the certain branch to be scoped for that lesson. I don't want the other test creating noise and getting in the way.

[00:01:46] So I create different commands for the different branches that you'll be using. And then just the overall test command that test everything. And then, you have the dev command, which is what you'll be using to star the repo. And basically, what this command does, it's going to build the repo using the build command.

[00:02:01] And then, it's also going to execute the build command or the output of the build command using something called nodemon, which is basically like node. But it will restart and rerun a file if a file changes. So in our case, if a file changes in the source directory while the server is running, it will rebuild and reserve our API, so we don't have to stop and turn it back on.

[00:02:23] So that's what the dev command is doing for us. And the restart command, is doing what I describe there. And then, a start command is for something if you were deploy you would use this versus the dev command. So just to walk through some of that stuff. The node mon.json are the instructions for that restartable executable that I talked about.

[00:02:41] So you'll see that I'm watching these paths here and if any of those paths change, I know to go ahead and restart with the node command, and ignore these paths here. So that's what that's doing, to take a look at the babel config. We're using Babel 7, so we're using the latest Babel which uses @babel name space.

[00:03:00] And we're just gonna target the current version of node, and then we just have a few plug-ins here like the class properties for E6 classes. And then, object spread, which is what we will be using, so just a couple plug-ins here. And then we have the ES lint and prettier setup for formatting.

[00:03:17] So if we have any auto formatting setup in your repo that uses es lint, it'll take advantage of this, if not, you'll see some linting errors. You can also just run the linter yourself manually if you want to, but I like to have formatted code so I set up the linter for you with es lint and prettier.

[00:03:33] And then the last thing is a test DB file, and we'll talk more about this later. But basically, we need this to set up our test that you will be running for this repo to actually get going and making progress. So if we hop into the source folder, we're gonna have a few things here.

[00:03:51] One, you'll see this __tests__ directory. You'll see a lot of these throughout the repo. And this is where we will have tests. These tests will be written for you, and your job will be to get them to pass. So if you see that, that's where tests will be.

[00:04:03] And then, we have this config folder, this is also done for you. But basically, what this config folder does is it houses all the configuration, things like secrets and ports and strings, and URLs that our API is gonna need. It puts them in one central place and it switches them, depending on what environment we're in.

[00:04:21] So if we're in a testing environment, we might see a testing configuration. If we're in a development environment, we might see a development configuration and production, and so forth. So it allows us to be able to switch our configurations depending on what environment we're in. And extract it out to one place so we're not just moving and copying variables into all of our applications.

[00:04:37] So that's going to be done for you. Then, we have this resources directory, this is where we're going to do most of our work. And these resources are going to be matched up with how we build our rest API. So, for every resource that we wanna interact with API that we build, we're gonna have them here.

[00:04:52] In this example, our API is gonna be a basic-to-do-app API. So we have resources like an item, a list which items belong to, and then a user.com logs in and create items and list. So it's very basic and that's where you'll see these resources. And then, utils is where we store code that has nothing do with resources but help us out.

[00:05:12] So for instance, we'll have authentication in here, stuff for creating read, update, and destroy on our controllers, and then importantly the db one. So this one is here for you, and basically what this logic does is is going to connect to our Mongo database for us using Mongo.

[00:05:28] So you don't have to worry about that logic, we'll be connecting for you. We'll be connected for you doing the test and also when you start the server in development mode. But this is the logic that actually connects to the test. And then, you have the index file which is the start point to the server and this just kicks everything off, actually starts the server.

[00:05:45] And then, the other place will do a lot of your work is the server file itself. So this is where we're gonna get started. The last thing I'll mention is, to actually get your editor setup so you take advantageof ESLint and Prettier, you need to install some extensions.

[00:05:59] So I'm using VS code, so for me, I just click on extensions and I could type in prettier. And you can see, I already have the prettier code for matter are installed, so you should install that one, that's the one that you want. And then for ESLint, you can just type in ESLint, and you can see they already have the ESLint, the win with the star on it, already installed.

[00:06:18] And then from there, you should be able to configure it. So if I hit Cmd+comma, I can go over to my settings, I can type in ESLint. And you can see, there's tons of different settings that you want. For me, I like to autofix on save. So whenever I hit save, it will fix any warning linting errors.

[00:06:35] So anything that's formatting, it'll fix that for me. And that's really cool, so you should do that. If not, you can switch it to where it's on type or whenever you run it manually with the command that ESLint installs through the plug in. So you can run Command+Shift+P and you can type in lint, and you can auto fix here manually.