DEV Community

Cover image for Moving from JavaScript to TypeScript

Moving from JavaScript to TypeScript

Andrew Baisden on February 10, 2022

Introduction I have been a JavaScript developer for many years and I did not really have much intention to go outside of my technical st...
Collapse
 
maciekgrzybek profile image
Maciek Grzybek

Once you get into Typescript, there is no way back :) I feel like writing anything bigger than a blog in pure JS is just painful :)

Collapse
 
dvddpl profile image
Davide de Paolis • Edited

I'd also like to stress this point.

Typescript is great but it's also a pain.

More stuff to write, more stuff to read, less flexibility, more complexity in compiling and running tests etc. overall more clutter and things that distract you from your main goal: write code to solve problems.

Use it wisely and when it makes sense.

Let it use inference, tell it to shut up (be it wit ts ignore or with any) when you are prototyping or jotting some poc implementations and so on.

Basically use type and interfaces when it helps making explicit the contracts/signature of methods and object talking to each others.
And don't create mega types or interfaces, use composition. Extend interfaces and use union types/type concatenation.

Collapse
 
kostyatretyak profile image
Костя Третяк

Typescript... overall more clutter and things that distract you from your main goal: write code to solve problems.

This can only be said by someone who doesn't actually use TypeScript. Although I agree that code in TypeScript is often much harder to read.

Thread Thread
 
dvddpl profile image
Davide de Paolis

We use typescript in some of our projects. so this opnionated statement comes from direct experience.
I am not denying that TS is useful, I am stating that it makes code too verbose - and long.

We as devs, have to find a balance between the clarity that comes from typization and the readability of the code itself. When i read code quickly to do a review, or to debug something, i want to be able to quickly read and grasp the underlying logic - TS is too me, too often, simply longer to read.

Collapse
 
karlkras profile image
Karl Krasnowsky • Edited

"In my opinion anyone who hates JavaScript is likely to fall in love with TypeScript. Or at the very least find less reasons to complain about it."

Agreed, I fell into this group, but I was coming from a Java/.Net background. On the flip side, those who love JavaScript could be put off by imposing what essentially is an OOP layer on top of what has historically been a dynamic language so us "real" developers will be more comfortable with it (which of course I am).

Collapse
 
jwp profile image
John Peters

One day, TypeScript will overtake Javascript. Or get close. There's too much good in it to ignore. It's a wonderful language for Java and C# people.

Collapse
 
j3lte profile image
Jelte Lagendijk • Edited

To be honest, ever since I started writing things in Typescript (I had to learn React for work), it is hard to go back to Javascript. Sure, from time to time I'll write a little bit if absolutely needed, but I will always go back to TS.

I'm a stickler for clean code, Typescript + Prettier + TSLint + VSCode is my preferred way to go.

I type everything, there is hardly an 'any' anywhere in my code. Makes it way easier to debug, write clean code that's understandable...

Lately dabbling with Deno, which is also written in Typescript. Absolutely love it 😊

Collapse
 
bernardbaker profile image
Bernard Baker

I think that this a great article and it's really informative. While some values are inferred, for the purposes of demonstration the snippets are valid examples.

Collapse
 
neoprint3d profile image
Drew Ronsman

I will have to learn about typescript

Collapse
 
timbogdanov profile image
Tim Bogdanov

This is a very good introduction to typescript, thank you!

Collapse
 
ingosteinke profile image
Ingo Steinke, web developer

How do you manage to build express apps using TypeScript everywhere?
Your example is quite straightforward, but once you add node + express + mongoose it starts getting harder. Most tutorial and StackOverflow code is only JS (mostly JS that does not even pass the recommended ESLint rules either, not to talk about TypeScript yet) and if there are no prebuilt type files, you can end up spending hours guessing what return type a certain function might expect. At least I did when I started a new MERN side project and tried to use TypeScript everywhere. got me so frustrated I'd rather go back to PHP or any other properly typed language for the backend, or maybe use deno next time. What do you think?

Collapse
 
andrewbaisden profile image
Andrew Baisden

Yes this article was just an introduction. I am working on a follow up article Creating MERN Stack Applications 2022 and that tutorial will be using TypeScript. I taught myself how to build a MERN application using TypeScript without too many problems so it can be done.

Deno is a potential option too but I have not used it in a long time.

Collapse
 
mycarrysun profile image
Mike Harrison

I'd just like to stress the importance of actually learning the way things work instead of following and relying on tutorials for everything. If you can get good at reading the official documentation for languages/libraries you will be much better off. You'll then be able to use whatever stack you want and understand how they interplay together.

Collapse
 
Sloan, the sloth mascot
Comment deleted
Collapse
 
andrewbaisden profile image
Andrew Baisden

Sure no problem glad I could help. Those are both great courses and the Scrimba one is free so thats a real bonus. The Udemy course goes in depth though and includes the MERN stack.

