Nginx 작동시키기

지난 주에 모든 정적 사이트에 대해 단일 nginx 컨테이너를 공유하는 것에 대한 issue에 필요한 작업을 마침내 완료했습니다.
docusaurus와 test-web-content를 separate PRs의 src/web로 옮긴 다음 Nginx 구성 및 Dockerfile 작업을 시작했습니다.

나는 원래 Telescope 앱과 Docusaurus 앱을 두 개의 다른 포트에 넣는 Nginx 구성으로 PR을 게시했지만 검토 과정에서 모든 것을 포트 8000에 유지하고 Docusaurus를 /docs에 두라는 지시를 받았습니다. 더 많은 의미.

계속해서 403 오류 메시지가 표시되면서 Docusaurus 앱을 표시하는 데localhost:8000/docs 한동안 멈췄습니다. 결국 Josue의 도움으로 구성 작업을 수행할 수 있었습니다.

도커파일

Dockerfile은 여러 레이어로 나뉩니다. 기본으로 node:16로 시작한 다음 별도의 계층을 거쳐 종속성을 설치하고 앱을 빌드합니다. 각 레이어는 Telescope 앱 또는 Docusaurus 앱에 따라 다르므로 하나에 변경 사항이 있는 경우 모든 것을 처음부터 다시 빌드할 필요가 없습니다.

마지막 레이어는 Nginx 알파인 이미지(알파인 이미지는 크기가 훨씬 작은 것으로 유명함)를 사용하고 내부에서 다음과 같이 이전 레이어의 빌드를 복사합니다.

FROM nginx:1.20.2-alpine as deploy

WORKDIR /

COPY --from=build-app /app/out /var/www/data

COPY --from=build-docs /docs/build /usr/share/nginx/html/docs

Nginx 구성

Nginx의 경우 config template에 다음을 추가해야 했습니다.

location /docs {
    root /usr/share/nginx/html;
}

docusaurus.config.js의 baseUrl을 /docs/로 변경합니다.

아직 Docker를 처음 사용하기 때문에 이 모든 작업을 수행하는 데 예상보다 오래 걸렸지만 작동하는 것을 보는 것은 매우 보람이 있었습니다. 이 PR이 곧 병합될 수 있기를 바랍니다.


마지막으로 Docusaurus 앱의 프로덕션 출시가 가까워졌기 때문에 이PR로 끊어진 링크를 모두 수정할 기회도 가졌습니다.