[노마드] 개발자를 위한 터미널 커스터마이즈

터미널 default값은 안 예쁘고 보기 불편하다. 그래서 커스터마이즈를 한다.

 

우선, windows terminal을 실행 -> 설정 -> 시작 tab -> 기본 프로필을 Ubuntu 22.04로 바꾼다.

그리고 왼쪽 하단에 "Json 파일 열기"를 눌러 vscode를 실행한다.

 

만약에 vscode가 열렸을 때 팝업이 뜬다면 설치해 주도록 한다.

The 'Remote - WSL' extension is recommended as you have Windows Linux Subsystem (WSL) installed on your system.

이 설치는 WSL을 vscode 내에서 사용할 수 있도록 도와준다.

리눅스 환경이랑 상호작용을 할 수 있다.

직접 코드를 수정해서 default를 정해줄 수 있는데 설정에서 쉽게 변경할 수도 있다.

 

구글에 oh my zsh 검색

https://github.com/ohmyzsh/ohmyzsh

GitHub - ohmyzsh/ohmyzsh: 🙃 A delightful community-driven (with 2,200+ contributors) framework for managing your zsh config

 

installing ZSH 클릭

Windows 10 WSL이니 위 명령어 복사하기

apt install zsh

 

우분투에서는 설치하는 법이 윈도우나 맥은 다르다.

zsh 설치를 하려고 하면 다음과 같은 오류가 뜬다.

-> admin 유저가 아니라서 뜨는 에러이다.

 

우리는 honeygyu라는 유저를 만들어 줬다. 리눅스에는 크게 두 가지 유저 타입이 있는데

하나는 일반 유저(honeygyu)고, 다른 하나는 super admin이다.

super admin을 root라고 부르는데

root 유저는 파일 시스템을 바꾸거나, 기타 등등 좀 안전하지 않은 작업을 하는 권한을 가지고 있다.

기본값으로 우리는 root를 쓰지 않고 일반 유저 honeygyu를 쓰는데 root를 쓰고 싶다면, sudo를 써줘야 한다.

sudo apt install zsh

 

zsh를 설치했고 이제 oh my zsh를 설치한다.

sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

https://ohmyz.sh/#install

Oh My Zsh - a delightful & open source framework for Zsh

 

code

code를 하면 우분투에서 vscode를 설치한다.

설치가 완료되면 이제 code [제목].[언어]로 vscode를 실행할 수 있게 된다.

---

터미널 색상 변경

우분투를 켜서 설정에 json 파일 열기 클릭

vscode의 settings.json이 실행되면 Schemes가 있고 들어갈 수 있는 링크가 있다.

https://aka.ms/terminal-color-schemes 

Windows 터미널 색 구성표

윈도우 터미널에서 색깔을 바꾸는 것을 알려주는 사이트다.

json의 우분투 위치에

"colorScheme": "Campbell"

또는 사이트 속 다른 스킨 명을 넣으면 적용이 된다.

 

그런데 만족스러운 색깔이나 종류가 적기 때문에 다른 사이트를 활용한다.

https://terminalsplash.com/

>_TerminalSplash - Windows Terminal Themes

원하는 커스터마이즈를 선택해 코드를 복사한다.

schemes" : [] 사이에 붙여넣기 한다.

그러나 제대로 되지 않는듯 하다. 아마 터미널의 색깔 그리고 모든 다른 도구들의 환경설정 옵션이 제한되어 있기 때문이다.

 

powerlevel10k는 우리가 설치한 터미널인 zsh를 위한 테마다.

https://github.com/romkatv/powerlevel10k

GitHub - romkatv/powerlevel10k: A Zsh theme

install Powerlevel10k 클릭

oh my zsh 클릭

명령어 복사를 해서 우분투에 붙여넣고 실행한다.

git clone --depth=1 https://github.com/romkatv/powerlevel10k.git ${ZSH_CUSTOM:-$HOME/.oh-my-zsh/custom}/themes/powerlevel10k

이걸 작동시키기 위해서 .zshrc 파일을 수정해야 한다.

이 파일은 root 경로에 생성되어 있다.

 

루트를 의미하는 캐릭터 "~" 그리고 "/" 그리고 파일명

code ~/.zshrc

vscode가 열리면 환경설정 옵션들을 볼 수 있다.

여기 있는 환경설정은 Windows Terminal을 위한게 아니라 oh my zsh를 위한 것이다.

위 사진 2번의 테마를 복사해 vscode에 붙여 넣는다.

ZSH_THEME="powerlevel10k/powerlevel10k"

 

저장하고 우분투를 재시작하면 powerlevel10k 설정 마법사가 뜬다.

필자는 이전에 이걸 설정해서 바로 화면 속 그림이 다이아몬드로 보이는데 아마 폰트가 없다면 깨져보일 것이다.

 

폰트 설치

setting.json에 가서 사용하는 폰트를 적어줄 것이다.

