JS be fun!

Now I'm learning how to make REST API in Next.js It turns out that you have to create route.js/.ts file somewhere in your app folder (even in some deep folder). So it's somewhat like page.jsx/.tsx. In this file you have to export functions that are called same as HTTP method. So if you want to handle POST method, you have to export POST function. And it's pretty easy e.g. import { NextResponse } from 'next/server'; export async function POST(request) { const d = await request.json(); return NextResponse.json({ok: true, d}); } first I coded something like that: const d = await request.json(); return NextResponse.json({ok: true, d: await request.json()}); but this generated error - error TypeError: disturbed at NextRequest.blob (node:internal/deps/undici/undici:1795:21) at NextRequest.text (node:internal/deps/undici/undici:1813:33) at NextRequest.json (node:internal/deps/undici/undici:1817:38) It turns out that you shou

I'm thinking about writing an ebook about developing apps in Next.js. I don't know exactly, how it will look like, but my (subject to change) plan of such e-book: basic concepts of Next.js, React, SPA, SSR, SSG app router vs. pages router (we'll be using app router) React server components hello world in Next.js creating pages static ones dynamic ones hyperlinks images data fetching caching creating REST api middleware authentication connecting various parts of app configuration going to production Somebody could ask - why ebook if Next.js has its own documentation? Well, I got feeling that Next.js documentation is good when explaining general concepts like SSR, but it somewhat lacking of showing some practical know-how of "how to build apps". So basically idea is to create e-book that would explain some things and you could learn from it how to build who

Learning about sending/receiving HTML forms. I rarely write forms nowadays but it's useful skill to have. Express side Created simple Express application, how could I receive form fields in it? Well, it's not straightforward, I had to use body parser const express = require('express') const bodyParser = require('body-parser') const app = express(); app.use(express.json()) app.use(bodyParser.json()) app.use(bodyParser.urlencoded({extended: true})); app.post('/', (req, res) => { console.log(req.body); res.send('OKEJ!') }); //... Which always seemed strange for me. Few years ago I used Express and I thought maybe in 2023 this could be more simple. I mean, ofc it's few lines of code on beginning of project, but still. Too low level. I kind of expect that such basic thing would work outof the box. HTML side Right now I'm sending this form via HTML but what if I wanted to send via fetch? Well I had problem with sendin

I'm learning how to create middleware in Next.js app router. https://nextjs.org/docs/app/building-your-application/routing/middleware There's one middleware per project which was WTF for me, but they write that you could put some ifs in your codebase: https://nextjs.org/docs/app/building-your-application/routing/middleware#conditional-statements so maybe it's not a limitation after all. First I used NextResponse.redirect but this changed my URL so I used NextResponse.rewrite so I am returning some content but URL stays the same I haven't play with cookies or headers yet And authentication - big thing to know. Besides I wonder where to put data fetching in my SSG app. I'm making something that read some files on disk and I don't want to fetch same JSON file over and over. I thought maybe I could read data in middleware and pass to views but I think this is not really how you should do it in Next.js (well, there's possibility to pass data to routes