맥북 및 맥 OS 초기 설정 가이드 (feat. 프론트엔드 개발자)

macOS 초기 설정 가이드 및 프론트엔드 개발자를 위한 필수 프로그램 및 환경 설정 방법을 소개합니다.

2025년 1월 20일

소개

macbook 및 mac mini, imac 등 맥 OS를 구매하거나 회사에 새로 입사하여 맥 OS를 사용하게 되었다면, 초기 설정 및 필수 프로그램 설치에 대한 가이드가 필요할 것입니다. 이 가이드는 맥 OS를 사용하는 프론트엔드 개발자를 위한 초기 설정 가이드입니다. 맥 OS를 사용하는 개발자라면 누구나 참고할 수 있습니다.

본 블로그는 처음 나타는 mac의 세팅은 제외하고 모든 초기 설정이 끝난 후 필요 프로그램 및 개발 환경 설정에 대한 가이드입니다.

지극해 개인적인 경험으로 작성되었으며 다른 개발자들의 의견과 다를 수 있습니다. 또한, 개발 환경에 따라 필요한 프로그램이나 설정이 다를 수 있습니다. 이 가이드는 참고용으로 사용하시기 바랍니다.

브라우저 설치

Chrome 설치

`Chrome`

크롬은 개발자들 사이에서 가장 많이 사용하는 브라우저 중 하나입니다. 크롬은 미리 설치되어 있지 않으므로 크롬을 설치합니다.

크롬 이외에 다른 브라우저를 사용하시는 분들은 해당 브라우저를 설치하시면 됩니다.

대표적인 브라우저는 다음과 같습니다.

크롬을 예시로 기본 브라우저 설정을 크롬으로 원한다면 크롬을 실행하고 설정에서 기본 브라우저로 설정을 클릭하면 됩니다.

개발 환경 설정

우선 차후 IDE를 설치하기 전에 필요한 프로그램을 설치합니다.

이유는 IDE 설정시 git, github 등 계정 연동을 위해 필요하기 때문입니다.

계정 연동을 통해서 github에 IDE 환경설정을 저장해 두었다면 github에 저장해둔 extension을 가져오거나 설정을 가져올 수 있습니다.

Homebrew 설치

Homebrew는 맥 OS에서 패키지 관리자입니다. Homebrew를 사용하면 터미널에서 패키지를 설치하거나 삭제할 수 있습니다.

터미널을 실행하고 다음 명령어를 입력하여 Homebrew를 설치합니다.

terminal

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Homebrew가 설치되고나면 터미널에 다음과 같이 다음 스텝을 진행하라고 메세지가 나타납니다.

terminal

==> Next steps:
- Add Homebrew to your PATH in /Users/username/.zprofile:
    echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> /Users/username/.zprofile
    eval "$(/opt/homebrew/bin/brew shellenv)"
- Run `brew help` to get started

위 내용은 Homebrew를 PATH에 추가하라는 내용입니다. 메세지의 내용에 따라 터미널에 입력하여 Homebrew를 PATH에 추가합니다.

사용자 마다 다를수 있으니 반드시 본인의 터미널에 나타난 메세지 대로 실행해주세요.

해당 스텝을 진행하지 않으면 Homebrew를 사용할 수 없습니다.

brew --version를 입력하여 Homebrew가 설치되었는지 확인합니다.

terminal

brew --version

Homebrew의 버전이 나타나면 Homebrew가 정상적으로 설치된 것입니다.

이제 Homebrew를 사용하여 필요한 프로그램을 설치할 수 있습니다.

Homebrew를 설치했으니 최신버전으로 업데이트합니다.

처음 설치는 기본적으로 최신버전이 설치되어 있지만 혹시나 최신버전이 아닐 수 있으니 업데이트를 진행합니다.

terminal

brew update

Node.js 설치

Node.js는 자바스크립트 런타임입니다. Node.js를 설치하면 npm도 함께 설치됩니다.

터미널을 실행하고 다음 명령어를 입력하여 Node.js를 설치합니다.

terminal

brew install node

만약 terminal에서 설치하는것이 불편하다면 `Node.js`에서 다운로드 받아 설치합니다.

Node.js가 설치되었는지 확인하려면 node -v 또는 node --version를 입력합니다.

terminal

node -v

또한, npm이 설치되었는지 확인하려면 npm -v 또는 npm --version를 입력합니다.

terminal

npm -v

node와 npm의 버전이 나타나면 Node.js와 npm이 정상적으로 설치된 것입니다.

Yarn 설치 (선택)

Yarn은 npm과 같은 패키지 매니저입니다. npm보다 빠르고 안정적이라고 알려져 있습니다.

node와 npm을 설치했으니 터미널을 실행하고 다음 명령어를 입력하여 Yarn을 설치합니다.

terminal

npm install --global yarn

Yarn이 설치되었는지 확인하려면 yarn -v 또는 yarn --version를 입력합니다.

terminal

yarn -v

pnpm 설치 (선택)

pnpm은 npm과 yarn과 같은 패키지 매니저입니다. pnpm은 npm과 yarn보다 빠르고 용량을 적게 차지한다고 알려져 있습니다.

node와 npm을 설치했으니 터미널을 실행하고 다음 명령어를 입력하여 pnpm을 설치합니다.

terminal

npm install --global pnpm

pnpm이 설치되었는지 확인하려면 pnpm -v 또는 pnpm --version를 입력합니다.

