<div id="readability-page-1" class="page"><div>
					<p><a href="https://blog.outsider.ne.kr/1565">GitHub Codespaces</a>를 사용하면 쉽게 프로젝트에 맞는 환경을 웹이나 로컬의 VS Code로 실행해서 개발할 수 있다. 프로젝트 개발환경의 필요한 설정은 프로젝트의 Codespaces 설정으로 할 수 있지만 실제로 개발하려고 보면 개인에게 최적화된 환경이 필요하다.</p>

<p>특히 터미널을 많이 사용하는 경우는 로컬에 사용해서 하던 환경을 Codespaces에서도 사용하고 싶어진다. 간단하게는 터미널의 다양한 명령어의 <code>alias</code>나 자동완성 등의 편의 기능도 있고 익숙하게 사용하는 도구도 있을 수 있다. Codepsace의 프로젝트 설정이 공통된 설정이라면 개인화된 설정을 <code>dotfiles</code>를 통해서 지원하고 있다.</p>

<h2><code>dotfiles</code> 저장소</h2>

<p><code>dotfiles</code>는 GitHub Codespaces에서 내가 필요한 설정을 할 수 있게 하는 저장소이다. 나만 쓰는 설정 같은 것을 여기에서 설정하면 된다.</p>

<p>원래는 자신의 계정의 <code>dotfiles</code>라는 저장소를 이용해서 설정해야 했지만 12월부터는 원하는 저장소를 지정해서 설정할 수 있게 되었다. <code>dotfiles</code>라는 이름을 다른 용도로 쓸 수도 있으므로 원하는 저장소를 지정할 수 있는 기능은 아주 좋은 기능이다.</p>

<p><img src="https://blog.outsider.ne.kr/attach/1/6413337612.gif" width="750" height="179" alt="GitHub 설정에서 dotfiles 저장소 설정 메뉴" title="" data-pagespeed-url-hash="2043508909" data-pagespeed-onload="pagespeed.CriticalImages.checkImageForCriticality(this);" onload="var elem=this;if (this==window) elem=document.body;elem.setAttribute('data-pagespeed-loaded', 1)"></p>



<h2><code>dotfiles</code> 설정</h2>

<p>Codespaces를 생성할 때 <code>dotfiles</code> 저장소를 이용해서 환경의 초기화를 시도하는데 <a href="https://docs.github.com/en/codespaces/customizing-your-codespace/personalizing-codespaces-for-your-account#dotfiles">문서</a>에 따르면 아래의 파일을 실행하려고 시도한다.</p>

<ul>
<li><code>install.sh</code></li>
<li><code>install</code></li>
<li><code>bootstrap.sh</code></li>
<li><code>bootstrap</code></li>
<li><code>script/bootstrap</code></li>
<li><code>setup.sh</code></li>
<li><code>setup</code></li>
<li><code>script/setup</code></li>
</ul>

<p>위 파일이 하나도 없다면 <code>dotfiles</code> 저장소에서 <code>.</code> 시작하는 파일과 폴더를 홈 디렉터리(<code>$HOME</code>)에 심볼릭 링크로 연결한다. 즉, <code>.bashrc</code> 같은 파일을 자동으로 추가해서 사용할 수 있다는 의미이다.</p>

<p>저장소를 만들고 이 저장소를 코드스페이스의 <code>dotfiles</code> 저장소로 설정한 뒤 아래처럼 <code>.zshrc</code> 파일을 만들어서 커밋 후 푸시해보자.</p>

<pre><code>export MY_NAME=outsider
</code></pre>

<p>코드스페이스를 생성해서 확인해 보면 이 <code>.zshrc</code>가 추가된 것을 볼 수 있고 여기서 설정한 환경변수도 동작하는 것을 알 수 있다.</p>

<pre><code>codespaces_612333% ls -la | grep .zshrc
lrwxrwxrwx  1 codespace codespace    55 Dec 20 19:02 .zshrc -&gt; /workspaces/.codespaces/.persistedshare/dotfiles/.zshrc

codespaces_612333% echo $MY_NAME
outsider
</code></pre>

