Posts

All Practice Series

Image
Introduction This is a comprehensive page about the technologies I have shared in series format. You can view brief introductions and links to directly access each series you are interested in. In the field of software development, to deploy a product from the initial idea to its release, the standard process typically involves several stages as follows: Database : Designing and implementing the database according to business requirements, storing data during the system's operation. Backend : Handling the main logic of the system, communicating with the database and services. Frontend : Building the interface for users to interact with the system, which could be a desktop, mobile, or web application. This usually includes implementing UI/UX and integrating APIs from the backend. DevOps : Deploying the system for use, which can be done on a server or in the cloud. Testing : Applying testing methods to ensure the product meets the standards for release. Of course, these are just stan...
Post a Comment
Read more

Seeding bulk records with Snaplet Seed and PostgreSQL

Image
Introduction In the previous article, I provided a basic guide on how to use @snaplet/seed to seed data quickly. In this article, I will show you how to generate a large amount of data in a short time, approximately 1,000,000 records, which is useful when you need to perform performance testing. You can apply a similar approach to larger datasets like several million records, using a streaming mechanism to avoid Out of Memory (OOM) errors caused by allocating too much memory at once and overloading the system. I will explain two different approaches here: Coding: chunking data and writing each small part to the database Database: creating a CSV file and using a command to copy that data directly into PostgreSQL Prerequisites You need to set up Prisma, PostgreSQL and @snaplet/seed before continuing, you can check out the previous articles for instructions. Detail First, let us create the file prisma/seed/seed.ts import {faker} from '@faker-js/faker' import {createSeedClient}...
Post a Comment
Read more

API Security with NextJS Rewrites and Proxy

Image
Introduction NextJS Proxy and Rewrites are a powerful duo that helps manage and route requests flexibly. NextJS Rewrites act as an internal proxy, essentially mapping one URL path to another. Its biggest advantage is hiding the actual URL of the underlying core server, while transforming requests from Cross-Origin to Same-Origin on the client interface. NextJS Proxy  allows you to execute code before a request is completed. As a result, you can easily intervene to implement features like Authentication, authorization, or centralized Rate Limiting, reducing the load on the core API server and maximizing performance. Previously, this function was called middleware, the name change to Proxy aims to confirm that this is an ultra-lightweight Gateway layer: It should only be used for tasks such as Routing, Rewrite, Redirect and managing Header/Cookie. NextJS encourages moving Granular Authorization logic or complex session management into Server Components or Server Actions to take...
Post a Comment
Read more

Using Server Actions in NextJS

Image
Introduction NextJS Server Actions is a powerful feature that allows you to perform data mutations directly on the server without needing to manually create API Routes, with key benefits including: Tight Integration with Forms: Works seamlessly with the HTML form action attribute. Progressive Enhancement: The application can still perform basic functions even if JavaScript is not fully loaded or is disabled. Security: Automatically protects against CSRF attacks and keeps sensitive processing logic on the server. Simplified Code: Reduces boilerplate code when connecting Client and Server. Detail First, let's create the app/todo/schema.ts file to define the types and validate data using Zod. import {z} from 'zod' export const TodoSchema = z. object ({ id : z. string (). optional (). nullable (), title : z. string (). min ( 1 , 'Title is required' ). max ( 100 ), }) export type Todo = z. infer < typeof TodoSchema > export type ActionState...
Post a Comment
Read more