How to: Docker, typescript, and node

#docker #typescript #node #tutorial

Why Docker?

To put it simply, we want to replicate the same environment on every machine our application will run on.

Imagine my teammate an I are working with two different operating systems/machines, each of us has a different version of node installed. Well everything might be fine and dandy on my end but they might run into all kinds of node mismatch issues on their's. This is where Docker comes in.

The Docker container replicates a desired standard environment for which our application will run in. So instead of directly running our application on whatever local machine and it's environment, we will run a docker container with that replicates the same environmental conditions (every time, everywhere) in which our application will run inside.

Part 1: Checking your scripts

My build script will spit out a transpiled index.js file in ./app/server/build folder.

My start script will run the built index.js file found in said folder.

Make sure your scripts are working correctly as Docker will run these scripts to run your application inside the container.

Part 2: The dockerfile & building your image

The dockerfile is just a text document that contains the commands for docker to build your docker image. We can have different images with varying settings.

Hold on, what is a docker image?

a docker image is an immutable file that contains the source code, libraries, dependancies, tools, and other files that are needed for a container to run. Essentially containers are instances of images.

Create the dockerfile, and inside...

So let's go line by line and figure out what's happening here.

FROM node:18-alpine
- We specify a node version, alpine is just a lightweight/barebones node version used to run inside our container
WORKDIR /usr/src/app
- In our instanced environment we need to create a new directory for our files to live in
COPY package.json yarn.lock ./
- Copy first our package.json and yarn.lock files into the root directory we just created, so we can install our dependencies needed for our application
RUN yarn install
- Run the given command to install dependancies
COPY . .
- Copy over the rest of our files
EXPOSE 8080
- Which port do we want our application to run on? In my node app I specified port 8080 so here I will do the same
RUN yarn build
- Now we build to get our index.js file spat out into the build directory
CMD ["yarn", "start"]
- And lastly we start our application

Part 3: .dockerignore file

We want to keep our container instance slim, so we'll went to exclude unnecessary files. We can do that by first creating a .dockerignore file in the root directory and filling it out with...

Part 4: Running our container

If you haven't already you'll want to download the latest version of Docker Desktop for your computer, and then start the application.

Navigate to where your dockerfile is located in your terminal and then run the docker command docker build . -t imageNameOfChoice the -t flag allows you to give a name/tag to your image that you are about to build
Once that has finished building we want to instance/run a container from the image that we just built. Run the docker command docker run -d imageNameOfChoice. the -d flag runs our container in detached mode, meaning it is disconnected from the current terminal so we can continue to use other commands. This mode means the container receives no input and displays no output.
- Detached mode will spit out a long id that references your container
You can check the currently running docker container/containers by running the docker command docker ps. You will see the randomly generated name of your running container along with the id that was given to you from running in detached mode.
Visit localhost:8080 and see your container running.
To stop your container simply run docker stop randomlyGeneratedContainerName

Conclusion

So far we've learned how to write a setup a dockerfile to create an image and build and run a container. Stay tuned for more on how to connect other services like a DB/Redis in the future!