'아무것도 모르는 당신'도 할 수 있는 챗GPT로 앱 만들기 (2)

2025.03.10 - [개발] - 누구나 할 수 있는 챗GPT로 앱 만들기 (1)

'아무것도 모르는 당신'도 할 수 있는 챗GPT 앱 만들기 (1)

1. 개발환경 세팅

오늘은 개발에 사용할 프로그램 환경을 세팅해보려고 합니다. 

이는 무언가를 만든다고하면 장비 도구들이 필요한데 이 프로그램이 도구라고 생각하시면 됩니다

 

저는 MAC OS이기 때문에 Xcode + Android Studio + flutter 이렇게 세개를 설치할 겁니다!

다른것을 사용하셔도 무방합니다.

 

중간에 모르는 부분은 챗 gpt(chatgpt)에 편하게 물어보세요

친해져야하니까요

2. 프로그램 역할 및 설명

우선 설치할 프로그램의 역할을 쉽게 설명하자면 !

용어	설명
Xcode	우리가 개발로 만든 것을 ios 즉 가상의 아이폰을 만들어주는 프로그램
Android Studio	우리가 개발할 코드를 넣는 곳이며 주로 여기서 프로그램을 만들예정 (가상의 안드로이드를 만들어줌)
flutter	하나의 코드로 iOS와 Android 앱을 동시에 만들 수 있게 해주는 개발 도구 (dart 언어 사용)
Dart	Flutter에서 사용하는 언어
CocoaPods	iOS용 라이브러리 관리 도구
터미널	명령어를 입력하는 도구 (검은 창)

 

그림으로 쉽게 보면 아래와 같아요

   나 (개발자)
            ↓
   Dart + Flutter 코드
            ↓
 ┌───────────────┐
  │  Android Studio   │ ← 코딩, 실행, 디버깅
 └───────────────┘
      ↓                ↓
 Android 앱       iOS 앱
                          ↳ (Xcode가 필요)

 

 

3. 프로그램 설치 

     3-1. 플러터(Flutter) 설치

       > https://docs.flutter.dev/get-started/install 공식사이트 접속

   > ios 클릭 (windows 이신분들은 windows 설치)

   > 하단에 Download and install 클릭

> 자기 맥북 버전에 맞는 프로그램 다운로드 (모를경우 최상단 이전 게시물 참고)

 

> 기본앱인 터미널을 킵니다
   아래와 같은 창이 나오는데 겁먹지마세요 아무것도 아닙니다.

   echo $SHELL

응답은 /bin/zsh 또는 /bin/bash 둘중 하나가 나올겁니다.

저는 zsh 네요 

 > 환경변수 설정

    터미널(명령어창)에서 flutter 명령어를 어디서든지 사용할 수 있도록 하기 위해서 환경변수 설정을 해야합니다

 

/bin/bash 로 나오신분은 아래 명령어를 쳐주세요

vi ~/.bashrc

/bin/zsh 로 나오신분은 아래 명령어를 쳐주세요

vi ~/.zshrc

 

그러면 vi 편집기로 이동 됩니다.

여기 편집기 안에 내가 설치한 zip파일 경로를 찾아야합니다.

 

이것은 제 이전 게시물에 있으니 찾는방법은 아래 게시물 참고 부탁드리며,

다운로드 폴더에 있다고 가정하겠습니다

2025.03.22 - [일반] - [Tip] 맥북 파일 경로(디렉토리) 확인방법 및 꿀팁!!

 

VI 편집기 안에다가 다운로드 받은 경로를 넣어야 합니다.

 

VI 편집기를 편집하기 위해서는 키보드 소문자 i를 누르면, insert 모드 ( 편집모드) 로 진입합니다.

여기에 파일을 다운로드 받은 경로를 붙여넣기 해주시면 됩니다.

export PATH="$PATH:$HOME{파일압축푼위치}"

export PATH="$PATH:$HOME/Downloads/flutter/bin"

 

$home은 자신의 기본 폴더인 '/user/제이름' 입니다.

 

수정이 끝났으면 편집모드를 끝내는 esc버튼 누른 후 wq! 를 입력하고 저장하고 나오면됩니다.

만일 잘못 입력했을경우 저장하지 않고 나오는 q! 입력하시면 됩니다.

 

3-2. Xcode 설치

       > 기본앱인 App Store 접속 > xcode 검색 후 설치 

 

     > 설치후 터미널에서 아래 명령어 진행.

sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -runFirstLaunch

 

 

 3-3. 안드로이드 스튜디오(Android Stuio) 설치

       > https://developer.android.com/studio?hl=ko

            안드로이드 스튜디오 공식 사이트 접속

       > 하단에 버전에 맞춰 설치

             (MAC 설치 버전을 모를경우 아래 게시물 참고)
              2025.03.17 - [일반] - 맥북 안드로이드 스튜디오 runtime 설치 오류

          > 안드로이드 스튜디오 아이콘을 applications로 끌어당겨 설치 완료

              내부 설정은 Standard 로 진행

> 안드로이드 스튜디오를 시작 후 빈 프로젝트 하나 생성

   Tools> SDK Manager 클릭

 

> Android SDK tool 다운로드를 받아줍니다.

 

 

 

> 터미널에서 아래 명령어 실행
flutter 에서 오류가 있는 부분이 나오며 오류가 없어야 합니다

아마 아직 오류가 많으실 것으로 판단됩니다.

차근차근 따라와 주세요

flutter doctor

 

 

 

3-4. cocaoPods 설치

> 터미널에서 cocoapods 설치 진행

 brew install CocoaPods

 

  3-4-1. brew 설치

  만일 brew 가 설치되지 않은 경우라면 사이트 들어가서 하단 명령어 저장 후 터미널에서 실행

  https://brew.sh

 

    > 설치 중간에 비밀번호 입력 진행,
    > 설치가 끝나면 아래 명령어를 따라 입력 (설치 스크립트가 마지막에 알려줌):

echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> ~/.zprofile
eval "$(/opt/homebrew/bin/brew shellenv)"

 

   > 아래 명령어 실행 후 버전 보일경우 정상 설치 됨

brew --version

 

 

이렇게 설치해야할 것들은 모두 설치하였고터미널에서 아래 명령어 실행 후 오류가 발생한다면 아래 게시물 참고하여, 오류 해결하시면 됩니다!

flutter doctor

 

2025.03.30 - [개발] - 플러터 설치 오류 모음과 해결법 정리 (Mac 기준)

플러터 설치 오류 모음과 해결법 정리 (Mac 기준)

 

 

"오늘은 앱 개발을 위한 기본 환경을 세팅해봤습니다.

아직은 낯설 수 있지만, 하나씩 따라가다 보면 어느새 익숙해질 거예요.

 

다음편을 기대해주세요 감사합니다.