# .localhost 도메인으로 웹앱 주소 간소화하기

> Clean Markdown view of GeekNews topic #20282. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=20282](https://news.hada.io/topic?id=20282)
- GeekNews Markdown: [https://news.hada.io/topic/20282.md](https://news.hada.io/topic/20282.md)
- Type: GN+
- Author: [xguru](https://news.hada.io/@xguru)
- Published: 2025-04-12T07:16:43+09:00
- Updated: 2025-04-12T07:16:43+09:00
- Original source: [inclouds.space](https://inclouds.space/localhost-domains)
- Points: 17
- Comments: 2

## Summary

개발 중인 웹앱에 대해 `localhost:4333` 같은 포트를 기억하지 않고도 `appname.localhost` 같은 **간단한 주소**로 접근할 수 있도록 설정하여 로컬 웹앱 접근이 더 직관적이고 깔끔해집니다. 각 앱은 고유 포트에서 **launchd 데몬**으로 실행되며, `/etc/hosts` 파일에서 **리디렉션**을 설정합니다. **Caddy**를 통해 도메인을 적절한 포트로 프록시 처리하며, 내부 **TLS 인증서**와 압축 지원도 포함됩니다. **dnsmasq**를 사용하여 모든 `*.localhost` 도메인을 `127.0.0.1`로 라우팅하고, **bash 스크립트**를 통해 자동화할 수 있습니다.

## Topic Body

- 개발 중인 웹앱에 대해 `localhost:4333` 같은 포트를 기억하지 않고도, `appname.localhost` 같은 간단한 주소로 접근 가능하도록 설정한 경험 공유  
- 이 시스템을 활용하면 로컬 웹앱 접근이 훨씬 직관적이고 깔끔해짐  
- 각 앱은 고유 포트에서 launchd 데몬으로 실행됨   
- `/etc/hosts` 파일에서 `appname.localhost`를 `127.0.0.1`로 리디렉션함  
  - 예: `127.0.0.1 inclouds.localhost`  
- [Caddy](https://caddyserver.com/docs/)를 통해 해당 도메인을 적절한 포트로 프록시 처리함  
  
#### Caddy 설정 예시  
  
  ```caddyfile  
    inclouds.localhost {  
      reverse_proxy localhost:5050  
      tls internal  
      encode gzip zstd  
    }  
  ```  
- `.localhost` 도메인마다 Caddyfile에 해당 포트로의 프록시 설정 작성  
- 내부 TLS 인증서와 압축 지원도 포함됨  
  
### 향후 개선 아이디어  
  
- 현재는 세 가지 파일(`/etc/hosts`, Caddyfile, launchd plist)을 수동으로 편집해야 함  
- 향후 단일 명령으로 앱을 `.localhost` 도메인에 설치/삭제하는 자동화 도구를 만드는 것이 목표임  
  
### 업데이트  
  
- [Cristóbal](https://bsky.app/profile/arquipelago.org)이 [dnsmasq](https://github.com/tobyshooters/localhost) 기반의 명령어를 제안해 이 과정을 더 간편하게 만듦  
- 핵심 아이디어는 다음과 같음:  
  1. `*.localhost`를 모두 `127.0.0.1`로 리디렉션함  
  2. `127.0.0.1`에서 특정 포트로 리버스 프록시를 수행하는 서버 설정함  
  
### dnsmasq로 리다이렉션 설정하기  
- 모든 `*.localhost` 도메인을 `127.0.0.1`로 라우팅하기 위해 `dnsmasq` 사용  
- 설치 후 설정:  
  ```bash  
  echo 'port=5353' | sudo tee -a /etc/dnsmasq.conf  
  echo 'address=/localhost/127.0.0.1' | sudo tee -a /etc/dnsmasq.conf  
  sudo systemctl restart dnsmasq  
  ```  
- `dnsmasq` 포트를 `5353`으로 설정하여 `systemd-resolved`와 충돌 방지  
- `/etc/resolv.conf` 맨 위에 다음을 추가해 기본 DNS 리졸버를 `dnsmasq`로 설정:  
  ```bash  
  nameserver 127.0.0.1  
  ```  
  
### Caddy 및 localhost 스크립트로 리버스 프록시 설정하기  
- 이제 `caddy` 서버를 활용해 각 서브도메인을 특정 포트로 연결 가능  
- 수동으로 Caddyfile을 편집할 수도 있지만, bash 스크립트(`localhost`)를 만들어서 자동화 가능  
- 이 bash 스크립트(`localhost`)를 PATH에 추가 (예시로 `.zshrc` 파일에 추가):  
  ```bash  
  export PATH="$PATH:$HOME/dev/localhost"  
  ```  
- 다음과 같이 사용할 수 있음:  
  ```bash  
  localhost add hello 8000  
  localhost remove hello  
  ```  
### 실제 동작 테스트  
  
- 로컬 서버 실행 예시:  
  ```bash  
  echo 'hello.localhost!' > index.html  
  python3 -m http.server 1234  
  ```  
- 도메인 연결 설정:  
  ```bash  
  localhost add hello 1234  
  ```  
- 이제 브라우저에서 `hello.localhost` 로 접속하면 위 서버의 내용이 표시됨

## Comments



### Comment 37076

- Author: dudlf016
- Created: 2025-04-12T20:32:47+09:00
- Points: 2

저는 외부망 접근 못하는거 아니면 [NIP.IO](https://nip.io/) 같은 Wildcard DNS 쓸래요.

### Comment 37060

- Author: neo
- Created: 2025-04-12T07:16:43+09:00
- Points: 1

###### [Hacker News 의견](https://news.ycombinator.com/item?id=43644043) 
- 브라우저는 .localhost 도메인에 대해 보안 컨텍스트를 제공함
  - HTTPS를 위한 자체 서명 인증서가 필요하지 않음
  - 백엔드 API와 프론트엔드 SPA가 동시에 실행될 때 유용함
  - 최근 승인된 .internal 도메인을 사용할 수 있음

- nginx 로컬 개발 설정 스니펫은 간단함
  - 유닉스 도메인 소켓을 통해 로컬 개발 서버와 연결됨
  - 호스트 이름 해상도를 추가해야 하지만, 구성 파일을 프로그래밍적으로 편집하거나 프록시를 재시작할 필요는 없음

- Chrome과 Firefox는 기본적으로 모든 <name>.localhost 도메인을 localhost로 해석함
  - Docker 프록시를 설정하여 모든 요청을 자동으로 처리할 수 있음

- Localias 프로젝트는 로컬 웹 개발에 유용함
  - Caddy 기반으로 구축되어 있으며, CLI와 구성 파일 형식이 편리함
  - .local 도메인 별칭을 네트워크의 다른 장치에서 사용할 수 있게 함
  - /etc/hosts 파일을 수동으로 편집할 필요가 없음

- .localhost의 하위 도메인은 Linux, OpenBSD 등에서 기본적으로 작동함
  - macOS에서는 /etc/hosts에 하위 도메인을 명시적으로 추가해야 함

- Caddy를 사용하는 경우, 구매한 도메인과 DNS-01 챌린지를 사용하는 것이 좋음
  - 자체 서명 인증서를 신뢰 저장소에 추가할 필요가 없음
  - Caddy가 인증서를 자동으로 갱신함

- 개인 네트워크에서 Vanity 도메인을 사용하는 사람도 있음
  - Smallstep CA, CoreDNS, Traefik을 사용하여 SSL 인증서를 자동으로 발급받음
  - 내부 네트워크 설정에 internal. zone을 사용하는 것이 좋음

- 각 로컬 호스팅 앱에 별도의 IP 주소를 부여할 수 있음
  - 127.0.0/24 범위의 IP 주소를 사용 가능함
  - macOS에서도 작동하지만, 루프백 인터페이스에 명시적으로 추가해야 할 수도 있음

- Linux 시스템에서는 systemd-resolved를 통해 기본적으로 작동함
  - CSRF를 역방향 프록시로 차단할 수 있는 이점이 있음