Skip to content

Start a lambda Typescript project

rfrad edited this page Jun 13, 2023 · 6 revisions

Before we start

This tutorial is for anyone who wants to start a basic Typescript project from scratch.

We will make sure that at the end of this tutorial, everything is set up for you to test and build your application.

Prerequisite

For this tutorial, make sure both Node.js and npm are installed on your local machine. npm should have been installed with Node.js. You will also need git, which can be installed using Atlassian's tutorial if you need it.

You will also need a repository hosting service to store your code. If you do not already have one, I would recommend you use Github or Bitbucket. They both offer a free product that will allow you to get started. The advantage of using such platforms is also their CICD capabilities. I will use Github as it actually offers 2000 minutes of free build/month when Bitbucket only offers 50 minutes of free build/month. Also, GitHub offers 2FA for free. The strength of Bitbucket is how well it integrates with the other Atlassian products (Confluence, Jira). If you use the Atlassian suite, you might want to consider Bitbucket.

In the next tutorials, we will create a CICD pipeline using Github.

We are going to manipulate a few files as well. You might want to have your IDE up and running for this. I will personally use Visual Studio Code.

If you only create your Github account or Bitbucket account now, you will also need to create an access token to access your repositories.

  • Github: <your_user> > Settings > Developer settings > Personal access token > Generate a personal access token - Give access to repo and workflow.
  • Bitbucket: Click on <your_user> > Labs > App passwords > [Create app password] > Give access to Project, Repositories and Pipelines.

What technologies are we going to use?

We are going to use git to clone a repository on your local machine, then npm CLI to develop the basic application.

What are the costs?

  • Creating and committing code to your repository hosting service is most likely going to be free.
  • Creating a Typescript application is completely free.

Play time now!

In this tutorial, I am showing how to create a backend application for the SPA hosted on my-domain.org. Without stating the obvious here: please replace each occurrence of "my-domain.org" with your own domain name!

Create a Typescript project

What do we want?

The steps of this tutorial will take us to the following structure:

api.my-domain.org/       <------ This is the main directory of the git project.
  ├ .git/                <------ This contains our git configuration.
  ├ ...                  <------ A few other files such as .gitignore, README.md etc.
  └ application/         <------ The root of our typescript project.
    ├ ...
    ├ dist               <------ The .js compiled files. These are the files that will be generated when the typescript code is compiled.
    |  ├ ...
    |  └ index.ts        <------ The index file for the project.
    ├ spec               <------ The test file configuration.
    |  └ support
    |     └ jasmine.json <------ The jasmine configuration for unit tests.
    ├ src                <------ The application typescript source files.
    |  ├ ...
    |  ├ index.spec.ts   <------ The test file for index.ts.
    |  └ index.ts        <------ The index file for the project.
    └ package.json       <------ The main package.json file.

Create our empty project

  • Create repository in github
  • Clone the repo locally: git clone https://github.com/api.my-domain.org.git
  • Create the typescript folder:
    • cd api.my-domain.org
    • mkdir application
    • cd application
    • npm i typescript ts-node --save-dev
    • npx tsc --init

Configure sources and output directories

  • edit tsconfig.json: Uncomment and overwrite values
    • "outDir": "./dist",
    • "rootDir": "./src",
    • Make sure an exclude section is added as well for the test files:
      {
        "compilerOptions": {
      	/* All the ompiler options */
        },
        "exclude": [ /* Add this section */
      	"src/**/*.spec.ts"
        ]
      }
  • Create the source folder. All the typescript files will be place under this folder: mkdir src
  • Create a dummy file in the src folder to test the typescript setup:
    • file application/src/index.ts:
      export class Printer {
      	public echo(): string {
      		return "hello";
      	}
      }

The project should now be ready. To test the typescript setup, we can try to compile the typecript code: npx tsc. This should create the file application/dist/index.js

Add unit tests

For the unit tests, I'm going to use jasmine. There are definitely other frameworks, but to be completely transparent, I do not know which one is the best. I like jasmine, because it is easy to use, covers most of my use cases (if not all!), and is used by default in Angular. So at least I can be consistent between my repositories. 'm going to follow this tutorial to setup the project:

  • Install jasmine for the typescript project: npm install --save-dev jasmine @types/jasmine
  • In package.json, create a test script:
       "scripts": {
     	"test": "ts-node node_modules/jasmine/bin/jasmine"
       },
  • Initialise jasmine: npx jasmine init. This should create the spec/support/jasmine.jsonfile.
  • Update jasmine.json:
     {
       "spec_dir": "src",     <=== Overwrite this as I like having my *.spec.ts files with my *.ts ones
       "spec_files": [
     	"**/*[sS]pec.ts" <=== Overwrite this as I want to test the ts files
       ],
       ...                    <=== I'm leaving everything else as default
     }
    
  • Create a test file application/src/index.spec.ts to test our Printer defined in the application/src/index.ts file:
     import 'jasmine';
     import { Printer } from ".";
    
     describe('Printer', () => {
     	it('should print hello', () => {
     		const printer: Printer = new Printer();
     		expect(printer.echo()).toEqual('hello');
     	});
     });
  • Hurray! The tests can now be run with the command npm run test.

Create a serverless file to deploy the application to AWS

https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/serverless-sam-cli-install-windows.html https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/sam-cli-command-reference-sam-init.html https://docs.aws.amazon.com/serverless-application-model/latest/developerguide/serverless-getting-started-hello-world.html


What is next?

TODO: Update CICD link:

You are now ready to start developing your application. The next step will be to set up your CICD pipeline to test our code each time it is pushed to git, and to auto-deploy it on your dev-app environment. This tutorial will show how to create a CICD pipeline using Github Actions and AWS S3.

Clone this wiki locally