I am using the time off that I have from my day job to focus on my coding. I am doing this by contributing code to Github repositories. One repository that I am contributing to is a REST API for a NodeJS backend built using Express and Typescript for a note taking app. Being a full-stack engineer when I practice coding it involves deploying code to the cloud. In my case I was deploying a nodejs express app to AWS Elastic Beanstalk environment. This process is quite simple but I ran some issues, simply because a lot of tutorials out there focus on a NodeJS Javascript app and not a NodeJS Typescript app. In this post, I will talk about those issues and how to deploy nodejs typescript app on AWS Elastic Beanstalk.
App in question
The NodeJS, Typescript app I am referring to is on this Github repo. This was the first time I was working with a NodeJS Typescript app that I had to deploy on AWS Elastic Beanstalk.
Deploy NodeJS app AWS Elastic Beanstalk
If you want to know about deploying NodeJS, Express app to Elastic Beanstalk, the official tutorials do a great job of it. Search for “Deploying An Express Application to Elastic Beanstalk” on the AWS official docs online. Here I will keep the focus narrow and focus on the Typescript aspect of it.
Deploy NodeJS Typescript app on AWS Elastic Beanstalk
You need to understand, that you are not deploying Typescript code to AWS but rather the Javascript code that your Typescript compiler transpiles Typescript in to. Have a look at the tsconfig file in my repository
{
"exclude": [
"**/*.spec.ts"
],
"compilerOptions": {
"target": "es2016",
"module": "CommonJS",
"outDir": "./dist",
"strict": true,
"noImplicitAny": true,
"esModuleInterop": true,
"resolveJsonModule": true,
}
}
In the code above we are telling the Typescript compiler to put all the Javascript code into a dist directory.
Steps to deploy a NodeJS, Typescript app to AWS Elastic Beanstalk
Assuming you have already setup your environment.
- Build the project, which in case of my repository the command is yarn build which would invoke
tsc --project ./tsconfig.json
as seen in the package.json file - yarn build will transpile the typescript code into Javascript and save it in the dist directory
- Navigate to the project directory and compress the dist directory and package.json into an archive
- Log into your AWS console, navigate elastic beanstalk and open your environment
- Click on Upload and Deploy, click on Choose file and select your archive to begin deploying
After uploading your app code AWS will attempt to start your application in it’s environment.
Problems
All of the above steps worked fine for me and I managed to upload my code. However I had problems on application startup. The app would not start and I would see application startup failed. I kept thinking about it for a few mins till I realised, wait a second, I can check the logs. So I checked the logs and realised, that it was looking to start the app from the wrong location than the one indicated. This were the scripts in my package.json file,.
"scripts": {
"start": "nodemon ./src/index.ts",
"build": "tsc --project ./tsconfig.json",
"test": "jest -c ./jest.unit.json",
"test:coverage": "jest --coverage -c ./jest.unit.json"
},
After deploying my app to the AWS environment will attempt to start the application by a command like node ./src/index.js
. Once I saw the error I realised that a simple update to my package.json file should solve this issue. So I added a separate command to start the app during dev e.g. devStart. This is my updated package.json file
"scripts": {
"devStart": "nodemon ./src/index.ts",
"start": "node ./dist/src/index.js",
"build": "tsc --project ./tsconfig.json",
"test": "jest -c ./jest.unit.json",
"test:coverage": "jest --coverage -c ./jest.unit.json"
},
That is all, really. I am not even a 100% sure if this qualifies as a problem that I had to solve, but more like I needed to get an understanding of this entire process.
Summary
Please checkout Github repository node_typescript_crud_notes, fork it or clone it and have a play with it yourself to get an idea of how it all works. There is alreadty a fork of this repository and a pull requests with some changes waiting to be merged.
This year, I aim to focus more on my coding via contributing to my open-source repos on Github and slightly reduce my blogging. If I write a blogpost, I will try to keep it short, concise and really focus on a single solution itself as opposed to talk about the background.
Until next time, I wish you a happy 2023 and live long and prosper 🖖
If you find any of my posts useful and want to support me, you can buy me a coffee 🙂
https://www.buymeacoffee.com/bhumansoni
Have a read of some of my other posts,
What is Javascript event loop? – My Day To-Do (mydaytodo.com)
How to build a game using Vanilla Javascript – My Day To-Do (mydaytodo.com)
Vanilla Javascript: Create Radio Buttons (How-To) – Bhuman Soni (mydaytodo.com)
Java Spring Boot & Vanilla Javascript solution – My Day To-Do (mydaytodo.com)
Vanilla Javascript: Create Radio Buttons (How-To) – Bhuman Soni (mydaytodo.com)
While you are here, maybe try one of my apps for the iPhone.
Apps – My Day To-Do (mydaytodo.com)
0 Comments