thevalorised Posts - Answer Overflow

thevalorised

•Created by thevalorised on 8/2/2023 in #questions

Host T3 app on a VPS

I just delivered a freelance job using t3 and the server provider of the company contacted me to ask if I could get the app running if they provided me ssh and plesk. Is it as simple as just git clone npm build start or should I dockerize the app and serve in a different manner. I have only worked with vercel so far so I can say I'm quite inexperienced when it comes to deployment. The app doesn't have any fancy lambdas or edge parts. What does the process of hosting a nextjs server on vps look like and what kind of problems I might face? Also on a side note, should I move db to the VPS or is supabase free tier good enough. There's not much data traffic and db size is pretty small. Thanks in advance.

6 replies

TTCTheo's Typesafe Cult

•Created by thevalorised on 7/25/2023 in #questions

SQL vs NO-SQL

Hi guys. I often find my self working with database structures resembling document dbs. No relation other than nested data. Because of my familiarity with working things like prisma and sql in general and great services like supabase and planetscale I still host these in sql databases. Is there any advantage to switching to a no-sql database in such cases?

9 replies

TTCTheo's Typesafe Cult

•Created by thevalorised on 7/19/2023 in #questions

How to wait for useState to finish before setting useRef value?

I have two following form elements that do similar things. Get value using useRef and adding it to an array of elements using useState. First one works perfectly. It sets the value and then removes everything in input element and unfocuses it. However with the second one I have to choose between pushing an empty string or letting the input element retain its value. I'm guessing that is because useState is async and I just got lucky in the first one because it is a faster operation and it executed before input element was reset. What is the correct way to use these two hooks together with reseting input element afterwards.

<form
  onSubmit={(e) => {
    e.preventDefault();
    const newTopCategoryVal = newTopCategory.current;
    if (!newTopCategoryVal) return;
    setCategories((prev) => [...prev, { name: newTopCategoryVal.value, subFilters: [] }]);
    newTopCategoryVal.value = "";
    newTopCategoryVal.blur();
  }}
  onFocus={() => { setActiveCategory(-1); setActiveSubCategory(-1) }}
  >

<form
  onSubmit={(e) => {
    e.preventDefault();
    const newTopCategoryVal = newTopCategory.current;
    if (!newTopCategoryVal) return;
    setCategories((prev) => [...prev, { name: newTopCategoryVal.value, subFilters: [] }]);
    newTopCategoryVal.value = "";
    newTopCategoryVal.blur();
  }}
  onFocus={() => { setActiveCategory(-1); setActiveSubCategory(-1) }}
  >

<form
  onSubmit={(e) => {
    e.preventDefault();
    const newSubCatInput = newSubCategory.current;
    if (!newSubCatInput || newSubCatInput.value.trim().length < 1) return;
    setCategories((prev) => {
       const oldCategories = Array.from(prev);
      const categoryToEdit = oldCategories[activeCategory];
      if (!categoryToEdit) return oldCategories;
      oldCategories.splice(activeCategory, 1, {
        ...categoryToEdit,
        subFilters: [...categoryToEdit.subFilters, newSubCatInput.value],
     });
      return oldCategories;
      }
    );
  newSubCatInput.value = "";
  newSubCatInput.blur();
  }}
>

<form
  onSubmit={(e) => {
    e.preventDefault();
    const newSubCatInput = newSubCategory.current;
    if (!newSubCatInput || newSubCatInput.value.trim().length < 1) return;
    setCategories((prev) => {
       const oldCategories = Array.from(prev);
      const categoryToEdit = oldCategories[activeCategory];
      if (!categoryToEdit) return oldCategories;
      oldCategories.splice(activeCategory, 1, {
        ...categoryToEdit,
        subFilters: [...categoryToEdit.subFilters, newSubCatInput.value],
     });
      return oldCategories;
      }
    );
  newSubCatInput.value = "";
  newSubCatInput.blur();
  }}
>

11 replies

TTCTheo's Typesafe Cult

•Created by thevalorised on 7/17/2023 in #questions

Fetching Data on the Server

I was checking out the create-t3-app docs and saw that getServerSide props was discouraged. Then what would be the better way of data that should be available on page load. For example in my current project I have a nav bar that populates the products element with data fetched from the server. When activity on page is low response time can be around 2 seconds from supabase. Instead of fetching this on client side and waiting I'd rather have the page load for a bit longer and serve all as static html. Since hosting and database are in the same location it may even speed up the full load of the page. What would be the better alternative then fetching on client side for such case?

8 replies

TTCTheo's Typesafe Cult

•Created by thevalorised on 7/10/2023 in #questions

Prisma not creating entries in the given order

6 replies

TTCTheo's Typesafe Cult

•Created by thevalorised on 5/31/2023 in #questions

File Uploads to Local Storage

I'm building a website for my brother's shop. They want an admin panel where they can add new product pages. I'm mostly done except for image uploads. I got it working using normal api routes but couldn't find a way to achieve it in trpc. Since all of the project is typesafe back-to-front there are a lot of warnings and errors in my file upload api. They're already paying a hosting company for storage so I don't want to upload to S3, public folder in the server is quite ok. Is there a template or piece of trpc router I can use to upload my formdata photos? Thanks in advance.

7 replies

TTCTheo's Typesafe Cult

•Created by thevalorised on 10/31/2022 in #questions

How to throw a tRPC error if prisma query returns null

18 replies

Gaming

Programming