How To Dev

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...

Introduction D3.js (Data-Driven Documents) is a powerful JavaScript library for producing dynamic, interactive data visualizations from numerical data. Instead of providing pre-built charts, D3 offers low-level tools that allow you to manipulate DOM elements directly (typically SVGs, Canvas, or HTML). The advantages: Infinite Customization: You can create any type of chart you can imagine. High Performance: Smoothly handles large data sets and animated transitions. Strong Mathematical Ecosystem: Fully supports scale calculation functions, coordinate axis formatting, and complex geometric algorithms. Detail First, let's start with a simple example of drawing a line chart that describes monthly revenue during the year. Please create the file app/api/revenue/route.ts to simulate a 12-month revenue api with a random amount from 1000-6000 import {NextResponse} from 'next/server' export async function GET () { const data = Array. from ({ length: 12 }, ( _ , i ) => ...

Introduction In the previous article I guided some ways to use NextJS App Router, now we will continue with 2 other features including Parallel Routes: as the name implies you can understand that it allows to define many separate routes and put them together on 1 route for display, the very clear advantage is that it helps to separate UI, isolate errors (if any), easy to maintain and expand functionality Note that if you use this feature and in the main route has define an additional 1 page that is not a Parallel Routes, then in the Parallel Routes should have an additional file to show default information to avoid 404 errors when accessing directly (we will go into more detail in the detail part below) Intercepting Route: Allows "blocking" a route to display that content in another context (for example: a link will display a Modal, but when reloading that page, a separate page will open). Prerequisites This article is continued to be developed from previous articles, please ...