Collapse
 
codewithtee profile image
Tabassum Khanum

Andrew Thank you for sharing this! Nice introduction to Typescript.

Collapse
 
andrewbaisden profile image
Andrew Baisden

Thanks for the kind words yes it is. If you already know JavaScript then learning TypeScript will come easy for you.

Collapse
 
femil profile image
Femil Savaliya

Awesome 😎

Collapse
 
mrdanishsaleem profile image
Danish Saleem

Thanks for sharing. Saving it for future

 
dvddpl profile image
Davide de Paolis

Agree. This is what I mean. We don't have to explicitly type everything. Most of the time devs do that though, making the code less readable. (of course that is a problem of how ts is used rather than of ts itself).
What I find annoying is just when you are passing around objects and starting out with my implementation and ts can't really infere much yet and start nagging about missing or invalid props. Then instead of going on with the implementation, you have to fix typing issues..

 
dvddpl profile image
Davide de Paolis

any doesn't actually map to that "mock" phase of coding, because you generally have an idea of what you want to receive, and what you want to do with it.

Well, often in the first phases of coding I really don't know what i am doing :sweatsmile - and most of all I don't care - I'd love to have a type whatever

Think of TDD, I am working on a feature, i start with an empty method, and have the test fail. maybe i didnt define yet precisely what will the input or output be, then gradually I add some logic and get a clearer picture - and decide that the method is too big, does to much, or the payload should be parsed, filtered, manipulated elsewhere before we pass it to the method.

having to think at types in that phase is to me very distracting.
and having to scatter around Number, Unknown or Promise<unknown[]> is a waste of time (both in writing and reading).

but i agree that is just a short phase, afterwards, i see, appreciate and use all the benefits of typescript and gradually add types ( although I try to minimize it, using lots of inference and eventually using some UnionTypes).
so I am definetly not against TS, but against a premature and eccessive use. like for design patterns and abstraction.

And again thanks for all the little hints (unknown, @ts-expect-error and Partial - that you mentioned on one of your posts, are very clever and useful and i did not know or remember them)

 
dvddpl profile image
Davide de Paolis

I dont recommend it either. not when code is shipped ( or simply being merged to main). I am talking about first phases of coding a specific feature. I want to focus on achieving the functionality.
when it works, i can make it safer, nices, extendable, readable, add all types and error handling etc.

at the beginning i dont want to wast time on defining the types on props or method i will likely refactor and throw away anyway. so having to type Record<PropertyKey, unknown> as result of a method i am jotting down, instead of simply.. not writing anything - is a huge waste of time.
focus on the problem, on the solution, on the code, and just TS-just-shut-the-f*-up and any everywhere!!! you will add types afterwards

having said that - thank your for mentioning @ts-expect-error, i wasnt aware of that and it is definetely very useful.

Collapse
 
ronaldaug profile image
ronaldaug • Edited

Typescript does not work in the browser

With a library like roll-up or vite, it's quite easy to make it works in the browser. You can change ".js" extension with ".ts" too.
Check it here

Collapse
 
pengeszikra profile image
Peter Vivo • Edited

You right: for learning TS best over solid JS knowledge.

Typescript great help over JS started when your program use complex, even dynamic types. Best thing is: you can declare by code any custom types, without irrelevant documentation.

Side note: VS Code isn't able to show complex type to unfolded format, but sometimes that will be handy.

Collapse
 
j3lte profile image
Jelte Lagendijk

Neat! I knew about the TS icon, didn't know about DT... Thanks for the tip :)

Collapse
 
kostyatretyak profile image
Костя Третяк

TypeScript with ExpressJS in 2022? - More relevant is Ditsmod, NestJS, etc

Collapse
 
andrewbaisden profile image
Andrew Baisden

ExpressJS is still the number one NodeJS back-end framework. With the biggest user base and the most resources available for it. NestJS is probably at number 2. I will most likely write my next article using ExpressJS and more modern alternative so it has a wider appeal.

Collapse
 
kostyatretyak profile image
Костя Третяк

In TypeScript context, ExpressJS is definitely not number one actually.

Collapse
 
retakenroots profile image
Rene Kootstra

Personally I love programming in JavaScript because of the freedom and mostly the lack of a compilation step. I have more than 20 years experience in c/c++/c# and java so you would think I would like the strong typing provided by typescript but that's not the case.

JavaScript has only a few types and quirks if someone can't master those what does that say about their kills. I have always felt that Typescript is a tool developed to convert classical developers into web developers.

Then again if you as a developer like it and helps you become more productive then by all means use it. We must choose the tools that make us better developers. But typescript is not for everyone...

Collapse
 
patoi profile image
István Pató
Collapse
 
darkside73 profile image
Darkside73 • Edited

You don't need to declare types for express callback. They are inferred from function declaration