DEV Community: Mark Pieszak

Learn how to Deploy NestJS serverless apps to Azure Functions

Mark Pieszak — Fri, 16 Aug 2019 18:55:38 +0000

Originally published on the Trilon Blog by Kamil Mysliwiec

Deploy NestJS to Production Series:

Part 1: Deploy NestJS to Zeit Now.sh
Part 2: Deploy NestJS to Azure Functions (this article)
... more to come ...

Serverless NestJS with Microsoft Azure

In this article we'll be looking at how to deploy serverless NestJS applications to the cloud platform Azure Functions in only a few minutes!

If you're not familiar with NestJS, it is a TypeScript Node.js framework that helps you build enterprise-grade efficient and scalable Node.js applications.

Incase you missed the announcement, the integration between NestJS & Azure was just teased at the other week!

// Detect dark theme var iframe = document.getElementById('tweet-1156143186508730368-230'); if (document.body.className.includes('dark-theme')) { iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=1156143186508730368&theme=dark" }

Before we dive further, let's take a step back to make sure we have a good understanding about Azure Functions and how they can play a role in handling our serverless NestJS applications.

What are Azure Functions ?

Azure Functions are a serverless computing execution service that enables you to run code on-demand without having to manage the allocation of machine resources, servers, etc. Write your NestJS code, deploy it - and let Azure Functions handle the rest!

Azure functions can let you create functions that execute based on events, read more in the official Azure Functions documentation here.

Azure let's you deploy a myriad of different frameworks/languages, from C# to JavaScript/TypeScript.

NestJS is a TypeScript-based Node.js framework after all - so let's take a look at how we utilize the fantastic Azure platform to deploy our serverless applications!

Getting NestJS setup

NOTE: In this demonstration, we'll be showcasing a new NestJS application generated by the CLI, but if you prefer to use an existing NestJS application - feel free - and to skip ahead to the next section about Schematics.

☁ npm i -g @nestjs/cli
☁ nest new PROJECT_NAME

Now let's cd into the newly created directory and open up our IDE. At this point we have a simple generated NestJS Application.

📯 Introducing NestJS Azure Functions Schematics

At Trilon, we've been working with some amazing individuals over on the Microsoft Azure team to create a seamless integration between NestJS + Azure Functions. Allowing you to effortlessly deploy your new/existing services to the cloud!

These NestJS schematics allow you to instantly setup your application with all the scaffolding required for the integration, with one simple command. More on this later!

Installing NestJS Azure Functions Schematics

In your terminal, make sure you're at the root directory of your project and type:

nest add @nestjs/azure-func-http

Example output:

✔ Installation in progress... ☕
CREATE /.funcignore (66 bytes)
CREATE /host.json (23 bytes)
CREATE /local.settings.json (116 bytes)
CREATE /proxies.json (72 bytes)
CREATE /main/function.json (294 bytes)
CREATE /main/index.ts (287 bytes)
CREATE /main/sample.dat (23 bytes)
CREATE /src/main.azure.ts (321 bytes)
UPDATE /package.json (1827 bytes)

Excellent! You now have your NestJS application completely setup for Azure Functions! What's next?

Local Azure Functions development

Next, we're going to utilize the Azure-CLI to test our Azure Functions locally!

If you don't have it installed on your machine yet, make sure to:

Install Azure Functions Core Tools
Install the Azure CLI

Once you have everything installed, make sure it was setup right by entering func --version in your terminal.

With the Azure-CLI all setup, let's fire up our Local Azure Functions environment and see everything in action!

IMPORTANT: Build NestJS first. Since it's written in TypeScript we need to make sure our application compiles down to JavaScript before letting Azure do the rest!

npm run build && func host start

This should output something similar to:

Hosting environment: Production
Content root path: /Users/yourname/Documents/Trilon/nestjs-azure-functions
Now listening on: http://0.0.0.0:7071
Application started. Press Ctrl+C to shut down.

Http Functions:

    main:  http://localhost:7071/api/{*segments}

Open up that url `http://localhost:7071/api/` in your browser you should see:

NestJS & Azure functions local development

It's that easy!