<p>간단하게 사용할 때는 <code>.</code>로 시작하는 파일/폴더의 추가로도 설정할 수 있지만 보통 개인 개발환경 설정에는 다양한 것이 있으므로 앞에서 언급한 초기화 스크립트를 이용하는 게 더 편하다. 여기서 <code>.zshrc</code>를 추가했는데 기본으로 생기는 <code>.zshrc</code> 파일(zsh를 기본으로 사용하고 있다)을 덮어쓴다는 것도 문제이므로 기본 쉘 환경은 이용한 채 추가로 필요한 부분을 설정하는 것이 더 좋아 보인다. 나는 <code>bootstrap.sh</code> 파일을 사용하고 있다.</p>

<p>처음 설정하거나 테스트할 때 VS Code의 Command Palette에서 Codespaces의 생성 로그를 볼 수 있으므로 설정을 잘못했거나 내용을 확인할 때 유용하다.</p>

<p><img src="https://blog.outsider.ne.kr/attach/1/1962365819.gif" width="750" height="100" alt="VS Code의 Codespaces 생성 로그 보기 메뉴" title="" data-pagespeed-url-hash="1273597239" data-pagespeed-onload="pagespeed.CriticalImages.checkImageForCriticality(this);" onload="var elem=this;if (this==window) elem=document.body;elem.setAttribute('data-pagespeed-loaded', 1)"></p>

<p>긴 로그 중 아래와 같이 dotfiles 관련 로그를 볼 수 있다. <code>Bootstrapping...</code> 부분은 <code>echo</code>로 직접 출력한 부분이므로 값 확인이 필요하다면 직접 출력해서 확인할 수 있다.</p>

<pre><code>$ # Clone &amp; install dotfiles
[2021-12-20T19:10:51.584Z] Cloning into '/workspaces/.codespaces/.persistedshare/dotfiles'...
[2021-12-20T19:10:52.600Z] Executing script /workspaces/.codespaces/.persistedshare/dotfiles/bootstrap.sh
[2021-12-20T19:10:52.601Z] Bootstrapping...
[2021-12-20T19:10:52.691Z] 
[2021-12-20T19:10:52.691Z] 
[2021-12-20T19:10:52.691Z] Stop (1111 ms): Run in container: # Clone &amp; install dotfiles
</code></pre>

<p>개인의 터미널 환경은 각자마다 다르므로 여기서 다 설명하기는 어렵지만 내 <a href="https://github.com/outsideris/dotfiles">dotfiles</a> 저장소에서는 다음과 같은 환경 설정을 하고 있다.</p>

<ul>
<li>git 명령어의 다양한 alias와 GPG 설명 같은 내가 선호하는 설정을 추가한다.</li>
<li>터미널에서 축약어로 사용하는 다양한 별칭을 추가한다.</li>
<li>터미널에서 명령어 자동완성(auto completion) 스크립트를 추가한다.</li>
<li><code>zsh</code>에서 사용하는 <a href="https://blog.outsider.ne.kr/1490">Powerlevel10k 환경</a>을 설정한다.</li>
</ul>

<p>특히 명령어 별칭은 손에 익어서 Codespaces에서 가장 불편한 부분이었는데 <code>dotfiles</code>를 사용하면 이를 해결할 수 있다.</p>

          </div></div>

Outsider's Dev Story

Outsider

