Express JS with TypeScript - Setup, Examples, Testing

DISCLAIMER
This is NOT a full in depth tutorial on Express JS. It is only designed to walk you through the setup process of installing TypeScript, getting it up and running with Express, and show you examples of type annotating arguments. I have also added other examples with Unit Testing & Integration testing with Jest and ts-jest.
I highly recommend you use this as a way to learn how to setup a TypeScript project for Express, and then slowly migrate over your code. Many of the concepts covered in my Express JS Full Course can easily be translated over once you get the idea of what to type annotate.
Link to Express JS 8 Hour Course: • Express JS Full Course
Code Repository: github.com/stuyy/express-type...
Support the Channel:
Become a Member: kzbin.info...
Become a Patreon: / stuyy
Buy me a Coffee: ko-fi.com/anson
Donate on Streamlabs: streamlabs.com/ansondevacadem...
Donate on PayPal: paypal.me/ansonfoong
Connect with me:
Twitter: / ansonthedev
Discord: / discord
GitHub: github.com/stuyy
Twitch: / stuy
0:00 - Project Setup
3:00 - Install Typescript
8:40 - tsconfig.json file
9:44 - Configuring TypeScript
13:00 - Compile TS Files
16:30 - Nodemon with Typescript
20:27 - Basic Type Annotations
35:08 - Type annotate Request Body
41:22 - Type annotate Query Parameters
43:41 - Type annotate Route Parameters
44:38 - Type annotate Response Body
51:06 - Extend Request Interface
54:50 - 3rd Party Libraries with TS
59:45 - Unit Tests with Jest and TS
1:08:25 - Integration Tests with Supertest
1:20:45 - Integration Tests

[@ayushshende4290]

Next tutorial can be a complete monorepo (like turborepo) with this stack, bonus add dockerization and deployment as well. Thanks for the amazing content.

[@naddulidaniel2630]

I have been waiting for this tutorial. Here we are. Thank you very much.

[@kncsmooth8737]

Your clear explanations, detailed examples, and thorough coverage made it a breeze to follow along and understand. I truly appreciate the effort you put into creating such valuable content. Looking forward to more tutorials from you in the future! Keep up the fantastic work!

[@ansonthedev]

Thanks a lot! I do try my best when making vids like these, so to hear stuff like this is very much appreciated. :)

[@user-pz3wj3yk2x]

Super helpful, thank you!

[@RatherBeCancelledThanHandled]

Explained clearly ; well done 👍

[@rupeshthapa8891]

This is very informative, thank you very much for the tutorial❤

[@sayeddileri3461]

Thank you so much Anson for this I am currently diving into testing and this is just perfect to help me get started. Thank you!!!

[@ansonthedev]

Glad to hear that. You're welcome. :D

[@johnattaiyinusa5766]

Great job, Anson

[@jens2504]

Awesome tutorial!

[@prashlovessamosa]

Thanks Anson.

[@Error404Codes]

i got my server down when i declare the index.d.ts for extend request interface , the controller file did not show erro and ts knows the property but server goes down Property 'CustomField' does nto type 'Request

[@riyad-appscode]

awesome tutorial. Thanks for the video

[@ansonthedev]

You're welcome. Thanks! :D

[@maximoignacio6959]

Thank you very much! 1:14:55 import express from 'express'; let app: ReturnType; should work as well.

[@malikkadyraliev4871]

U r best, hello from Kyrgyzstan, really appreciate ur videos 👍

[@ansonthedev]

Thank you :)

[@gunasekarant6498]

Awesome one Thank you so much

[@ansonthedev]

You are welcome!

[@chamaraweerasinghe3909]

greate content keep up the good work

[@mohiwalla]

Good job 👍👏

[@ansonthedev]

Thanks! :D

[@jellyfish1772]

Thank you so much ..

[@ansonthedev]

You’re welcome

[@deathscythe3124]

How come you didn’t get an error when you name your user.ts router a const route then call it in index.ts as import userRouter. Im confuse. Please explain it to me

[@masadsummair]

Thanks for rich content . I just want to ask how you learn these concept like nestjs and other along with best practices any sources?

[@ansonthedev]

When you're a beginner, it's fine to refer to KZbin videos or courses on platforms like Udemy. When you become more advanced, you learn how to refer to documentation and build intuition with your experience.

[@iUmerFarooq]

When are you going to upload an advance ExpressJs tutorial? Thanks for this awesome tutorial 💚

[@ansonthedev]

It's in the works. Thank you!

[@smartdriver2990]

Wow, interesting 🎉

[@RobertMcGovernTarasis]

Very clear, thank you. You’ve now got my toes wet with typescript. 1 question, how come when you ran npm run test:e2e it only ran 1 test for you, but for me it’s running both the e2e test, and the handler test?

[@ansonthedev]

My guess would be you may have forgot to set the flag for the test:e2e script to run tests only in the src/e2e folder. By default it will run all .test.ts or .spec.ts test files.

[@sdawdwadaufyuaiudi2148]

almost every coures I find on youtube use any, only you explain what going in generic 40:17 ,thank . Is there any cheatsheat TypeScript for express,I can only cheatsheat for reactjs,it kinda suck

[@mahmoudnada2120]

I hope you will make a live stream again with a program that is stronger than chat🌺

[@igmtink]

can you make a tutorial how to setup both nextjs + expressjs with typescript sir? like nextjs for frontend and expressjs with typescript for backend just a simple to-do or any

[@prerakhere]

I don't understand when to use express-serve-static-core v/s express

[@jayjaayjaaay94]

1:05:46 how to differentiate one request to others?

[@mythmaker6155]

I am sorry to ask you this. but I am new to Express with TypeScript. i worked with django. But for expanding my tech stack i am learning to express the best way. One thing i loved in django(Django-ninja) was automatic API documentation. is there any way to achieve similar functionality in Express? I did search API documentation with Express but all I find is manual documentation. If there is any way to automatically generate documentation with Joi or TS interface it would be really helpful. BTW love the video. it got me started TS with Express

[@ansonthedev]

There is Swagger, not sure about it being automatic, but it does provide documenting your APIs for you.

[@nithya4860]

Wow!

[@abhayshaw1875]

Hey can we have a video on an opionated one :adonis js??

[@marcschiavone9549]

I believe it doesnt make much sense since here they explain the whole typescript + express setup and adonisjs is already typescript ready.

[@Pransshhh]

Should include how to host these on vercel or something like that

[@ansonthedev]

Not relevant to the tutorial.

[@Pransshhh]

@@ansonthedev Please make a video on this

[@devfabien]

This is an amazing tutorial. I would like to seek your recommendation; based on what you showed in tutorial most in the part of e2e test what is your point of view in using `App` type from supertest/types instead of assigning variable app to `Express` type. kzbin.info/www/bejne/eJaaiWmHf9qmgKM

[@ansonthedev]

I used "Express" because that's the inferred type from the express() function call that is returned. Never knew there was an App type. But I never had any issues using the Express type.