If you're wondering why the URL is prepended with /api/, take a look at your main.azure.ts file in the NestJS project. You could update it to whatever you wish, add API versioning (/api/v1/), etc!

Eventually a real-world application would have all of the URLs all available under this globalPrefix.

# ie:
GET /api/products/
GET /api/products/123
POST /api/products

Deploying NestJS to Azure Functions

Stay tuned for future announcements as we will be introducing nest deploy azure and other great integrations that will simplify this process even further!

NOTE: To deploy Azure Functions, you'll need an Azure Account (new accounts get 12 months of free services).

When it comes to Deploying your NestJS app to Azure Functions, there are a few different paths you could take, and it all depends on whether you prefer doing everything in the terminal or your IDE (ie: VSCode).

In this article we're going to showcase deploying via VSCode as it's a bit simpler! Read more about deploying via the terminal from the official Azure documentation here.

Install the Azure Functions VSCode Extension

Head over to the Extensions Marketplace in VSCode and search for "Azure Functions" or download it here.

More information on the extension installation and prerequisites here.

Once installed, you'll notice a new Icon on the left-hand sidebar, select it to open up the Azure Functions options.

1. Login or Signup (to Azure)

2. Hit the "Deploy to Function App" **Arrow icon, and select "Create New Function App in Azure".**

3. Select a unique name for your Azure Function, and press Enter.

NOTE: This step may take a few moments as it will be creating Storage Groups, and your new Function App. Future deployments will be much faster, not to worry! :)

Deployed!

When everything is finished, check in the Output tab (shown above) that your deployment has been finished!

# --- output similar to ---
# ... etc etc ...
1:54:52 PM nestjs-azure-demo: Deployment successful.
1:55:08 PM nestjs-azure-demo: Waiting for long running command to finish...
Deployment to "nestjs-azure-demo" completed.

HTTP Trigger Urls:
  main: https://nestjs-azure-demo.azurewebsites.net/api/%7B*segments%7D

Serverless NestJS deployed to the ☁ !

If you've been following along, you should be able to access that URL in your output tab, just make sure to remove the last %7B*segments%7D portion of the URL.

🐱 Navigate to the URL to see your serverless "Hello World" API in all its eternal glory! 🐱

Magical ✨

See the "Hello World" NestJS + Azure Functions live demo:
https://nestjs-azure-demo.azurewebsites.net/api

You can find the Github code example here

There we have it!

In just a few minutes, we fired up azure functions locally, and learned how to deploy with the new VSCode Azure Functions Extension, taking our serverless NestJS application to the cloud in no time!

Future Plans for NestJS & Azure ✨

It's our mission to make this entire process even simpler in the future!

Stay tuned for more articles and updates on the upcoming nest deploy azure, and other amazing Azure integrations! ✨

Azure Storage, improved serverless support, and much more!

In Conclusion

Azure Functions let you deploy your NestJS applications to the cloud with ease, letting you use all of your other favorite Azure tools from within your application.
Make sure your scripts are building your NestJS before deploying.
Deploy through either the command-line or through IDE Extensions
More NestJS & Azure integrations coming soon!
Enjoy the ☁ responsibly!

Check out the Trilon Blog for more articles on Angular, NestJS, and much more!

How to delete ALL node_modules folders on your machine and free up HD space!

Mark Pieszak — Wed, 07 Aug 2019 18:16:01 +0000

Originally published on the Trilon Blog on Aug 7, 2019.

Whenever we work on a new project we need to run npm install, but how often do we think about the toll this takes on our hard-drive?

The dreaded "out of space" message

A single node_modules folder can take up anywhere from 200+ megabytes of space (sometimes 1GB+ !).

Now take a look at your github/ folder, or wherever else you're storing the majority of your projects, and you can start to see where some of your free hard-drive space has gone!

I recently tweeted about this, as it's something I use every few months and wanted to share with others who might have ran into the same situation themselves!

// Detect dark theme var iframe = document.getElementById('tweet-1159136343559155712-529'); if (document.body.className.includes('dark-theme')) { iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=1159136343559155712&theme=dark" }

List all node_modules found in a Directory:

