niko Posts - Answer Overflow

niko

Explore posts from servers

TtRPC TTCTheo's Typesafe Cult DTDrizzle Team

•Created by niko on 11/15/2024 in #questions

Struggling to Choose a Type-Safe Backend for a Podcast Streaming Service Without a Monorepo

I’m building a podcast streaming service using Next.js for the web and a React Native app for mobile. I’m not sure what to do about the backend. I really want to use tRPC for both, but tRPC feels a bit complex since I don’t want to use a monorepo (it’s an extra headache). I want to keep them in separate repositories. Here’s my current idea: - Use raw Next.js API routes (without tRPC) and consume that API in the React Native app. - Alternatively, use Hono.js as a serverless framework, host it on Cloudflare Workers, and consume it in both Next.js and React Native. The problem is that neither approach will be type-safe, and I think that will cause more headaches in the long run. You might suggest using GraphQL with a type generation tool, but I’ve tried writing GraphQL backends before and found the experience horrible. What should I do? I’d love to hear your thoughts.

20 replies

TtRPC

•Created by niko on 11/15/2024 in #❓-help

Building CLI tool for trpc for type generation

I'm building trpc types cli tool for my use case. i use nextjs for api and i want to implement same functionality in another nextjs app without copy pasting whole api folder to that one, i already made type generation tool just testing around if it will work this is what main nextjs api /api/trpc/[trpc]/route.ts code looks like, im allowing to bypass cors issue when making request from another nextjs app in my case localhost:3000 is main and localhost:3001 is second

import { fetchRequestHandler } from "@trpc/server/adapters/fetch";
import { type NextRequest } from "next/server";

import { env } from "@/env";
import { appRouter } from "@/server/api/root";
import { createTRPCContext } from "@/server/api/trpc";

const corsHeaders = {
  "Access-Control-Allow-Origin": "http://localhost:3001",
  "Access-Control-Request-Method": "*",
  "Access-Control-Allow-Methods": "OPTIONS, GET, POST",
  "Access-Control-Allow-Headers": "*",
  "Access-Control-Allow-Credentials": "true",
};

const createContext = async (req: NextRequest) => {
  return createTRPCContext({
    headers: req.headers,
  });
};

const handler = async (req: NextRequest) => {
  const response = await fetchRequestHandler({
    endpoint: "/api/trpc",
    req,
    router: appRouter,
    createContext: () => createContext(req),
    onError:
      env.NODE_ENV === "development"
        ? ({ path, error }) => {
            console.error(
              `❌ tRPC failed on ${path ?? "<no-path>"}: ${error.message}`,
            );
          }
        : undefined,
  });

  // Create a new response with CORS headers
  const newResponse = new Response(response.body, response);
  newResponse.headers.set("Content-Type", "application/json");

  Object.entries(corsHeaders).forEach(([key, value]) => {
    newResponse.headers.set(key, value);
  });

  return newResponse;
};

export { handler as GET, handler as POST, handler as OPTIONS };

import { fetchRequestHandler } from "@trpc/server/adapters/fetch";
import { type NextRequest } from "next/server";

import { env } from "@/env";
import { appRouter } from "@/server/api/root";
import { createTRPCContext } from "@/server/api/trpc";

const corsHeaders = {
  "Access-Control-Allow-Origin": "http://localhost:3001",
  "Access-Control-Request-Method": "*",
  "Access-Control-Allow-Methods": "OPTIONS, GET, POST",
  "Access-Control-Allow-Headers": "*",
  "Access-Control-Allow-Credentials": "true",
};

const createContext = async (req: NextRequest) => {
  return createTRPCContext({
    headers: req.headers,
  });
};

const handler = async (req: NextRequest) => {
  const response = await fetchRequestHandler({
    endpoint: "/api/trpc",
    req,
    router: appRouter,
    createContext: () => createContext(req),
    onError:
      env.NODE_ENV === "development"
        ? ({ path, error }) => {
            console.error(
              `❌ tRPC failed on ${path ?? "<no-path>"}: ${error.message}`,
            );
          }
        : undefined,
  });

  // Create a new response with CORS headers
  const newResponse = new Response(response.body, response);
  newResponse.headers.set("Content-Type", "application/json");

  Object.entries(corsHeaders).forEach(([key, value]) => {
    newResponse.headers.set(key, value);
  });

  return newResponse;
};

export { handler as GET, handler as POST, handler as OPTIONS };

8 replies

DTDrizzle Team

•Created by niko on 10/21/2024 in #help

I deleted table generate went well but on migration it makes error that table doesnt exist

I deleted one table called stripe_keys i made drizzle-kit-generate went well not errors but after migrating i get error that table does not exist what should I do?

4 replies

TTCTheo's Typesafe Cult

•Created by niko on 3/13/2024 in #questions

Does anyone know any light weight charts library

I'm currently using tremor for charts but its so huge asf, when I build its 269kB and if I remove component it becomes 150kB, anyways tremor is big ass library which kills my bundle size, so I was wondering if there is any better alternatives for it

3 replies

TTCTheo's Typesafe Cult

•Created by niko on 2/27/2024 in #questions

Best practice for counting streams

Im building podcast app and I've question what is the best solution for counting streams? in postgres database should I just save array of people who streamed?

{
 userId: String,
 streamedAt: Date
}

{
 userId: String,
 streamedAt: Date
}

that comes in my mind as solution and is there any better way? (also that content must has analytics, dashboard and etc)

7 replies

Gaming

Programming