그리고 vscode도 터미널 폰트와 동일하게 세팅해준다.

vscode에서 설정 -> integrated:font family를 검색 -> MesloLGS NF를 붙여 넣는다.

그러면 이제 다이아몬드가 보일 것이다. 다른 그림들도 보인다면 y를 누른다.

 

프롬프트 스타일을 선택할 수 있다.

3번 클릭

 

유니코드는 끝에 화살표가 있고 / 아스키코드는 없다.

1번 클릭

 

현재 시간을 설정할 수 있다  시간 x / 24시간 / 12시간

2번 클릭

 

세퍼레이터를 고르는건데 각진형 / 세로줄 / 슬래시 형 / 둥근 형이 있다.

4번 클릭

 

프롬프트 머리를 고를 수 있는데 날카로움 / 희미함 / 기울어짐 /둥근 모양이 있다.

2번 클릭

 

프롬프트 꼬리를 선택할 수 있는데 직각 / 흐림처리 / 날카로움 / 기울어짐 / 둥근 모양이 있다.

4번 클릭

프롬프트 높이는 한 줄 / 두 줄로 할 수 있다.

2번 클릭

 

프롬프트 연결을 고를 수 있는데 없기 / 도트 / 선이 있다.

3번 클릭

 

프롬프트 프레임을 고를 수 있는데 없기 / 왼쪽 / 오른쪽 / 둘다가 있다.

3번 선택

 

연결 & 프레임 색을 고를 수 있는데 가장 밝게 / 밝게 / 어둡게 / 가장 업두게가 있다.

4번 클릭

 

프롬프트 공간을 고를 수 있는데 촘촘하게 / 여유있게를 고를 수 있다.

2번 클릭

 

아이콘을 선택할 수 있는데 적게 / 많게 고를 수 있다.

2번 클릭

 

프롬프트 간결하게 / 자세하게 선택할 수 있다.

 

transient 프롬프트를 사용할 것인가

n 클릭

 

Instant 프롬프트 모드는 1번인 Verbose를 고를거다.

왜냐하면 Instant Prompt Mode를 시도해본 적이 없거나, 경고를 본 적이 없거나, 이 모든 것이 무엇을 의미하는지 모를 경우 Verbose를 클릭하라고 한다.

 

~/.zshrc를 바꾸는 것에 동의하는가?

y 클릭

 

이제 쉘이 커스터마이즈 된 것을 볼 수 있다.

---

색상별로 숫자가 있는데 처음에는 여러 개 바꿔보면서 유추를 했다.

40 ??

41이 stdio나 숫자, " ", 등이 빨간색

42가 함수?

43이 while return

44가 주석

45가 #이나 ' ' % 등

46, 47이 일반 함수 입력

 

필자는 마음에 드는 색상의 커스터마이즈가 없어서 아무꺼나 받아온 뒤 직접 색을 바꾸면서 만들었다.

    {
      "name": "Laser",
      "black": "#000000", // 프롬프트
      "red": "#ff00e6", // 숫자 "" <헤더파일>
      "green": "#fff200", // 함수
      "yellow": "#bd09bd",
      "blue": "#ff0000", // 주석
      "purple": "#0059ff", // # % ' ' 등등
      "cyan": "#d1d1fe",
      "white": "#ffea00", // 프롬프트 머리, 꼬리 색상
      "brightBlack": "#8f8f8f",
      "brightRed": "#d4beff",
      "brightGreen": "#ff0000", // init 색상
      "brightYellow": "#ddd5ff",
      "brightBlue": "#00ff26", // 기본 터미널 글자 색상
      "brightPurple": "#ffb2fe",
      "brightCyan": "#e5ff00", // root 부분 bin lib sbin 등등
      "brightWhite": "#ffffff",
      "background": "#000000", // 배경 화면
      "foreground": "#ffffff" // 흰색 글자
    }

 

---

vscode도 잘 적용되었는지 확인해 본다.

vscdoe -> 설정(view) -> 명령 팔래트(Command Palette) 또는 터미널(terminal) -> 새 터미널(new terminal)

 

---

vscode 터미널 wsl로 바꾸기

 

디폴트로 powershell이 되어있는데 이를 wsl로 바꿔보자.

vscode -> 설정 -> integrated terminal을 검색하면

terminal.integrated.Profiles(shell).windows가 있고 setting.json을 클릭한다.

필자는 Default Profile을을 직접 고를 수 있었다.

 

setting.json에 들어가서 직접 수정

"terminal.integrated.shell.windows": "C:\\Windows\\System32\\wsl.exe"

 

터미널 색상 바꾸기

터미널의 색을 바꾸려면 터미널 설정파일을 수정해야 한다.

code ~/.zshrc

vscode 내부에 터미널을 색을 바꾸고 싶다면, vscode 테마를 바꾸면 된다.

 

만약 다시 powerlevel10k 환경 설정을 하고 싶다면

p10k configure