Theo's Typesafe Cult

TTC

Theo's Typesafe Cult

Join the community to ask questions about Theo's Typesafe Cult and get answers from other members.

Join

How to fall under api limitations with on demand data?

I have a react application that displays a map and the current vehicle position that is updated every 10 seconds. Api limits me to 150 requests every 15 min which is not an issue for myself, however if I am expecting to launch this to 50+ daily users. What would be best way to still serve the most up to date information while still falling under api limitations?

Single element type of inferred router output array type

I'm trying to type a single object from an array but I don't want to manually create it. I've been using inferRouterOutputs so I was wondering if it's possible to remove the [] from the type so that it is just an object. ``` type RouterOutput = inferRouterOutputs<AppRouter>;...

Compiling TailwindCSS for Monorepos

I have a monorepo with workspaces - ui and client. I want to create components in ui and use them in client. I am using tailwindcss as my style provider, but am having a very hard time compiling it. I am not going to publish them on NPM, and it just need to work in client which is a nextjs project. Any help is appreciated....

How to transform type of object with TS so that the values are of same type but wrapped in Array

Can someone pls help with this issue I'm having. I have a type like so: ``` const myZodType = z.object({ name: z.string(), ...})...

How to deal with more complex / repeating backend logic?

Sometimes, when developing an application, more complex situations occur. For example, I have a category, which is assignable to either a post or a user, with the post and user obviously being to different entities in the db. Let's say I want to use the post and user, populated with their assigned categories in the frontend....

Where the heck do you collect data for analytics?

Attached is an excalidraw screenshot to hopefully explain this better, I'm struggling to figure out where to put analytics to be collected In my application, there are a lot of sources that data can come in from, lets take a user changing their consent for example. This event can come in from:...

Tailwind Base styling conflicting with .module.css

Any idea why Tailwind base would be breaking component styling from .module.css files? I've tried using Tailwind prefix and thought there'd be another way to scope Tailwind to specific components only but have had no luck

Return the result of a mutation

I'm trying return the id (which is a cuid that gets generated in the database) of an addProduct mutation back to the client. I get undefined if I fire the mutation once. Then I get the result of the first mutation if I fire the mutation a second time. Do I need a separate query to search for the the newly created item or is there a way to get the actual id of the first mutation upon firing the first mutation? ...

Rule of hooks error

Hello, I'm discovering T3 Stack and I'm struggling with the react rule of hooks. I would like to call this query : ```ts...

T3 server entry file or similar to run code on boot?

Where would i put some server code that I want to run when the server boots up? In Remix and Solid Start they have the entry.ts file, is there something similar in T3?...

Using create-t3-app for a websocket heavy app / proxying api requests

So at work we're looking to rebuild our frontend (a stock trading application) from scratch, it's currently made with angularjs (I know). So I was looking into t3-stack/next.js as a possible new stack. However there's a few caveats, my team is pretty adamant on using RTK Query because of the logging that RTK offers. Also most of our data comes from a 3rd party websocket, and I was wondering if it is even worth using next.js if most of your data comes from a websocket. Also, all of this is moot because I can't seem to get proxying to work, I need to proxy our api calls because of cors issues when running in local dev. I have both tried the http-proxy-middleware and the rewrites option in next.utils.js, and it doesn't seem to be triggering, all my axios calls are still going out to 'localhost:3000/api/whatever'. If anyone had a suggestion or example of proxying in next.js it would be appreciated...

Create T3 App Lighthouse Performances

How come the performance of the initial T3 app is low at 50/100?

create-t3-turbo full video walkthrough

I have no mobile dev experience and I’m getting kinda hung up on some seemingly simple concepts while trying to develop a create-t3-turbo app. Are there any full development walkthrough videos out there? Simple things like pnpm db-… are tricking me more than they probably should, so I’d love to see a full breakdown if it’s available!

chrome -internal-autofill-selected

chrome automatically adds this stupid style to text inputs that have autofill enabled on them tried looking at existing solutions & they all use box shadow, which doesn't support transparent backgrounds (since the chrome background is still there) any tips would be life saving, thanks...

Inviting a teammate with nextAuth

Hi guys, in [...nextAuth], the email provider is working nicely: ``` EmailProvider({...

Paginated Queries and Downloads

Hi all, I’ve got an application with a reporting module where the user can choose from some report params and then view a table (built with Tanstack Table) with the first 50 records.. I’m needing to add an “Export all” button that should page through all the data and write it out to an excel file. I’ve gone through multiple implementations of this, but so far I’ve only been able to make this work by writing the paginated query twice– once to power the table and one to fetch the data for the download (using tRPC’s useContext() hook). One reason I went this direction is because when performing the download, I don’t want the fetched data to cause a re-render of the table....

Should I use Tutorials?

Context: I only have knowledge with html, css, go, small amount of sql, and js, so I haven't really worked with react before. My end goal is making a web app that allows people in my college to visualize what classes they need to take to get to a certain class, and I decided to go with CT3A Question: Are there any resources that you could recommend that can get me up to speed with Next.js + React + Resources quickly? Furthermore, because of how unacquainted with the TS world I am are there any tutorials I should use?...

Best practice for protecting page / not letting anything run before redirect

In my app, I would like to protect a few key routes. The middleware implementation of NextAuth looks interesting but I am reluctant to swap out the strategy to 'jwt'. As such, I am protecting page by page with something as below: --- const { status } = useSession({...

How to fix env types on `schema.mjs`?

```js export const serverSchema = z.object({ NODE_ENV: z.enum(["development", "test", "production"]), VERCEL_ENV: z.enum(["development", "preview", "production"]), })...

Using dynamic Param slug in TRPC query

I seem to go in ups and downs in my love of TypeScript (I shouldn’t say that here tho 🙂 ) In a page, I would like to pass the slug of that page to a TRPC api call as follows: const router = useRouter()...