Alex / KATT 🐱
@alexdotjs
Followers
23K
Following
19K
Media
525
Statuses
8K
👋 I'm Alex & I tweet about web dev stuff. 👉 Creator of @trpcio (⭐️35k+) 🧙♂️ Open-sourcerer & fully-stacked typescripter. 🦋 https://t.co/yOMByikmWe
Malmö, Sweden
Joined July 2010
This week I've been working on a declarative isomorphic permission library. On the backend we create Prisma `WhereInput`s & on the frontend we get rules like this. hopefully will OSS it soon
41
53
757
TIL that this is correct syntax and that `finally` runs after the return of the function. #junior4lyfe
51
33
687
Heyheheyheyhey!!!👋. I got something exciting to share! We just released the version 10 beta of tRPC! 🚀. Go have a look! 👇👇 (also, the website has gotten a real facelift recently 👀).
32
94
686
One of my favorite little ts utils. ```.export type Maybe<T> = T | undefined | null;.```
17
34
557
Did ya know you probably should be using `interface` rather than `type` where possible?.There's a section about this in the official wiki on ts performance.
19
67
451
me in 2021 after a 5 year long monogamous relationship with react
14
35
407
My mental model of how React renders my app is broken (again).
14
16
350
This is what I'd do. The way you typecast an unsafe object doesn't really matter, just ensure it's the right type instead.
TypeScript decision: How should a function that calls fetch be typed?. Options:.1. Type the return statement.2. Type the function's signature.3. Type both. Poll in the next tweet 👇. #typescript
11
33
352
tRPC will likely require TypeScript 4.9 pretty soon, does that satisfy you?.
19
7
337
Whaaaaaat!?!? 🤯💗♥️.
We're now the official Gold Sponsor of @alexdotjs' @trpcio for his amazing work in the open-source industry. We heavily use tRPC in our core app and look forward to the monthly consulting sessions, too! . Sponsor Alex:
24
6
267
Zod is the validation library in the JS/TS ecosystem with undoubtedly the best DX. 🔥. I use it everywhere:.- frontend forms.- backend request param parsing.- env var parsing.- validating shapes of third party APIs/webhooks.- validating json blobs in my db.
. aaaaaaaaaaand. 🤩🌟✨💫⭐️🌟✨💫⭐️🌟���💫🤩.⭐️ Zod just hit 10000 stars!!! ⭐️.🤩🌟✨💫⭐️🌟✨💫⭐️🌟✨💫🤩
9
15
246
Did you know that you can use @trpcio as the data layer in @nextjs to get a lightweight & secure layer with auth-checked code & runtime validated input/outputs?. You don't even need to use trpc routers, client, or the react libs. We should probably make a blog post about dis 👀.
Interesting Next.js RSC security article. 💡 TIL that using Layout for checking auth/payment is not great. The layout might not be accessible, but the page content can still leak through the RSC endpoint 😬. Using a middleware is a better protection
21
9
241
Spent half an hour hacking together a minimal tRPC client that is less than 1kb in size. Would this make for a good blog post or something? .
15
9
227
🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟.reached 10,000 stars yesterday! Truly awesome. 💞.🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟
17
17
213
We're very close to releasing support for FormData in mutations so you can do file uploads nicer (w/o base64 encoding 😅) & to support form submits w/o js enabled. @s4chinraja has done some really solid work to decouple our request handling to not only handle JSON bodies.
14
15
205
@ccccjjjjeeee Curl.Nodejs.GraphQL.LAMP.Jquery.Nginx.Redis.Sqlite.RoR / django / laravel.Git.
28
4
202
tRPC version 10 should *really* be viewed as tRPC version 2, I was just very strict about semver the first 6 months of tRPC (whilst very few people were using it). This is the first real *big* change to tRPC since its creation.
7
5
198
Co-sign. If you use suspense in your ("client") components and don't refactor your data fetching before updating to React 19, your app will become sluggish due to an optimization that I think most people likely would never even notice.
Now I definitely need to blog about the React 19 changes around suspense and sibling pre-rendering. I haven't seen anyone so far apart from the react core team who thinks this is the right tradeoff. v19.0.0 isn't out yet so maybe there's a slim chance to get them to reconsider.
6
14
192
Hard disagree. This is actually fine. Coupling is better than letting the clients stitch together a bunch of APIs in various slow request/response iterations (aka "waterfalls") . Use graphql or make a BFF, but avoid stitching APIs together too much on the client.
Just audited a codebase with a REST API that returns this:. {. table1: []. table2: []. main: [].}. Don’t couple your API to UI elements.
10
5
190
This must be my fave thing I've read this year:
What are the best (technical) blog posts and articles you've read this year?.
7
23
185
The first iteration of this has gotten approved internally at work, we'll be stress-testing our assumptions and hopefully OSSing it 🔜🤞.
This week I've been working on a declarative isomorphic permission library. On the backend we create Prisma `WhereInput`s & on the frontend we get rules like this. hopefully will OSS it soon
9
6
191
I got a real Friday treat for all full-stack TypeScript lovers. 🍬.Introducing zART 🤯 - Zero-API, React, & TypeScript. A monorepo showcasing how you can leverage the power of TS to never have to write an API-schema for your React [Native] app again.
7
30
189
We borrowed @remix_run's implementation on how they create a JSON representation of a specific type. then @s4chinraja improved it and fed that back into Remix!. OSS is pretty cool sometimes huh?. Also, follow @s4chinraja, he'll be your boss some day.
3
9
188
Imagine doing any big refactor [of code you haven't written yourself] without type-safety.
31
8
180
Y'all know we'll happily send you some $$$ if you contribute to tRPC? 💰.
9
26
178
I did my first-ever in person conference talk yesterday! . I'm so happy to be on the other side of it & that it went quite WELL! 😅 I was anxious for over a month ahead of it . I definitely want to do more of this shit now, hit me up! 👋.
15
3
174
GraphQL is still amazing and solves a lot of things that @trpcio doesn't. There's no silver bullet.
7
7
179
I really like where nextjs is going with the app dir stuff, I'm a ex-php guy who wrote my own php framework fifteen years ago in an eerily similar style to Remix/Nextjs stuff (I even had "action"-files using the PRG-pattern!). However, I mainly use React nextjs for *apps* [. ].
11
1
173
So proud of trpc being 6th overall in js-land star growth in 2022 and second in the full-stack category.
10
4
174
13
8
167
Apparently one of the biggest OnlyFans competitors, Fanvue, are using tRPC 🍆🤣.
13
3
163
5
6
159
Is this a kosher way of detecting version changes in @nextjs and forcing a reload on the next navigation change?. The goal is to turn any `<Link>` into an `<a>` if we have a new build. Full gist:
9
5
159
We just published an update to @trpcio that automatically serializes your output types to how JSON does it, in case you are **not** using something like superjson. tRPC without data transformers is now a lot better! 🥳.
5
11
160
is this the way to globally disable caching in @nextjs?. (I find automatically enabled caching too scary to use)
17
9
158
Yo @microsoft, if you ain't paying @AndaristRake for all his work on @typescript yet, you should start yesterday.
@anthonysheww @emmahamiltown Repro would be appreciated, with that on hand i can investigate it later.
11
7
154
The next major of @trpcio's main "feature" will be removing the v9 interop support. It's a bit painful to support two parallel APIs and removing it will speed us up :). Current diff 👇
I feel like people would expect new features in a major version, but that's mostly not what it is about. I know it makes them "less exciting", but it's about cleaning up all the little "mistakes" that have amassed over time.
4
2
154
I'm glad tRPC has automatic batching so my boss won't do random public attacks on my work in the future.
Btw, I’d like to apologize for Twitter being super slow in many countries. App is doing >1000 poorly batched RPCs just to render a home timeline!.
1
2
153
"While building a feature, we performed a database migration command locally, but it incorrectly pointed to the production environment instead, which dropped all tables in production.". I'm surprised this sort of incedent doesn't happen more frequently tbh. I've had prod access.
On February 21st, Resend experienced an outage that affected all users due to a database migration that went wrong. Here's a summary of what happened, how the incident was resolved, and the changes we're making moving forward.
12
1
151
🍏 tRPC is great. 🍊 GraphQL is great. They can and should be compared, but neither is "better" nor a silver bullet.
I will never disrespect GraphQL.
4
7
145
If you do anything with OSS, `gh pr checkout <<PR number>>` will save you a lot of annoyance.
damn i’ve been sleeping on the github cli.
9
7
140
@trpcio just hit 7k stars!! 🌟 🌟 🌟 🌟 🌟 🌟 🌟
tRPC passed 6,000 stars on GitHub today! 🤯 (6,014 as of writing!). 🌟🌟🌟🌟🌟🌟
4
6
138
nobody:. me: I hacked together a POC of an alternative API to `useFormState()` / `useActionState()` that I think is nicer than what's in @reactjs / @nextjs today.
I've made several attempts at trying to understand how to get `useFormState()`/`useActionState()` to work well isomorphically (which is the whole point, right!?). I made a repo to showcase the issues I have & added some API suggestions for React. Convince me I'm wrong. 🙏.👇
7
6
134
Oh jeez, spam bots have reached the trpc github repo. @github, surely you could detect and prevent this message from ever being sent?
21
5
131
🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟. that's 16 stars 👆. each of those represents a thousand people who've now starred @trpcio on GitHub, that is pretty damn crazy.
7
3
128
Revisited my lil' thing that tries to make sure that the user is always on the latest version of the app. The way I detect changes is that all tRPC response returns a request header with the commit hash which is used to signal that the next navigation should be a hard navigation
Is this a kosher way of detecting version changes in @nextjs and forcing a reload on the next navigation change?. The goal is to turn any `<Link>` into an `<a>` if we have a new build. Full gist:
2
7
124
Sooo. tRPC v10 is pretty ready! 🚀. buuuut there are still some room for tweaks & there are some API design decisions which already have had heated debates on GitHub even if we haven't shouted about the alpha yet. 🙋♂️ What is the best way to resolve those?.
9
3
123
🏃🏼 to get that last ✅.
This started as a shitpost and went way too far. Don't read into this, just trying to document some things I think about too much. I rant more in the thread
16
6
125
🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟.🤯 @trpcio just passed 12k stars! 🤯.🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟
🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟.reached 10,000 stars yesterday! Truly awesome. 💞.🌟🌟🌟🌟🌟🌟🌟🌟🌟🌟
7
4
120
Ok, LinkedIn won't be the next Twitter at least. 😂. I've actually never received this kind of clueless/rude/arrogant hot take here in regards to @trpcio 🤡
17
0
118
I'm so glad this hack is obsolete in TypeScript 5.5 🎉
TypeScript tip 💡.Use `.flatMap()` to filter items in a type-safe manner. Try it 👉
4
8
118
Oh shit, we've also broken 100,000 weekly downloads on npm 🤯.
5
2
117
very flattering to have @trpcio being mentioned in the React-blog as a known point of reference on how server actions work
3
4
116
💯 . It's a bit ridiculous that I've willingly reduced time, and a big chunk of my income, at my "real job" to hack on open-source stuff for free*. (* I'm very grateful to all my sponsors who also enable me to distribute some to other people).
I love maintaining open-source software and providing support for anyone who needs help using it. It's admittedly a bit ridiculous that we do it for free, but I love it anyway.
3
1
111
I genuinely don't know how to deal with this graph! 😳💞. The most astonishing thing to me is that we've really not done any groundbreaking changes in over a year(!), but it's really exploding right b/c of a series of compounding events (& a lot of thanks to @t3dotgg's rants tbh)
5
5
114
Talked to a friend the other day who works at a company where some tech leads are lobbying that the solution to their recruiting problems is to migrate their whole tech stack from Vue to React 🤦♂️.
What happened to the "choose boring tech" movement?.
19
4
112
So incredibly happy to see this pic of these amazing human beings 🤩.
7
2
111
Wdym @DavidKPiano, we only get fan mail and donor enquiries 😍😂
I don't think many developers realize how stressful being an open-source maintainer can be. You provide countless hours of work and support, for *free*. And devs will still complain and unfairly criticize your work. But the ones that are appreciative keep us going.
8
2
111
Anyone knows why these don't act the same way and how I can make number 2 act like number 1?. (zup @mattpocockuk?👀)
12
4
108
New lil' feature ✨ . Do you find it annoying to invalidate specific queries on every mutation and keeping track of what should be invalidated? . If so, maybe you want to always invalidate all queries automatically on any mutation.
11
2
109
Can someone help me write or structure a blog post? The main thing holding back the RC of @trpcio 10 is my inability to write the announcement post 🤦♂️. The whole marketing thing has never been my strong suit 🥲 I'm glad it hasn't held back the growth too much.
19
4
105
Today I used the `form` attribute (for the first time ever 😅) - Now I can place my submit buttons anywhere instead of always nested within the `<form>` . it's great and makes complex layout-code way less messy.
2
6
106
The new major of tRPC is slooowly getting there 👀. Spoiler: it's going to be 🤯 + fully backward compatible with an interoperability mode which will make incremental adoption trivial 🔥.
6
6
107
Hey, in the last couple of weeks we've (amongst other things) added:. - support for SSE in subscriptions (example at .- returning async generators in queries/mutations for streaming responses from LLMs etc.
6
8
101
Has anyone written a nice & small TypeScript-based `Promise.props()` util? I've missed this ever since I stopped using bluebirdjs in favor of native promise fns.
9
8
101
@kentcdodds Thank you! I'm sorry for how I responded to it too, thanks for all the good work you do as well :).
1
0
98
- Decoupling is often an anti pattern.- Few big files with code > many small files.- Your company should try to stick with 1 language for everything.- Monorepo 4 lyfe.- Serverful is easier than serverless.
6
3
96
Does anyone have a quick starter for creating a ts package? . I want:.- vitest.- changesets.- ci job that publises to npm.- eslint / prettier.
6
1
100
Imagine if every engineering team had a $1000/month budget for supporting OSS.
We now support businesses @polar_sh.- Sync your GitHub team.- Set a monthly budget.- Set team member limits. Enable your engineers to easily fund open source efforts. Increase your own velocity & fund open source. Win-win. Just set our own team allowance: $200/month/engineer.
5
3
97
Have you seen the new inference helpers for v10? Kudos to @jullerino & @s4chinraja for pushing this through! Go & follow them! 💞
3
2
97
Is `force-cache` really a good default when that is not what the standard browser `fetch()` does? . From
14
7
99
@tannerlinsley how soon until you build an alternative to Next.js/Remix? You have most of the pieces soon 😅.
10
0
97
With tRPC + Next.js 13, you'll have your components render on the edge but be able to have the "server logic" in a traditional lambda close to the DB. Unless you have a globally distributed DB, I at least *think* this is the best approach?.
Shower-thought: if you have any query waterfalls in your app, serving it on "the edge" will actually make it *slower* compared to hosting your app close to your data. I think I just killed my own hype for serving dynamic sites on the edge. Am I thinking about it wrong?.
8
5
94
@devagrawal09 @trpcio Haha yeah, people tend to get surprised about that. We mainly care that the "edges" are well typed to create the DX we want. The juice is not worth the squeeze in a bunch of the internals.
2
0
96
@AdamRackis Yeah man, way too light, it's lucky your measurement system doubles all numbers tho. 🙃.
3
0
87
If we generated typesafe Swift or Kotlin SDKs automatically for your tRPC API, would you be interested?.
15
0
91
The European mind cannot comprehend this.
24
0
91
Me and @jullerino are hacking on automatic hydration for server-rendered "use client"-components component by generating a `<script>`-tag on the server that gets picked up by the browser
12
2
91
