Software on Kaisekukun

Setting Up a Local Dev Environment with Docker

Sun, 21 Jun 2026 11:00:00 +0900

“It works on my machine” is a phrase every developer knows all too well. Docker solves this by packaging your application and its dependencies into portable containers. This article walks through setting up a local development environment with Docker.

The Three Core Concepts

Dockerfile: A blueprint for your container — which base image to use and what to install.
docker-compose.yml: A configuration file for managing multiple containers (web server, database, cache, etc.) together.
Volume mount: Lets the container reference files on your host machine. Essential for hot reload.

Multi-Service Setup with docker-compose

A typical frontend + backend + database setup can be defined in a single docker-compose.yml:

Maximize Coding Efficiency: Recommended Lightweight Code Editors and Customization

Thu, 18 Jun 2026 12:40:00 +0900

In modern software development, the comfort of your workspace directly impacts your productivity. While feature-rich Integrated Development Environments (IDEs) are highly convenient, their slow startup times and heavy memory consumption can often be frustrating. This is why many developers are turning to “lightweight code editors”—tools that run incredibly fast while offering the flexibility to add features as needed.

VS Code Shortcuts to Supercharge Your Productivity

Tue, 26 May 2026 11:00:00 +0900

VS Code is highly customizable, but simply learning its built-in keyboard shortcuts can dramatically speed up your daily coding. This article covers the most essential shortcuts and how to customize them to your liking.

Must-Know Basics

Mastering these shortcuts will drastically reduce the number of times you reach for your mouse:

Action	Windows / Linux	macOS
Command Palette	`Ctrl+Shift+P`	`Cmd+Shift+P`
Quick File Search	`Ctrl+P`	`Cmd+P`
Toggle Sidebar	`Ctrl+B`	`Cmd+B`
Split Editor	`Ctrl+\`	`Cmd+\`
Toggle Terminal	Ctrl+`	Ctrl+`

Start with the Command Palette

Ctrl+Shift+P (or Cmd+Shift+P on macOS) opens the Command Palette, the gateway to every VS Code feature. You can save files, run formatters, install extensions, and more without ever touching the mouse. Learn this one first.

A Quick Overview of New TypeScript Features

Sun, 01 Feb 2026 11:00:00 +0900

The TypeScript 5.x series has introduced many features that strengthen the type system and improve the developer experience. This article highlights the ones most useful in everyday coding.

Const Type Parameters (5.0)

Adding a const modifier to a function’s type parameter preserves literal types when passing values through.

function getConfig<T extends readonly string[]>(keys: T): T {
 return keys
}

// Before: inferred as string[]
const config1 = getConfig(['dev', 'staging', 'prod'])

// With const type parameter: inferred as a tuple of literals
const config2 = getConfig<const>(['dev', 'staging', 'prod'])
// type: readonly ["dev", "staging", "prod"]

This is handy when you want object properties to keep their literal types. No need to write as const at the call site — the code stays clean.

Getting Started with CI/CD Using GitHub Actions

Tue, 06 Jan 2026 11:00:00 +0900

If “CI/CD” sounds like something you should know but don’t know where to start, this guide is for you. GitHub Actions makes continuous integration and delivery accessible to everyone with a GitHub repository.

What is GitHub Actions?

GitHub Actions is a CI/CD platform built directly into GitHub. It lets you automate testing, building, and deploying right from your repository. Workflows trigger on pushes, pull requests, or scheduled events.

1. Workflow Basics

Place a YAML file inside .github/workflows/ to define your workflow.

Next.js App Router Basics and Migration Tips

Sat, 03 Jan 2026 11:00:00 +0900

Introduced in Next.js 13, the App Router takes a fundamentally different approach to routing and rendering compared to the traditional Pages Router. Now stable and widely adopted, let’s break down the basics for those planning to migrate.

App Router vs Pages Router

Feature	Pages Router	App Router
Routing	Under `pages/`	Under `app/`
Components	Client Component by default	Server Component by default
Layouts	Manual implementation	Nestable `layout.js`
Loading	Manual implementation	Automatic via `loading.js`
Data Fetching	`getServerSideProps`, etc.	Direct `async` inside components

1. File-Based Routing

Folder structure inside app/ maps directly to URL paths.