DEV Community

Cover image for TypeScript Best Practices — Part 1
Stephen Gbolagade
Stephen Gbolagade

Posted on

2

TypeScript Best Practices — Part 1

Having a source of truth for your Typescript file will not only make your code cleaner, but it will also help you fix any Type conflict that may arise as a result of duplicate types.

Do you know you can do this in TypeScript to make your code cleaner?

interface Author {
 id: string
 name: string
 posts: {
  title: string
  slug: string
}[]
}
Enter fullscreen mode Exit fullscreen mode

Then:

type AuthorPosts = Author["posts"]
Enter fullscreen mode Exit fullscreen mode

OR

type AuthorPosts = Pick<Author, "posts">
Enter fullscreen mode Exit fullscreen mode

instead of doing this repetition again:

interface AuthorPost {
 posts: {
  slug: string
  title: string
}[]
}
Enter fullscreen mode Exit fullscreen mode

Note:

Snippet A and B extract the posts types from Author, the results are similar. One extract the full post type as an object while the other one extract only the child of the type.

Snippets:
Typescriptsample

Try it!

Hot sauce if you're wrong - web dev trivia for staff engineers

Hot sauce if you're wrong · web dev trivia for staff engineers (Chris vs Jeremy, Leet Heat S1.E4)

  • Shipping Fast: Test your knowledge of deployment strategies and techniques
  • Authentication: Prove you know your OAuth from your JWT
  • CSS: Demonstrate your styling expertise under pressure
  • Acronyms: Decode the alphabet soup of web development
  • Accessibility: Show your commitment to building for everyone

Contestants must answer rapid-fire questions across the full stack of modern web development. Get it right, earn points. Get it wrong? The spice level goes up!

Watch Video 🌶️🔥

Top comments (0)

Image of Datadog

The Essential Toolkit for Front-end Developers

Take a user-centric approach to front-end monitoring that evolves alongside increasingly complex frameworks and single-page applications.

Get The Kit

👋 Kindness is contagious

If you found this post useful, please drop a ❤️ or leave a kind comment!

Okay