GitHub Codespaces를 사용하면 쉽게 프로젝트에 맞는 환경을 웹이나 로컬의 VS Code로 실행해서 개발할 수 있다. 프로젝트 개발환경의 필요한 설정은 프로젝트의 Codespaces 설정으로 할 수 있지만 실제로 개발하려고 보면 개인에게 최적화된 환경이 필요하다.
특히 터미널을 많이 사용하는 경우는 로컬에 사용해서 하던 환경을 Codespaces에서도 사용하고 싶어진다. 간단하게는 터미널의 다양한 명령어의 alias나 자동완성 등의 편의 기능도 있고 익숙하게 사용하는 도구도 있을 수 있다. Codepsace의 프로젝트 설정이 공통된 설정이라면 개인화된 설정을 dotfiles를 통해서 지원하고 있다.
dotfiles 저장소
dotfiles는 GitHub Codespaces에서 내가 필요한 설정을 할 수 있게 하는 저장소이다. 나만 쓰는 설정 같은 것을 여기에서 설정하면 된다.
원래는 자신의 계정의 dotfiles라는 저장소를 이용해서 설정해야 했지만 12월부터는 원하는 저장소를 지정해서 설정할 수 있게 되었다. dotfiles라는 이름을 다른 용도로 쓸 수도 있으므로 원하는 저장소를 지정할 수 있는 기능은 아주 좋은 기능이다.
Settings의 Codespaces 메뉴에서 dotfiles의 활성화 여부와 저장소를 지정할 수 있다. 다른 저장소를 지정할 수도 있지만, 이 글에서는 dotfiles라고 지칭한다.
dotfiles 설정
Codespaces를 생성할 때 dotfiles 저장소를 이용해서 환경의 초기화를 시도하는데 문서에 따르면 아래의 파일을 실행하려고 시도한다.
install.sh
install
bootstrap.sh
bootstrap
script/bootstrap
setup.sh
setup
script/setup
위 파일이 하나도 없다면 dotfiles 저장소에서 . 시작하는 파일과 폴더를 홈 디렉터리($HOME)에 심볼릭 링크로 연결한다. 즉, .bashrc 같은 파일을 자동으로 추가해서 사용할 수 있다는 의미이다.
저장소를 만들고 이 저장소를 코드스페이스의 dotfiles 저장소로 설정한 뒤 아래처럼 .zshrc 파일을 만들어서 커밋 후 푸시해보자.
export MY_NAME=outsider
코드스페이스를 생성해서 확인해 보면 이 .zshrc가 추가된 것을 볼 수 있고 여기서 설정한 환경변수도 동작하는 것을 알 수 있다.
codespaces_612333% ls -la | grep .zshrc
lrwxrwxrwx  1 codespace codespace    55 Dec 20 19:02 .zshrc -> /workspaces/.codespaces/.persistedshare/dotfiles/.zshrc
codespaces_612333% echo $MY_NAME
outsider
간단하게 사용할 때는 .로 시작하는 파일/폴더의 추가로도 설정할 수 있지만 보통 개인 개발환경 설정에는 다양한 것이 있으므로 앞에서 언급한 초기화 스크립트를 이용하는 게 더 편하다. 여기서 .zshrc를 추가했는데 기본으로 생기는 .zshrc 파일(zsh를 기본으로 사용하고 있다)을 덮어쓴다는 것도 문제이므로 기본 쉘 환경은 이용한 채 추가로 필요한 부분을 설정하는 것이 더 좋아 보인다. 나는 bootstrap.sh 파일을 사용하고 있다.
처음 설정하거나 테스트할 때 VS Code의 Command Palette에서 Codespaces의 생성 로그를 볼 수 있으므로 설정을 잘못했거나 내용을 확인할 때 유용하다.
긴 로그 중 아래와 같이 dotfiles 관련 로그를 볼 수 있다. Bootstrapping... 부분은 echo로 직접 출력한 부분이므로 값 확인이 필요하다면 직접 출력해서 확인할 수 있다.
$ # Clone & install dotfiles
[2021-12-20T19:10:51.584Z] Cloning into '/workspaces/.codespaces/.persistedshare/dotfiles'...
[2021-12-20T19:10:52.600Z] Executing script /workspaces/.codespaces/.persistedshare/dotfiles/bootstrap.sh
[2021-12-20T19:10:52.601Z] Bootstrapping...
[2021-12-20T19:10:52.691Z] 
[2021-12-20T19:10:52.691Z] 
[2021-12-20T19:10:52.691Z] Stop (1111 ms): Run in container: # Clone & install dotfiles
개인의 터미널 환경은 각자마다 다르므로 여기서 다 설명하기는 어렵지만 내 dotfiles 저장소에서는 다음과 같은 환경 설정을 하고 있다.
git 명령어의 다양한 alias와 GPG 설명 같은 내가 선호하는 설정을 추가한다.
터미널에서 축약어로 사용하는 다양한 별칭을 추가한다.
터미널에서 명령어 자동완성(auto completion) 스크립트를 추가한다.
zsh에서 사용하는 Powerlevel10k 환경을 설정한다.
특히 명령어 별칭은 손에 익어서 Codespaces에서 가장 불편한 부분이었는데 dotfiles를 사용하면 이를 해결할 수 있다.
댓글 쓰기

GitHub Codespace 환경 개인화하기

댓글