2. Canva에 앱 만들기. 개발환경 설정 (mac)

Canva App 개발 환경 설정 mac

캔바에 앱을 생성할 때, 로컬 개발환경이 필요합니다.

필요한 것은,

• git
• Node.js v20.10.0
• npm v10

여기에 webstorm 또는 vs code 

 

1. git 설치

이미 있으신 분들은 터미널에서 다음 명령어로 확인하시면 됩니다.

git --version                                                         
# git version 2.40.0

없을 경우 아래와 같이 설치 합니다.

brew install git

아직 brew 설치가 되어있지 않다면... 참고 

 

2. Node js v20.10.0

nvm 으로 위 버전을 맞춰야 합니다.

# 만약 nvm 이 없다면
brew install nvm

# m1 이상은
arch -arm64 brew install nvm

export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")" [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"

source ~/.zshrc
# 또는 source ~/.bashrc

그리고 캔바 sdk git clone 하고 npm install 하기 전에,

실행에 필요한 버전을 맞춰서 설치하기만 하면 됩니다.

node.js v20.10.0 설치

nvm install 20.10.0

 

> 이미 설치되어 다른 버전을 사용중이었다면

특정 버전의 node.js 선택

nvm use 20.10.0

 

 

설치할 때, 환경에 따라 여러 문제들이 발생하는데요.

모든 상황을 알 수 없으니, 오류났을 때 발생하는 오류 메시지는 

구글링 하시면 왠만한건 해결할 수 있을 겁니다 ㅎㅎ

 

Window 에서 설치하는 방법

[Canva] - 2. Canva에 앱 만들기. 개발환경 설정 (window)

 

 

• [Canva] - 1. Canva에 앱 만들기. Canva Developers
• [Canva] - 2. Canva에 앱 만들기. 개발환경 설정 (mac)
• [Canva] - 2. Canva에 앱 만들기. 개발환경 설정 (window)
• [Canva] - 3. Canva에 앱 만들기. canva-apps-sdk 설치
• [Canva] - 4. Canva에 앱 만들기. localhost 에서 app 띄우기
• [Canva] - 5. Canva에 앱 만들기. Button
• [Canva] - 6. Canva에 앱 만들기. api 호출 using axios
• [Canva] - 7. Canva에 앱 만들기. Select (dropdown)
• [Canva] - 8. Canva에 앱 만들기. Text Input / Number Input
• [Canva] - 9. Canva에 앱 만들기. 앱 배포하기