
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 Just for a second, imagine you run a small coffee shop.
00:00:06 And then at one moment, hundreds of customers come in and order 500 cups of coffee each.
00:00:12 That would significantly slow down the service, right?
00:00:15 Well, that's exactly what happens to websites and APIs and apps without rate limiting or bot protection.
00:00:22 Just see how congested it can be.
00:00:24 Transaction in progress and all the users will be stuck waiting for their data for days.
00:00:30 Write limiting is like a rule that says, hey, you can make a certain number of requests in a given time, and it prevents people,
00:00:37 or most commonly bots, from overwhelming your servers with too many requests at once, keeping your app fast and available for everyone.
00:00:45 And of course, even more important to say is that not all website visitors are human.
00:00:50 There are many bots trying to scrape data, guess passwords, or just spam your service.
00:00:56 Bot protection helps you detect and block this kind of bad traffic so your platform stays secure and functional.
00:01:02 And that's exactly what we'll do with our API to make it safe and secure.
00:01:06 If you haven't already done that, Click the ArcJet link down in the description to be able to follow along and see exactly what I'm seeing and then sign
00:01:14 up for free.
00:01:15 Once you do that, enter your API name.
00:01:17 I'll say subscription tracker.
00:01:20 and create, and you'll be able to choose between many options of the services you can integrate it with.
00:01:26 From Bun to Bun and Hono, Denno, Nest, Next.js, Node.js.
00:01:30 In this case, Node.js and Express is the perfect fit for us.
00:01:33 So let's just copy this ArcGit key and click continue with Node and Express.
00:01:38 Before we follow the docs, let's just head into our app, into .env.development.local.
00:01:44 And let's add ArcJet environment variables.
00:01:47 That'll be ArcJet underscore key is equal to this key that you just copied, as well as ArcJet underscore ENV, which is set to development.
00:01:58 So we know we're currently in the development environment.
00:02:00 We'll also head to head over to our ENV config and add the ArcJet ENV right here, as well as ArcJet key.
00:02:09 So we're properly exporting them.
00:02:11 Perfect.
00:02:12 And it seems like WebStorm doesn't know about the word ArcJet, so I'll simply add it to my dictionary because I'll be using it much more frequently from
00:02:20 now on.
00:02:20 With that in mind, let's follow the steps outlined right here.
00:02:23 We have already installed Express.
00:02:25 Now we have to install ArcJet, so let's just copy this command.
00:02:29 And in our second terminal, we can just run mpmi arcjet forward slash node.
00:02:35 While that is installing, let's set up our key.
00:02:38 Perfect, this is exactly what we have done.
00:02:41 And now we are ready to add some rules.
00:02:43 What you could do is add those rules directly within the app.js file, which is totally okay.
00:02:49 But in this case, we'll actually do it in a separate file to keep our code-based ID.
00:02:54 So back in the code, create a new middleware file, which I'll call arcjet.middleware.js.
00:03:02 And before we set up the ArcGit middleware, we first have to configure an active instance of ArcGit, which I'll do in the config file.
00:03:09 So let's go ahead and create a new file called ArcGit.js within the config.
00:03:14 And we can get started by copying this const aj from ArcGit and then pasting it right here.
00:03:20 This will give us a head start on the configuration.
00:03:22 We'll have to import a couple of things, such as import ArcGit.
00:03:27 As well as, in Curly Braces, Shield, Detect Bot, as well as Token Bucket.
00:03:34 All of this is coming from ArcGit.
00:03:37 So first things first, we have to get our site key from ArcGit and set it as an environment variable coming from process.env.arcgit.
00:03:46 Or in this case, we can just say ArcGit key coming from env.js like this.
00:03:52 We can leave the characteristics as they are, track requests by IP address.
00:03:57 Then we have a couple of rules.
00:03:59 The first rule is the shield, which protects our app against common attacks, like SQL injections.
00:04:05 This is super convenient because it allows you to focus on implementing your API's business logic while ArcGed handles the protection side.
00:04:14 And we also have a bot protection, where you can also specify different rules of how you want to protect them.
00:04:20 In this case, we're setting the mode to live.
00:04:23 And under allow, we have category search engine, which allows search engines to access our site.
00:04:29 If you want to turn it on for monitoring or preview, you can do that as well.
00:04:33 I'll keep it as it is.
00:04:34 And right below, we have something known as a token bucket.
00:04:38 And this is used for rate limiting.
00:04:40 If you head over to the docs for the rate limit configuration, you can see that each ArcGed rate limit rule has its own configuration depending on the
00:04:49 algorithm used.
00:04:49 They start from the type and then the algorithm.
00:04:52 There are different options that we can pass into it.
00:04:54 and characteristics.
00:04:55 But if we scroll a bit down, you'll be able to see a detailed explanation for each one of the parameters that we pass into the function.
00:05:02 So if I put this to the side, you can see that an interval can be a number or an integer.
00:05:07 It is supported for these types of algorithms.
00:05:09 In this case, we're using a token bucket algorithm.
00:05:12 And for the token bucket, if you set the interval to 60 and the refill rate to 10, the bucket will refill 10 tokens every 60 seconds.
00:05:20 Here you can learn more about the refill rate and the capacity.
00:05:24 Arcjet is using actual rate limiting algorithms, not just a set number of calls that each IP address can make.
00:05:31 The default option right here is that it refills five tokens per interval, refills every 10 seconds, and the bucket capacity is 10 tokens.
00:05:39 We'll soon see if we can break that by trying to make too many requests.
00:05:43 Great.
00:05:44 This is all it takes to configure ArcJet.
00:05:47 So let's head over into our middleware to use it.
00:05:50 We can import aj coming from dot dot slash config forward slash ArcJet dot js.
00:05:57 And we can create a new function called ArcJet middleware.
00:06:01 It has the request, the response and the next.
00:06:04 We can open up a try block as well as a catch block.
00:06:08 And if there's an error, we'll simply console log that error, but I will prepend.
00:06:13 ArcJet middleware.
00:06:15 Error.
00:06:17 And then we can display the error message right after it, just so we know where the error is coming from.
00:06:23 And then we will call the next and pass over that error.
00:06:26 Finally, in the try, we can start with this.
00:06:30 const decision is equal to await aj.protect.
00:06:37 And the only thing we'll pass in is the request.
00:06:40 So we're saying, protect this request and tell me your decision.
00:06:45 Should it be denied or should we let it through?
00:06:48 If decision.isDenied, which is a function, so make sure to call it right here, we'll open up a new block and then we'll figure out what is the reason for
00:06:59 the denial.
00:07:01 If decision.reason.isRateLimit, if that is the case, will return a status of 429 with a JSON message of error, rate limit exceeded,
00:07:17 or too many requests.
00:07:19 We can actually put this in one line right here.
00:07:21 We can have another if statement right within it, and we'll say if decision.reason.isBot.
00:07:29 Okay, so we're implementing bot protection here.
00:07:32 In that case, we'll return a restat status of 403 and say bot detected.
00:07:39 If it's neither one of these, but if it's just denied, we'll return a 403 and say access denied.
00:07:45 Now outside of the if, that means that we're not denying the request to pass through.
00:07:50 We'll just simply say next, go to the next step, whether that's to create a subscription, create a user or whatever you want it to do with that request,
00:07:58 maybe order a coffee.
00:07:59 So with this, we're implementing that additional layer of protection.
00:08:03 Now let's export default that ArcGit middleware, and let's put it to use right within our app.js.
00:08:12 Here we have all sorts of different middlewares, and we can also add the app.use ArcGit middleware.
00:08:20 and make sure to import it from Middleware's ArcGit Middleware.js.
00:08:25 So, what do you say that we put it to the test?
00:08:27 Let's just go back to ArcGit Middleware one more time and make sure that we have properly implemented it.
00:08:33 Oh, it looks like we're using a wait here, so I need to add async right at the top.
00:08:38 And let's check out our ArcGit file and make sure to export default, the AJ configuration instance.
00:08:45 So we can use it right here to protect us.
00:08:47 And if you head over to the ArcGit config, just to make sure we're doing good, this is supposed to be coming from at ArcGit forward slash node.
00:08:56 If we fix that, you'll see that our subscription tracker is now running on localhost 5500. Now, just before we test it, I want to explain how this token
00:09:05 bucket algorithm works in a bit more detail.
00:09:07 See, this algorithm is based on a bucket filled with a specific number of tokens.
00:09:13 Each request withdraws a token from the bucket and the bucket is refilled at a fixed rate.
00:09:19 Once the bucket is empty, the client is blocked until the bucket refills.
00:09:23 This is useful when you want to allow clients to make a burst of requests and then still be able to make requests at a slower rate.
00:09:30 For this to work, alongside providing the refill rate, the interval and capacity, you also have to choose how many tokens will you deduct once you determine
00:09:39 each request.
00:09:41 And this is happening when we call the AJ protect.
00:09:44 So if you head over into ArcGit middleware, you'll have to provide a second parameter to AJ.protect of requested set to one,
00:09:54 which means that you'll take away one token from the bucket.
00:09:56 And to test it out, we can now go back to our HTTP client and try to spam a lot of requests.
00:10:03 So I'll just keep pressing send.
00:10:07 There we go, transaction is in progress.
00:10:09 And at one point, we reached 429, too many requests.
00:10:14 Rate limit exceeded, which is exactly what we wanted.
00:10:18 Now, if you try making another, you'll be able to do it because of the token bucket algorithm, which is slowly filling it up.
00:10:24 But if you once again start spamming, you will once again automatically be blocked.
00:10:30 And check this out, within ArcShit dashboard, you can see all of the requests that are being made.
00:10:36 You can explore more details about the ones that pass through, see the complete headers, the path, the home, as well as the IP address that try to make them,
00:10:45 as well as whether it was allowed or blocked.
00:10:48 In this one, it says it's okay.
00:10:50 But if you head over into one that was write limited, You can see that it was denied for the reason because of rate limit,
00:10:58 and it will be reset very quickly.
00:11:01 Perfect.
00:11:02 ArcGit also allows you to further configure it, so you have even more options of protecting yourself.
00:11:08 And if you head over into Analytics, you'll be able to see exactly what is happening on your website.
00:11:13 Are people spamming it or are they using it politely?
00:11:16 So with that in mind, now you know how to secure your APIs, but keep in mind that ArcGit also works with web applications,
00:11:23 so you can very easily protect your web applications too.
00:11:27 Great.
00:11:28 Now that we know that we're protected, let's focus on our application's main functionality, and that is creating and tracking the subscriptions.