But there is a good library to implement IOC in our typescript application. In this tutorial, we will learn the basics of InversifyJS and build a simple application to demonstrate the concepts.
This is tutorial is meant for people who have a good understanding of OOP concepts and Typescript. Below are links that are a good place to start.
OOPS concept with Java – https://www.guru99.com/java-oops-class-objects.html
Typescript tutorial – https://www.typescripttutorial.net
Let’s start coding.
In this section, we will build a simple node application that displays a user’s name and age.
create a folder and type the below commands to initialize both npm and typescript.
npm init -y // to initialise npm
npx tsc --init // to initialise typescript
And now we can install the dependencies.
npm install inversify reflect-metadata --save
- company.ts: this file contains our code to display the user’s name and age.
- interface.ts: all the interfaces used in our application will be in this file.
- types.ts: the constants that we use in our program will be in this file.
- inversify.config.ts: this file contains mapping configurations, that enable Dependency injection in our application. ( More on this later )
- index.ts: this is the entry file, where we will call the method to display the name and age of a user.
This file should include the following configurations for InversifyJS to work.
- This file contains two interfaces
getAgemethods for getting the name and age of a user(employee) respectively.
getEmployeemethod, which prints name and age in the console.
This file contains all the constants for our application.
We will map these constants with the classes ( more on this later ).
- Here we have two classes Company and Employee implementation
@injectable()is a decorator, this is a way of telling the compiler that we want to inject this class as a dependency.
@inject(USER) employee:UserInerfacemeans that we are injecting employee variable of type
- Now, we can use all the methods from
UserInerfaceinside the Company class.
But wait! we did not create an object or any reference to the Employee class from the Company class then how will it call
getAge methods from the Employee class?
Well, The magic happens in this line
@inject(USER). In the next section, we will connect USER to the Employee class, So that whenever we inject a variable with
@inject(USER), the compiler knows to create a reference to the Employee class.
Here, we bind the USER and COMPANY interface to Employee and Company classes respectively.
Note: Every class that you create should be configured in this file.
- In this file, we get the container object from the
container.get(COMPANY)the method will get the company class and resolve all its dependencies(In this case it’s the Employee class).
- Now, we can use the method from the company class
Note: reflect-metadata is a dependency of InversifyJS and must be imported once in the root file.
Running the application:
To run the application, type the following commands in the terminal.
The above command will compile the typescript code and create a build folder.
This command will run the file index.js inside the build folder.
After running the above commands, you should see “John 25” as the output in the terminal.
Frameworks like Angular and NestJS come out of the box with all OOPS concepts but, if we want a custom solution or want to understand how things work under the hood, InversifyJS is a great library to get your hands dirty.
Git repo: https://github.com/kishork2120/inversify-tutorial
Check out my tutorial to implement a full-fledged video chat application