First, let's take a look at ALL the node_modules we have in a directory, before we actually start deleting them!

NOTE: Make sure you cd into a specific directory where most of your projects are. ie: documents or documents/github.

Mac / Linux:

This command will print out each folder, and even show us how much space the folder is occupying ! Thanks to Rhymes for the tip!

$ cd documents
$ find . -name "node_modules" -type d -prune -print | xargs du -chs

--- Example output ---
1.0G ./Github/big-project/node_modules
225M ./Github/Trilon.io/node_modules
482M ./Github/Some_Demo/node_modules

1.7G total

Windows:

$ cd documents
$ FOR /d /r . %d in (node_modules) DO @IF EXIST "%d" echo %d"

This list will give you a good idea of just the sheer amount of projects you have installed on your machine!

Delete all node_modules found in a Directory:

NOTE: Use caution here, and make sure that you are in a directory where you're comfortable removing all the instances of node_modules, run the script above to see a full list of them all before deleting.

This script is actually very similar to the one above, but we're going to be utilizing rm -rf to completely delete them.

WARNING: This process is irreversible!

Mac / Linux:

$ cd documents
$ find . -name 'node_modules' -type d -prune -print -exec rm -rf '{}' \;

Windows:

$ cd documents
$ FOR /d /r . %d in (node_modules) DO @IF EXIST "%d" rm -rf "%d"

Powershell Users:

Get-ChildItem -Path "." -Include "node_modules" -Recurse -Directory | Remove-Item -Recurse -Force

There we have it!

For me personally, this typically clears out about 40-60GB from my hard-drive, but your mileage may vary!

In Conclusion

Make sure to list all node_modules in a given directory BEFORE deleting them.
Make sure to be cautious as this process is irreversible!
Remember to npm install on the projects you need to work on again.
Enjoy the free space! :)

Comment below I'd love to hear how much you saved!

Also, don't forget to check out the Trilon Blog for more in-depth articles!

Deploying NestJS Apps to the cloud with Zeit Now in 2 minutes!

Mark Pieszak — Wed, 17 Jul 2019 19:45:34 +0000

Originally published on the Trilon Blog by Mark Pieszak

Deploy NestJS to Production Series:

Part 1: Deploy NestJS to Zeit Now.sh (this article)
Part 2: Deploy NestJS to Azure Functions
... more to come ...

What are we trying to achieve?

In this article we'll be looking at how to deploy NestJS applications to the cloud platform Zeit Now in only a few minutes!

See the "Hello World" NestJS + Zeit Now live demo:
NestJS-Zeit.Now.sh

You can find the Github code example here

What is Zeit "Now" ?

Zeit Now is a cloud platform for serverless deployment.
It's an incredibly simple, easy to use platform that allows you to deploy anything from
static websites to server/serverless application instantly, scale automatically, all with minimal configuration.

This includes front-end applications (Angular/React/Vue/etc), or any backend of your choosing - Go, Node.js, Python and everything in-between!

NestJS is a Node.js framework after all, so how can we take advantage of an incredible Cloud platform like Now, and deploy our applications ?

Getting setup

NOTE: In this demonstration, we'll be showcasing a new NestJS application generated by the CLI, but if you prefer to use an existing NestJS application - feel free - and just skip ahead !

Generate a new NestJS Application

For demo purposes, let's make sure we have the latest NestJS CLI installed - and create a New application.

☁ npm i -g @nestjs/cli
☁ nest new PROJECT_NAME

Now let's cd into the newly created directory and open up our IDE. At this point we have a simple generated NestJS Application.

Setting up Zeit Now

# Install the Now CLI
☁ npm i -g now

Make sure you're logged into the Now CLI (or create an account before logging in).

☁ now login
# enter email & password

Ok great! We have a "hello world" NestJS application & Now setup, where do we go from here?

Configuring Zeit Now for NestJS

Typically with Now, deployments are as simple as typing now in your terminal.

But that alone won't work for our NestJS application.

Now lets you configure your Deployment Configuration via a now.json file (typically found in the root of a project).

Now.json configuration

With this now.json configuration file, we can control many aspects of our deployment:

