Why Tsup Beats Nodemon and Ts-Node for Path Alias in TypeScript
| |

Why Tsup Beats Nodemon and Ts-Node for Path Alias in TypeScript

Introduction To answer the title’s questions, it’s because no extra configuration is required for tsup! I have previously talked about how we can get a typescript projected started with tsup, typescript and express. I have also mentioned that we did not configure tsconfig.json, so let us tackle this part with path aliases! Note that for…

Build Better and Faster Bundles with TypeScript and Express using tsup
| | |

Build Better and Faster Bundles with TypeScript and Express using tsup

Introduction Forget about ts-node and nodemon, tsup is the way to go. It is a command-line tool that allows you to bundle Typescript code with performance in mind. It uses esbuild under the hood, which is a fast bundler and minifier. Get your entire typescript project bundled with a command that is as simple as…

How To Extend Express Request Interface in Typescript
| |

How To Extend Express Request Interface in Typescript

The problem You will likely be caught in this situation when you create middleware that processes the request data before it reaches the resource route. An example of this is JWT, where you will need to decode the token before every request, and put in the decoded data somewhere. In Javascript, it would have been…

6 Awesome Tricks with the Spread and Rest Operators in Typescript and Javascript Objects
| |

6 Awesome Tricks with the Spread and Rest Operators in Typescript and Javascript Objects

Introduction You may have seen this syntax in Typescript and Javascript Projects before: if you have used React, then you have very likely encountered this syntax a couple of times when passing the props from one component to another. The support for the spread and rest operators was added since: Typescript 2.1 and onwards Javascript…

Project Anchor Dev Log 1: The strength of being a technical and creative person
|

Project Anchor Dev Log 1: The strength of being a technical and creative person

When I set out to develop my own creative writing app, I really didn’t know what I signed myself up for. I didn’t have any prior knowledge in APIs, databases, ORM, React, ES6 Javascript, Typescript, and the list keeps going. The best I could do at the time was create web forms through jQuery, and…

Cannot start React App after installing Storybook? Here’s how to fix it
| |

Cannot start React App after installing Storybook? Here’s how to fix it

The Problem When Starting React You may have come across this issue when starting your react app after installing storybook: which is one hell of a message to read! but this gist of it is this: React uses a specific version of babel-loader, which has been overriden by storybook. With an incompatible version installed, our…

How to Configure a Path Alias in a React Typescript App for cleaner imports
| |

How to Configure a Path Alias in a React Typescript App for cleaner imports

Introduction As your Typescript React project grows with everything neatly separated in their own folder, the importing processes starts to become messy. This is specially true if we are following a project structure like react-bulletproof. Problem Your project strucure may look like this: and for us to import Button.tsx in TodoItem.tsx, our import statement will…