How to structure pages and components for a simple web app using t3 stack?
I am new to front-end development and I am using the t3 stack to create a simple web app for our customers to view their data. The homepage of the app consists of a login screen and once logged in, the user is taken to their dashboard. Currently, the dashboard has two pages: "My Lines" and "Billing".
My question is: how should I structure the pages and components directories? I was thinking of creating a dashboard page with a header and a sidebar, which will render the other pages for the user. Specifically, my folder structure would look like this:
```markdown...
API documentation tools?
I am looking for good tools to document an API. The result should be something like the t3 docs or tailwind
Astro extension doesn't use `prettier-plugin-tailwindcss` when formatting
Ran into a weird issue when setting up automatic Tailwind class sorting inside a pnpm-based Astro project. I tried to resolve it, but I was unable to find a solution myself; could anyone point me in the right direction, please 🥺
I have
prettier and prettier-plugin-tailwindcss installed as devDependencies:
```json
{...Type interface of map error
```ts
interface TableData {
[databaseName: string]: number;
}
function foo(): TableData {...
Pagination in Prisma query not working correctly near end of results
I'm using Prisma to query a Postgres database and implement pagination. However, I'm running into an issue where the pagination doesn't seem to be working correctly near the end of the results.
Here's the query I'm using for reference:
```js...
Should i use prisma if i know that my service WILL get ddos-ed?
So i got the assignment and the part of it an auth service. Teacher made sure that they will load-test it so i need to make it the most stable. Should i use prisma? it feels like prisma's data flow will 💩 all over the place. im specifically looking at @Brendonovich's prisma-client-rust
Prisma: best way to structure these D&D schemas?
Context: I'm using tRPC, Prisma, and MongoDB
I have a few models like Campaign, Player, NPC, and Battle
Campaigns have many Player/NPC/Battle:...
NextJS Element Type Invalid when importing Icon components?
I'm importing icon components in my next app and whenever I try to render them I get an "Element type is invalid" message. Importing from
lucide-react if that matters. Weird thing was these icons were previously working perfectly and now it's throwing this error if I try to use them
writing a user search functionality (trpc+prisma+next.js)
does anyone have any articles/stack overflow posts on how i could implement a user search in my app? im less concerned with the server part of it (as in, best ranking records against the user search term), but more concerned with how to handle the client <-> server interaction.
my thought process is: obviously i dont want to make http reqs on every keystroke, but also i want the results to be as responsive to the search term as possible. i was considering that after x keystrokes, i return a ranked list of users to the client, and then the client filters until the ranked list gets too small (whatever we define "too small" as), and then refetches from the server in that instance.
having trouble wording the google search on this one, wondering if anybody has advice. thanks!...
Tree Shaking with Good DX
I'm trying to see if there's a solution where I can have a great developer experience (DX) (Ability to call elements as children of the parent like <Table.Row>) but also tree shake my primitive UI components.
Given the following code...
```js
const _Table = ({children}) => React.createElement("Table", {children});...
Weird VS Code on Save
Hey guys! I have some weird interaction occurring on save with a new create-t3-app project, when I save
index.tsx It does this weird thing where it keeps adding another type import into the import of next. Anyone else experienced this?
Next.js Hydration error happening only in production.
There is a bug I've been trying to solve on the website I work at. There is one specific page that triggers an hydration error:
https://reactjs.org/docs/error-decoder.html/?invariant=418
https://reactjs.org/docs/error-decoder.html/?invariant=425
The main issue is that it only happens in production. On top of that, it only triggers when I directly access the page, or refresh it. If I'm at the home page, for example, and navigate to the page that triggers this error, it will not happen....
Good case to use getServerSideProps instead of ISR
Hey everyone!
I'm new to the next.js and i'm trying to figure out when one should use getServerSideProps instead of ISR since it is not recomended. I guess it is only viable for pages that changes data constantly, like every second?...
Prisma schema delete many to many
Hi, I have some troubles deleting a many to many relationship / data. Currently it says:
``ts
prisma:error
Invalid prisma.templateTag.deleteMany()` invocation:...Play audio inside a T3 app
Hi all!
I would like to play a success sounds when the user completes a task. What I have been trying is this:
import useSound from "use-sound";
import success from "../../public/sounds/fanfare.mp3";...
tRPC and querying data from external api
I am trying to set up the following this.
User writes a text in the form. He presses the button, the button puts input into tRPC and does a query(or maybe a mutation?) to send a completion request to OpenAI API and returns a result from there. I take this result and display it in the new text format bellow the button.
Right now I know I have realised it incorrectly as it is not working, but I have no idea how to solve this or what is the best practice. Maybe I shouldn't be using tRPC at all....
Unable to connect to Postgres DB with prisma
I just installed pgAdmin 4 and created a db, however once I run
npx prisma migrate dev I get the error User 'johndoe' was denied access on the database 'db.public'. Here is my database_url: postgresql://user:password@localhost:5432/db?schema=public. I also made sure that special characters have been converted inside % signs. Am I doing something wrong? Is there a specific way I need to create the database? Please help, thankyou.Setting up WS with t3App
I'm following the TRPC repo by Katt, but I keep getting ENV vars being invalid when I run the WSS.
This is the script, but it doesn't seem to work
```js...
What are the best ways to use TRPC procedures in getStaticProps ?
I wanted to know how can I use procedures made on my router from getStaticProps method