본문 바로가기
개발

Mac(M1) 개발환경 세팅하기(feat. FrontEnd)

by 사과넹 2024. 4. 14.
반응형

Homebrew 설치하기

역할

  • MacOS 또는 Linux system의 패키지 매니징을 도와주는 툴
  • Ruby로 이루어진 script
  • homebrew를 가지고 개발환경에 필요한 다양한 패키지들을 다운로드 가능하기 때문에 개발환경을 세팅해야겠다 싶으면 터미널을 통해 첫번째로 설치하자

설치

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
  • 해당 명령어를 입력하고나면 sudo 권한을 요구하며 맥 패스워드를 요구한다.

sudo?
Linux에서 사용되는 명령어로 최고관리자 권한으로 명령어를 실행하는 것이며 Window의 '관리자 권한으로 실행'과 비슷한 기능이라 생각하면 된다.

 

homebrew를 설치하는데 왜 sudo 권한을 요구할까?

  • 이는 homebrew를 설치하고 난 이후, 명령어 실행 시 brew install ~을 할 때 sudo의 권한이 필요하기 때문이다.
  • 그렇기 때문에 homebrew를 설치할 때 최초 1회 sudo의 권한을 요구한다.

이렇게 homebrew에게 sudo 권한을 주고 나면 homebrew가 설치된다.

설치가 끝났다고 해서 brew 명령어를 치면 아래와 같이 brew 명령어를 찾을 수 없다는 경고를 표시한다.

zsh: command not found: brew

 

이는 homebrew install 이후 Next Step을 실행하지 않아서인데, 설치가 끝났다고 바로 끝내려 하지말고 설치 내역을 읽어보는 습관을 가지자.

homebrew는 친절하게 나의 폴더 디렉토리에서 명령어를 실행할 수 있도록 명령어를 2개 제공한다.

==> Next steps:
- Run these two commands in your terminal to add Homebrew to your PATH:

 

제공되는 2개의 명령어를 입력하면 brew 명령어를 사용가능한 상태가 된다.

 

node 설치하기 (feat. brew)

brew가 있으면 이제 node 설치는 식은 죽 먹기다.

brew install node

 

설치 후 버전 확인

node -v

 

NVM 설치하기 (feat. brew)

버전에 예민한 node를 보다 더 잘관리하기 위해 버전 매니저를 설치한다.

brew install nvm

 

nvm만 있으면 이제 node 버전을 다양하게 관리하고 바로바로 사용이 가능하다.

nvm not found error handling

zsh: command not found: nvm

 

nvm 명령어를 사용하려니 해당 에러를 마주했다.

이 에러는 매우 흔한 명령어 경로 에러인데, 무작정 구글링해서 복붙을 하면 생각보다 에러 해결이 쉽지 않다. 하핫. 정확한 경로를 입력해줘야하는데..

1. nvm이 설치된 경로를 확인한다.

brew --prefix nvm

 

2. `.zshrc`(zsh 설정파일) 파일에 접근한다. 우리는 이 파일에 경로를 지정해 줄 것이다.

vi .zshrc

 

3. 해당 파일에 아래의 텍스트를 입력한다.

export NVM_DIR="$HOME/.nvm"
[ -s "/{1번에서 나온 경로}/nvm.sh" ] && . "/opt/homebrew/opt/nvm/nvm.sh"  # This loads nvm
[ -s "/{1번에서 나온 경로}/etc/bash_completion" ] && . "/{1번에서 나온 경로}/etc/bash_completion"  # This loads nvm bash_completion
source $(brew --prefix nvm)/nvm.sh

 

🔖 vi 명령어 참고

명령어 설명
i vi 편집기 편집 실행 (insert)
dd line 삭제 (delete)
ctrl+o insert 상태 취소
:wq 편집 사항 저장 후 종료
:qa 편집 종료

 

4. `.zshrc`파일을 갱신한다.

source .zshrc

 

5. nvm 버전을 확인한다.

nvm --version

 


이정도면 프론트엔드 개발에 필요한 가장 기본적인 세팅은 끝난다.

새롭게 개발환경을 세팅하며 무의식적으로 사용했던 homebrew와 sudo의 역할에 대해 알게되었다.

728x90
반응형

'개발' 카테고리의 다른 글

이진 검색 트리는 뭘까?  (0) 2024.04.17
트리의 구현과 순회는 뭘까?  (0) 2024.04.17
큐와 스택, 데크는 뭘까?  (0) 2024.04.17
선형 자료 구조는 뭘까?  (0) 2024.04.17
Web font를 subset으로 만들기(feat. python)  (0) 2024.04.15