Deployment / Project Name
Aliases (ie: your domain URL)
Build setup
Routing
Serving static assets
much more...

At the root of your application, create a now.json file and add the JSON code below.

Note: You can set name below to whatever you would like

{
  "version": 2,
  "name": "nestjs-now",
  "builds": [
    {
      "src": "dist/main.js",
      "use": "@now/node"
    }
  ],
  "routes": [
    {
      "src": "/(.*)",
      "dest": "dist/main.js"
    }
  ]
}

What is this configuration doing?

Builds
- On the line "use": "@now/node", we are telling the Now builder to take the file dist/main.js as an entry point for a Node.js function, building its dependencies, and bundling them into a Lambda.
- Let's remember that at the end of the day, NestJS compiles down to JavaScript and runs like a standard Node.js server
- By default NestJS is using Express behind the scenes, but it can optionally be switched to use Fastify.
- More info on @now/node here
Routes
- We want to make sure that all routing /(.*) is handling by the API routes we setup within our NestJS application, so we're just telling Now where our main file is.
- More info on Now routes here

Building & Deploying

Now that we have everything setup - let's Deploy it to Now!

NestJS is a TypeScript-based Node.js framework, so we're going to need to make sure we build it for Production (via npm run build) and then we can let Now do its thing (via now) !!

☁ npm run build && now

# ---------------------
#    example output
# ---------------------

> zeit-now-nestjs@0.0.1 build /Users/Documents/Trilon/zeit-now-nestjs
> tsc -p tsconfig.build.json

> Deploying ~/Documents/Trilon/zeit-now-nestjs under trilon-io
> Using project nestjs-now
> Synced 2 files (462.27KB) [2s]
> https://nestjs-zeit.now.sh/ [v2] [928ms]
> Ready! Aliased to https://nestjs-zeit.now.sh/ [in clipboard] [43s]

NestJS deployed to the ☁ !

If you look above (or in your terminal if you're following along), we can see there was a URL outputted in the terminal! It was automatically copied to our clipboard, so go ahead and open up a Browser and take a look!!

"Hello World" in all of its magical glory...

NOTE: Inspecting the page itself we can see that it was infact served up by an Express server, just as a default NestJS application is setup to do!

There we have it!

In just a few minutes and one small json file - we took our NestJS application to the cloud with Zeit Now!

See the "Hello World" NestJS + Zeit Now live demo:
NestJS-Zeit.Now.sh

You can find the Github code example here

In Conclusion

Now makes deploying our NestJS applications to the cloud even simpler.
Make sure your scripts are building your NestJS before deploying.
Setup your now.json to be configured for NestJS builds.
Enjoy the ☁ responsibly!

DEV Community: Mark Pieszak

Learn how to Deploy NestJS serverless apps to Azure Functions

Deploy NestJS to Production Series:

Serverless NestJS with Microsoft Azure

What are Azure Functions ?

Getting NestJS setup

📯 Introducing NestJS Azure Functions Schematics

Installing NestJS Azure Functions Schematics

Local Azure Functions development

Open up that url http://localhost:7071/api/ in your browser you should see:

It's that easy!

Deploying NestJS to Azure Functions

Install the Azure Functions VSCode Extension

Deployed!

Serverless NestJS deployed to the ☁ !

There we have it!

Future Plans for NestJS & Azure ✨

In Conclusion

How to delete ALL node_modules folders on your machine and free up HD space!

List all node_modules found in a Directory:

Mac / Linux:

Windows:

Delete all node_modules found in a Directory:

Mac / Linux:

Windows:

Powershell Users:

There we have it!

In Conclusion

Comment below I'd love to hear how much you saved!

Deploying NestJS Apps to the cloud with Zeit Now in 2 minutes!

Deploy NestJS to Production Series:

What are we trying to achieve?

What is Zeit "Now" ?

Getting setup

Generate a new NestJS Application

Setting up Zeit Now

Configuring Zeit Now for NestJS

Now.json configuration

What is this configuration doing?

Building & Deploying

NestJS deployed to the ☁ !

There we have it!

In Conclusion

Open up that url `http://localhost:7071/api/` in your browser you should see: