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

Looking for Developer

looking for a developer to help me build an app (only the base) with the following technologies: Next.js, TypeScript, Tailwind CSS, PostgreSQL, Drizzle ORM, Better Auth, pnpm, ESLint, Prettier, React Hook Form, Radix UI, Shadcn/Ui. Crypto payments only...

Best way to handle min width/height in uploadthing route input?

I am having trouble following https://docs.uploadthing.com/file-routes#input and https://docs.uploadthing.com/getting-started/appdir to add an input in my route where I deny images that have a width or height less than X (enforce a min width/height). I tried something like this, but that doesn't seem to work: ```...

Handling Async Params and Suspense Queries in a T3 Stack Next.js App

I'm having issues with fetching data for my story/[storyId]/page.tsx component. ```ts 'use client' import { notFound } from "next/navigation";...

Is there a way to use useQuery in server actions?

My aim here is to get all of the properties that useQuery (via trpc) provides - loading, error, onSuccess for mutations, etc - returned from my server action so that I can reflect that in UI updates. I'm not entirely sure what the difference in use is between next server actions and trpc's server-side api, to be honest. They seem to have a lot of overlap This is my server action:...

Bug occured while initializing t3-turbo with bun as package manager.

How can use bun as a run time and also as a package manager with t3-turbo?
No description

Tailwindcss looks weird after @uploadthing/react/styles.css

https://docs.uploadthing.com/getting-started/appdir#add-upload-things-styles I have completed all the steps in the documentation but there are still problems with my project. The styles of my project are all messed up. Any solution? versions: ```...

How can we handle transferable={false} with Clerk elements while building custom UI?

import { SignIn } from "@clerk/nextjs"; export default function Page() { return ( <div className="w-full min-h-screen flex items-center justify-center">...

Error: cannot find package in yarn PnP

I’m working on a Yarn v3 workspace using Plug’n’Play (PnP) for package management, and I’m encountering a module resolution issue when running my server When I try to start my development server using nodemon, I get the following error: node:internal/modules/run_main:122...

Revalidation for data using next.js 15 route handlers

I've developed an application using Next.js 15, utilizing API routes for the backend. However, I'm encountering an issue where, after posting data, the new information only appears upon manually refreshing the page. Despite looking at official documentation, watching tutorials, and reading articles, I haven't found a solution. I'm beginning to think that to achieve active refresh upon table updates, I might need to use Server Actions instead of API route handlers, since whereever I looked at for revalidation, everyone was using server components. // DataTable.tsx ```typescript useEffect(() => {...

Request url has trailing slash before query params depending on params order

Encountered a very strange issue, I am not sure if it is related to axios or something else so I'll try to find help here. I am using a custom useQuery wrapper and custom axios instance for fetching data: ``` const listUsers = usePaginatedQuery({...

How do I check video metadata in frontend without using any packages that requires NodeJS.

How do I check video metadata in frontend without using any packages that requires NodeJS. I need a full fledged frontend solution.

The image is stored on UploadThing but it doesn't return the url

Hello everyone, Locally, everything works correctly, including image uploads, but in production, it's not the case. Could this be due to a Cloudflare block? Is there something additional that I'm missing? The API runs on Next.js....
No description

Google Docs Clone Tech Stack

I've been thinking about creating a Google Docs clone with Google Classroom integration. However, I’ve never built a full-stack app before—only Chrome extensions and frontend websites using TypeScript and Svelte. I'm curious about what tech stack people would recommend. I watched Theo’s video, "I Built the Same App with 5 Different Stacks," and have been learning a lot about Elixir. However, I’m unsure if the potential scalability benefits are worth learning an entirely new language. Would learning Elixir be useful for development when my main goal is to land a job? I imagine most companies primarily use a full TypeScript stack. I'm open to learning a new language, but I don’t want to invest time in Elixir only to find that I never actually use it in a job....

Redux Optimistic update

hey guys i am making a desktop app with electron, i wanna ask regarding how u keep the states synced between sqlite and redux ( or any state management lib ) rn what i m doing is doing optimistic updates on (optimistic update bts put it in the queue) ``` dispatch(addOptimisticWorkspace({workspace:newWorkspac})...

which SaaS is used to make this https://docs.uploadthing.com/

I am looking forward to know which documentation saas or open source application has been used to create this documentation like we are looking forward to migrate from intercom and I liked this and couple of other companies like https://docs.erxes.io/ is also using similar but I am unable to findout which is it? Please if anybody knows share the name of saas or opensource application

Stream Closed, but I'm getting my results

So I have this procedure that simply returns a list of objects from db: ```js getAllHabits: protectedProcedure.query(({ ctx }) => { if (!ctx.session.user.id) return []; // return [] const userId = ctx.session.user.id;...

Mac: Disable window resize when moving mouse pointer to right edge of screen

Hey mac users, do any of ya'll have a solution for this? Like maybe an external app / github repo or something?
No description

Filter/search files in uploadthing REST API

I'm building a tiny wrapper around the uploadthing REST API. You can list files with the listFiles endpoint, but it doesn't seem to accept any type of params for filtering. Since there's a search bar in the uploadthing files overview, I thought there would be a way to also filter files via API. I could fetch all files and filter them myself, but that seems inefficient....

Unit/Integration test strategies for create-t3-app?

I come from a Java app maintenance background, and I'd like to try to do more product development in my spare time. create-t3-app looks great for that, but I like to have a lot of tests, especially because I haven't written much typescript in the last little while. I don't see much written about test strategies other than integration tests for the TRPC controllers https://create.t3.gg/en/usage/trpc#sample-integration-test. Is this enough normally for large applications? Does anyone have other recommendations? What about testing the frontend with NextJS?...

CSS scroll snap to CSS column rule

Hey, This is a really tough question, but does anyone know how I can get CSS scroll snap working to the edge of a css column, like say I have 10 css columns horizontally (most of them off screen of course), I want to be able to snap between the columns...