reactjs - Is het veilig om client- en servercode te mengen in NextJS?

Geniet van het gebruik van NextJs vanwege het vermogen om eenvoudig client- en servercode in hetzelfde framework te beheren.

Het is duidelijk dat ik weet dat NextJS de code scheidt die het weet te scheiden (bijv. getServerSideProps), maar is het veilig om client- en servervariabelen/-hulpmiddelen in hetzelfde bestand te hebben?

Bijvoorbeeld, stel dat ik een bestand heb genaamd constants.ts dat ergens in de codebase staat. Als dat bestand zoiets bevat als:

Lees verder →

javascript - Hoe kan ik een gebruiker doorsturen als ze geen sessie hebben met NextJs13, NextAuth en de t3 stack?

Ik heb mijn project opgestart met de t3-stack die NextAuth en tRPC bevat. Wanneer de gebruiker niet is ingelogd, wil ik hen doorverwijzen naar de startpagina of de inlogpagina. Het lijkt erop dat tRPC niet is gemaakt om redirects terug te geven. Gezien de t

Lees verder →

node.js - Gebruik NextApiResponse-hulp in NextJs 13.2 Route Handlers (app/route)

Voorheen in de pages/api methode zag de handler eruit als handler(req: NextApiRequest, res: NextApiResponse). In NextJs 13.2 hebben ze Route Handlers geïntroduceerd in de app/api/route en de handler voor een POST-verzoek ziet eruit als POST(req: NextRequest): NextResponse.

Nou, ik kwam deze beperking tegen bij het opnieuw valideren voor on-demand ISR. Dit is wat ik heb:

export default async function handler(req: NextApiRe

Lees verder →

reactjs - React/NextJS: Gedupliceerd Audiogolf-element

Ik ben een messenger-applicatie aan het bouwen in NextJS met een TTS-functionaliteit. Om de golfvorm van de afgespeelde audio te visualiseren, gebruik ik een derde-partij bibliotheek genaamd wavesurfer.js

Hoewel de implementatie en het afspelen van audio goed werken, genereert mijn huidige aanpak twee <wave>-elementen, waarvan er slechts één technisch functioneert, wat de UI-indeling verstoort.

Lees verder →

reactjs - Hoe een geneste lijst te implementeren met @portabletext/react npm in nextjs met sanity.io

Ik blijf hangen wanneer ik een genestelde lijst wil implementeren met het @portabletext/react-pakket in Next.js. Ik moet mijn lijst laten zien (in dit geval met een opsommingstekenslijst) onder verschillende voorwaarden. In de normale situatie moet het de eerste afbeelding zijn. En in de andere situatie moet het de tweede afbeelding zijn. En voor mijn code van de Rich Text-component volgt hieronder.

import Image from 'next/image

Lees verder →

typescript - Een ts-loader aangepaste transformer gebruiken met NextJS

Ik ben verliefd geworden op de ts-runtime-checks bibliotheek en wil deze in mijn NextJS-project opnemen: het probleem is dat het een code-transformatie is (wijzigt hoe code wordt gecompileerd) en moet worden uitgevoerd voordat de hoofd-Typescript-compilatie plaatsvindt. Is er een manier om deze plugin netjes in de NextJS-compilatie te koppelen?

Deze bibliotheek heeft een goede, gemakkelijke installatie als men ts-loader gebruikt voor compilatie. Dit is, vol

Lees verder →

typescript - "GetUserByAccountError" bij gebruik van Nextjs 13.4, next-auth ^4.22.1 en @next-auth/prisma-adapter ^1.0.6

Wat veroorzaakt de GetUserByAccountError bij het proberen in te loggen via SocialLogin met Github of Google? Hier is de fout in meer detail:

Unknown arg `provider_providerAccountId` in where.provider_providerAccountId for type AccountWhereUniqueInput. Did you mean `providerId_providerAccountId`? Available args: type AccountWhereUniqueInput { id?: String providerId_providerAccountId?: AccountProviderId_providerAccountIdCompoundUniqueInput } Error: Invalid `pris

Lees verder →

javascript - Hoe genereer je statische pagina's die lokale gegevens lezen in een NextJS 13-toepassing?

Ik heb hun blogtutorial voltooid en het werkt prima. Het maakt dynamische pagina's van .md blogposts die lokaal worden opgeslagen. Prachtig.

Maar ik loop tegen een muur aan terwijl ik probeer een aanpassing te maken die eenvoudig lijkt.

Ik wil zoeken en filteren toevoegen aan de blogposts. Hiervoor moeten we "use client" gebruiken. En de fs-module werkt niet aan de client. Hun documentatie raadt aan om de fetch-API te gebruiken, maar dat werkt niet op lok

Lees verder →

typescript - NextJS - API-route geeft altijd statuscode 200 terug

Redelijk nieuw in Next.js, en ik ben een probleem tegengekomen bij het proberen op te halen van een API. De API zelf is vrij eenvoudig en controleert of er een sessie is (gebruiker is ingelogd) en retourneert vervolgens een JSON met een GET. Dit is het getGoal/route.ts API-bestand:

import { getAuthSessio

Lees verder →

next.js - Saldi ophalen van Binance met NextJS, ccxt en TypeScript

Ik probeer saldi op te halen van Binance in mijn NextJS 13-applicatie, die de /src/app map en TypeScript gebruikt.

async function getData() { const exchange = new ccxt.binance ({ "apiKey": "mykey", "secret": "mysecret&

Lees verder →