
Join the Conversation!
Subscribing gives you access to the comments so you can share your ideas, ask questions, and connect with others.
"Please login to view comments"
Subscribing gives you access to the comments so you can share your ideas, ask questions, and connect with others.
By logging in, you'll unlock full access to this and other free tutorials on JSM Pro.
Why? Logging in lets us personalize your learning experience, track your progress, and keep you in the loop with new workshops, coding tips, and platform updates.
You'll also be the first to know about upcoming launches, events, and exclusive discounts.
No spam—just helpful content to level up your skills.
If that sounds fair, go ahead and log in to continue →
Enter your name and email to get instant access
##Looks like we found a thief monkey By the way, I liked the trick how you reached till here. You have a good sense of humor. You will improve a lot if you join our course with this passion.
var
(function-scoped, outdated)let
(block-scoped, modern and recommended)const
(block-scoped, cannot be reassigned)_
, or $
let let = 5;
is invalid)myVar
and myvar
are different)string
, number
, boolean
, null
, undefined
, bigint
, symbol
Objects
, Arrays
, Functions
Subscribing gives you access to a brief, insightful summary of each lecture to stay on track.
00:00:02 To start setting up different environments, we need to have different places where we can put and retrieve our environment variables from.
00:00:09 So open up your terminal, stop your application from running by pressing control C and then run npm install.env.
00:00:17 It's a package that'll allow us to retrieve our environment variables.
00:00:20 So create a new folder and call it config.
00:00:25 And within config, create a new file called env.js.
00:00:30 Within it, we can import config from the .env package, and then we can set it up and then giving it a path pointing to our .env file.
00:00:40 So if we had just one, you could have said .env, like this.
00:00:44 This will then extract all the environment variables, and then you can export them from this file, such as the port we're on.
00:00:50 Export const port is equal to process.env, meaning that it's coming from the environment variables file.
00:00:58 But now here's the thing, we don't want to simply have one environment variables file.
00:01:03 We want to have multiple for different environments.
00:01:06 So let's actually make this a template string and say that it'll start with .env.
00:01:13 but then it'll pull from environment variables the process .env.nodeenv, which is the node environment.
00:01:23 Or if that doesn't exist, it'll default to development.
00:01:28 And it'll also end with .local.
00:01:31 Now let's fix this typo.
00:01:32 Looks like I said node end.
00:01:33 It was supposed to be node env as an environment.
00:01:37 And let's create those two files in the root of the directory.
00:01:41 The first one will be called the .env.production.local.
00:01:47 And the second one will be called .env.development.local.
00:01:53 Within the development local, let's add a comment.
00:01:57 You can add comments by putting the hash sign.
00:01:59 And then on the new line, you can say port is 5,500. This is a typical backend port.
00:02:06 We don't have to define anything in production for now, we'll just keep it on development.
00:02:10 So now we're accessing this board from our environment variables, and we can also access the node ENV, if it exists.
00:02:18 By default, it's set to development anyway.
00:02:21 This way we can very easily switch between production and development ENVs without overriding one another.
00:02:27 All we have to do is change the node ENV right here in production to be equal to, well, you can guess it, production.
00:02:36 And by default in the development, it's already set to development.
00:02:41 Great.
00:02:42 Now let's go into our app and let's use this port coming from the config.
00:02:46 We can do that by importing port coming from dot slash config forward slash env dot js.
00:02:55 And now instead of manually saying 3000 right here, we can change it to port and we can also turn this into a template string.
00:03:02 So whenever the port changes, we can now say listening on port and we can add port right here.
00:03:10 If we now rerun our application by running npm run dev, you can see that we have the subscription tracker API running on localhost 5500, which means that
00:03:20 it's successfully pulling the data from our development environment.
00:03:23 And one thing you must not forget to do is head over into .getignore and scroll to the part where we're ignoring different .env environment variables.
00:03:33 And you have to say .env.asterisk.local.
00:03:39 which will make sure to ignore all the ENV files and not push them to GitHub later on once we do push.
00:03:45 You never want to share those with the internet.
00:03:48 Great.
00:03:48 In the next lesson, let's set up our routes.