terminal

pnpm -v

git 설치

terminal을 실행하고 git --version 또는 git -v를 입력하여 git이 설치되어 있는지 확인합니다.

만약 git이 설치되어 있지 않다면 mac에서 자동으로 git 설치 안내를 받아 설치할 수 있습니다.

만약 git이 설치되어 있지 않다면 `git`에서 다운로드 받아 설치합니다.

다른 방법으론 homebrew를 사용하여 설치할 수 있습니다.

terminal

brew install git

git 설치 후 초기 설정을 진행합니다.

terminal

git config --global user.name "Your Name"
git config --global user.email "email"

Your Name과 email에 본인의 이름과 이메일을 입력합니다.

이제 github와 연동을 위해 github에 등록된 ssh key를 사용합니다.

terminal

ssh-keygen -t ed25519 -C "email"

email에 본인의 이메일을 입력합니다.

ssh key는 ~/.ssh 디렉토리에 저장됩니다.

terminal

cat ~/.ssh/id_ed25519.pub

위 명령어를 입력하면 터미널에서 ssh key가 나타납니다. ssh key를 복사합니다.

ssh- 로 시작부터 이메일 주소까지 복사합니다.

github에 로그인 후 Settings -> SSH and GPG keys -> New SSH key를 클릭합니다.

Title에는 본인이 사용할 이름을 입력하고 Key에는 복사한 ssh key를 붙여넣기 합니다.

이제 github와 연동이 완료되었습니다.

연결을 확인하기위해 다음 명령어를 입력합니다.

terminal

ssh -T git@github.com

다음 비밀번호를 입력하고

Hi id! You've successfully authenticated, but GitHub does not provide shell access.와 같은 메세지가 나타나면 성공입니다.

이제 private repository를 클론해서 사용하려면 github token을 사용해야 합니다.

이제 더 이상 비밀번호를 사용해서 연결되지 않습니다. 반드시 토큰연결이 필요합니다.

github에 로그인 후 Settings -> Developer settings -> Personal access tokens -> Tokens (classic) -> Generate new token(classic)을 클릭합니다.

Token name과 Expiration(만료일)을 설정하고 repo를 선택합니다.

나머지 필요한 권한은 필요한것을 선택합니다.

생성된 토큰을 복사합니다.

생성된 토큰은 한번만 보여지므로 반드시 복사해두세요.

터미널을 실행하고 다음 명령어를 입력합니다.

매번 사용할때마다 입력하기 번거로우니 credential.helper를 사용하여 토큰을 저장합니다.

terminal

git config --global credential.helper cache

인증 정보를 저장하면 매번 clone 및 push 할때마다 토큰을 입력할 필요가 없습니다.

이제 아무 private repository를 클론하여 테스트합니다.

terminal

git clone "repository url"

이름을 입력하고 토큰을 입력하면 클론이 완료됩니다.

IDE 설치

Visual Studio Code 설치

`Visual Studio Code`

VSCode는 개발자들 사이에서 가장 많이 사용하는 텍스트 에디터 중 하나입니다. VSCode를 설치합니다.

VSCode를 설치하고 나면 확장 프로그램을 설치해야 합니다. 확장 프로그램은 개발 환경을 향상시켜주는 프로그램입니다.

우선 만약 github 계정이 있다면 github 계정을 연동합니다.

github 계정을 연동하면 github에서 저장해둔 확장 프로그램을 가져올 수 있습니다.

VSCode를 실행하고 좌측 하단에 사용자 아이콘을 클릭합니다.

Settings Sync를 클릭합니다.
Sign in with GitHub을 클릭합니다.
github 계정으로 로그인합니다.
Continue를 클릭합니다.

이제 github 계정과 연동되고 github에 저장해둔 확장 프로그램을 가져올 수 있습니다.

만약 github 계정이 없다면 확장 프로그램을 수동으로 설치합니다.

JetBrains IDE 설치 (선택)

`JetBrains`

Visual Studio Code 이외에 JetBrains IDE를 사용하시는 분들은 해당 IDE를 설치합니다.

대표적인 JetBrains IDE는 다음과 같습니다.

저는 WebStorm을 사용하고 있습니다.

WebStorm을 예시로 설명하겠습니다.

웹스톰을 설치 후 저장된 우측 상단 톱니바퀴 -> 백업과 동기화를 클릭하고 백업과 동기화 활성화를 클릭하여 계정에서 설정가져오기를 클릭합니다.

끝입니다.

Docker를 설치하면 Docker Desktop이 설치됩니다.

맥 OS 초기 설정 가이드가 도움이 되었기를 바랍니다.

mac os 고정 ip 설정 방법

Next.js와 Firebase로 인증(Authentication) 구현해보기

맥북 및 맥 OS 초기 설정 가이드 (feat. 프론트엔드 개발자)

소개

추천 앱 스토어 프로그램

Run Cat

Macs Fan Control

브라우저 설치

Chrome 설치

개발 환경 설정

Homebrew 설치

Node.js 설치

Yarn 설치 (선택)

pnpm 설치 (선택)

git 설치

IDE 설치

Visual Studio Code 설치

JetBrains IDE 설치 (선택)

Cursor IDE 설치 (선택)

기타 프로그램 설치

Docker 설치

Postman 설치

iTerm2 설치

협업 툴 설치

Slack 설치

Notion 설치

Jira 설치

마무리