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

React UseState interface and eslint - am I doing this right?

eslint no-unused-vars rule is failing on the variables in the interfaces for my react components. I have n-number of components and I manage their state from the parent component, so I declare an interface in the component and pass the useState from the parent component to the child component using props. Each component starts with an interface declaration like so...

Next.js 15 + Turbopack breaks TailwindCSS?

Does anyone else notice that TailwindCSS colors aren't applied in the hot reload until they magically get applied later? Even though I spam Ctrl+S/Cmd+S to save the file to reload the preview, TailwindCSS colors won't get applied. You can replicate the phenomena by running npm [email protected] and enable tailwindcss and turbopack, then applying bg-color, text-color, and border border-color to any JSX....
No description

Next JS slow initial compile time

Hello! I was hoping someone could possibly give me some advice on what I should attempt, or what I should consider with an app that I am developing at work with Next.JS. I am currently running into an issue where the initial compile of my page takes like 10-12 seconds to compile and the user is left sitting there with no indicator that its compiling. I've read that this is common for next.js projects when you try hosting it yourself, but I thought I would ask you guys. Any tips on how to speed u...

Vercel Deployment failing on fresh create-next-app, no logs outside of saying public folder empty

https://github.com/codymurphyjones/bubble-experiments This is the repo that I am trying to deploy, all I did was run npx create-next-app and follow the prompt and try to deploy it. Is there a step I'm missing that has been added or is something wrong?...

One line param checking question

in javascript, you want to: 1. inside of a function (let's call this functionA), run a function once (let's cal this function functionB) 2. check the return value of functionB 3. IF the return value of functionB is truthy or meets a certain criteria, you return from the parent scope that called it (functionA). ...

unable to create app

I just signed up, but when I try to create an app and keep clicking the Create App button, nothing happens. I’ve tried logging in on different browsers and devices, but it still doesn’t work. Even if I leave it as is after clicking the button, there’s no loading or progress—nothing at all.

unable to create app

I just signed up, but when I try to create an app and keep clicking the Create App button, nothing happens. I’ve tried logging in on different browsers and devices, but it still doesn’t work. Even if I leave it as is after clicking the button, there’s no loading or progress—nothing at all. I really need help with this!

Flowbite vs tailwind UI vs shacdn vs ??

I want to create an application UI in React with: * Dark/Light mode support * Charts * Paginated, searchable, and sortable tables * A large collection of reusable components...
Solution:
Flowbite is not extensible like that, it comes with predefined class names alongside standard Tailwind classes, or actual Components if you use it with some framework (e.g. react) However, you DO NOT own the code, you get the code bundled into your modules and can use it, but you CANT change it - the only way to change the style and behavior is through props. In that sense flowbite is a component library like MUI for example. ShadCn works completely different from that, when you run the command to install a component, they put an actual .tsx file into your code that has exports that component (e.g. Button). ...

Links to FAQ does not work

QUESTIONS GO IN & support - also check the FAQ https://3.gg/faq The link to FAQ does not work. I see no link to support as well...

Need a free cursor pagination API for testing

Need something like https://jsonplaceholder.typicode.com/ but supports cursor pagination. Anything like that exist?

Code eg for nextjs

I need help using the Uploadthing SDK. I couldn't find code eg for my use case in the docs 1. all images are public. 2. I don’t want any client level integration, such as uploads from the client using url. 3. All of the images are uploaded from the server....

[Rails + UT] How to use UploadThing outside of JS ecosystem, using Rest API?

Hey, I am building file upload functionality for my Expo+Rails app. I was hoping to use UploadThing for it's robust FE library and the managed s3 experience. Firstly, the docs aren't friendly for non-JS folks, please look into that - a lot of contradicting/variety of information. I am calling the /v6/prepareUpload endpoint in my /api/uploadthing api controller but it is not returning presigned urls as one would hope reading the REST api docs. Here is the shape of the output:...

Seeking recommendations for frontend web development learning materials

Hi everyone, I’ve been watching a lot of Theo recently, and I find that his community might be the best place for me to ask this question. I’m a CS graduate with a couple of professional projects in Golang, focusing on backend API development. While frontend web development isn't my primary interest, I’m eager to learn how to build the frontend of an application I’m currently working on. This web app will serve as the consumer of an API that responds purely in JSON, and the main user interface to the app....

Help needed in making a node lib with cli

so i have made a react form lib, i wanna deploy it to npm but the issue is i wanna keep everything as a monorepo ( like my dev which is in nextjs and package ), for that i used lerna , now the issue is i am not able to properly config it, what i want is like shadcn all the files get copied into the working dir so that user ll have access to everything and on top to that i also want that user should run a patch for react-hook-form ( there is a bug in that ) before competing the installisation

@uploadthings/react error

hey there i am using @uploadthings/react latest package it is working great on local but when i build my project i am facing error on node_module of this package and i am stuck on it. Anyone know which package version is working or how to fix it?

One click image upload form

I want to create a one click image upload button, ideally using next JS's server actions. i would like to have a form, in which the only element is an input field that the user can upload a file to, as soon as the file is uploaded - I want the form to be submitted, and the server action to run. Currently - i am doing this like so....
No description

Using Cognito in T3?

Hi all! Has anyone managed to get Cognito to work in T3? I tried to add it as another provider, where I have configured: COGNITO_CLIENT_ID = {client it for the identity pool} COGNITO_CLIENT_SECRET= '' (I am not sure where to find this value) COGNITO_ISSUER = {https://cognito-idp.{region}.amazonaws.com/{PoolId}} Is there something very obvious that I have missed here?...
No description

What is the standard way to fetch on RSC

create t3 app using App Router uses prefetch and hydrate client by default but why not use the caller instead? What is the benefit of prefetch? ```tsx export default async function Home(){ void api.post.getLatest.prefetch();...
Solution:
No need to pass props down and handle errors etc.

next js middleware infinite redirect

I have three pages in my app register , login , home if user is not logged he gets redirected to login page , the home page is accessed only if the user is authenticated which is determined if there is a cookie in the browser I wanna implement protected routes via next js middleware scenario : I am having a issue when I login I am redirected to the home page if I go i should be redirected to the home page the previous page is the login page when I do that problem: i get a too many redirects error for a moment then I am redirected to home page as expected I inspected the network tab there is a pattern that goes like this before i am finally redirected to the home page /login page requested (307 temporary redirect) , /home page requested(307 temporary redirect) repeated several times , I also wanna mention that this happens when i am at the login page and try to go to forward and backward pages and get redirected to login since i am not logged in and then login get redirected to home page and try to go back here is the code
``` import { NextRequest, NextResponse } from 'next/server'; export function middleware(request: NextRequest, response: NextResponse) { const isUserLogged = request.cookies.get('chat_accessToken');...

Uploadthing with Next.j, Clerk JWT Convex

hi, I'm creating an application with next.js and convex with clerk's JWT. I'm trying to integrate uploadthing with clerk, I followed the steps in the documentation but I wasn't successful in the part of verifying the user by uploadthing itself using .middleware(() => handleAuth()) //src/app/api/uploadthing/core.ts When I use clerk's JWT with convex, the userId is not captured using auth(), but rather by useUser(), performing the following scheme ...