[iOS] Xcode 프로젝트 생성 및 기초 구성

📌 프로젝트 생성

Xcode를 다운로드하고 처음 키면

이런 화면이 반겨줄텐데요,
새로운 프로젝트 생성을 위해 Create a new Xcode project를 눌러줍니다.
 
또는
 

왼쪽 상단 File - New - Project를 누르거나 단축키인 Shift + command + N을 눌러도 생성이 가능합니다.
 
 
프로젝트를 생성한다면 아래와 같이 많은 선택지가 나옵니다.

Application을 하나씩 알아볼게요!
 

1. App
    - 뷰를 사용하여 앱을 개발할 때 쓰는 템플릿 

2. Document App
    - 데이터를 저장할 수 있는 문서 기반의 앱을 개발할 때 사용하는 템플릿

3. Game
   - 게임 앱을 개발할 때 사용하는 템플릿

4. Argumented Reality App
    - 증강현실(AR) 앱을 개발할 때 사용하는 템플릿

5. Swift Playgrounds App
    - 플레이그라운드 앱을 개발할 때 사용하는 템플릿

6. Sticker Pack App
    - 스티커 팩 앱을 개발할 때 사용하는 템플릿

7. iMessageApp
    - iMessageApp을 개발할 때 사용하는 템플릿

8. Safari Extension App
    - 사파리 브라우저 확장 앱을 개발할 때 사용하는 템플릿

 
이 많은 템플릿들 중에 일반적으로 가장 많이 사용하는 건 App입니다 !!!!
그럼 App을 선택한 후 프로젝트 생성을 계속 진행해보겠습니다.

제가 처음 프로젝트를 생성할 때 당황했던 부분인데요.
여기도 하나 씩 설명해보도록 하겠습니다.
 

1. Product Name
    - 앱의 고유번호인 Bundle Identifier을 만드는 요소로 사용됩니다.
    - 사용할 프로젝트 이름을 넣으면 됩니다! ex) 1st-Seminar, DooriBon, NadoSunbae

2. Team
    - 애플 개발자로 생성된 인증서를 선택하는 부분입니다.
    - 애플 개발자 사이트에서 발급 받은 인증서가 있다면 목적에 맞게 서명된 앱을 만들어 낼 수 있습니다.
    - 만약 애플 개발자 계정이 없다면 Personal Team인 개인 계정을 넣어주면 됩니다.

3. Organization Identifier
    - 프로젝트 운영 기관 또는 조식의 식별값을 입력합니다.
    - 대체로 소속 회사나 해당 프로젝트의 도메인에서 www를 뺀 나머지 역순으로 사용합니다.
    - 이 값은 Product Name과 함께 Bundle Identifier의 구성 요소가 됩니다!

4. Bundle Identifier
    - 앱의 고유 식별 번호입니다.
    - Organization Identifier + Product Name으로 구성됩니다.

5. Interface
    - Interface를 구현할 때 사용되는 방법을 선택합니다.
    - 지금은 StoryBoard 방식을 선택하도록 하겠습니다.

6. Language
    - 앱을 개발할 때 사용할 언어를 선택합니다.
    - 지금은 Swift를 선택하겠습니다.

7. Use Code Data
    - 기기 내부에 데이터를 저장하는 경우, 이를 지원하는 코어 데이터를 사용할 것인지를 묻는 옵션입니다.
    - 사용 여부에 따라 선택하면 됩니다.

8. Include Tests
    - 개발한 소프트웨어의 품질을 테스트한 결과를 확인할 수 있는 단위 테스트 기능과 UI 요소에 따른 테스트를 할 수 있습니다.
    - 필요 여부에 따라 선택하면 됩니다.

 

Next를 누른 후, 원하는 경로를 선택하고 Create를 누르면 프로젝트 생성이 완료됩니다!

무사히 프로젝트가 생성되었네요 👏
 

 📌 프로젝트 기초 구성

- Navigation Area
   : 파일 탐색 및 파일 추가, 이슈 등 여러 정보를 하는 영역

왼쪽부터

• Project navigator
  - 작업중인 프로젝트 파일 구성을 보여준다.
  - 새로운 파일을 추가하거나 삭제, 수정이 가능하다.
• Source Control navigator
  - 소스 파일 버전 관리를 위한 네비게이터이다.
  - 레포지토리라고 불리는 소스 관리 전용 공간을 생성했을 때만 사용 가능하다. (프로젝트 생성 시 하단에 있는 Create Git repository on my Mac 선택 또는 Source Control -> Create Git Repositories 선택)
  
• Symbol navigator
  - 프로젝트에서 작성된 클래스나 구조체, 메소드 등의 심벌을 구조적으로 관리할 수 있는 네비게이터이다.
• Find navigator
  - 프로젝트 내부 내용을 검색할 때 사용한다.
• Issue navigator
  - 코딩 중 문법 오류나 문제가 생길 경우 경고나 오류 표시가 나타난다.
  
• Test navigator
  - 프로젝트 테스트 목적으로 생성된 정보를 보여준다.
• Debug navigator
  - 디바이스 혹은 시뮬레이션이 실행되면 각종 정보를 보여준다.
  - 디버깅 중에만 정보가 표시된다.
• Breakpoint navigator
  - 실행 중간에 코드의 진행을 멈추고 메모리나 변수값 등을 확인할 때 사용한다.
  - 코드 내 원하는 위치에 브레이크 포인터를 삽입하고 해당 목록을 확인할 수 있다.
• Report navigator
  - 빌드 결과나 실행 결과 등을 확인할 수 있다.
  - 필터와 함께 사용할 수 있다.

 

- Editor Area
   : 코드 작성, 화면 설계 등의 작업을 하는 영역

• 하단의 폰 모양 버튼을 누르면 어떤 기종으로 작업을 할지 정할 수 있습니다.

얼마 전 제인초이님께서 스토리보드 작업 관련 조언을 주셨는데,
사이즈가 큰 기종으로 작업을 하고 작은 기종에서 잘리는 것 << 사이즈가 작은 기종으로 작업을 하고 큰 기종에서 여백이 남는 것
이기 때문에 mini로 작업을 하는 것을 추천한다고 하셨습니다 🫶🏻
 

- Inspector Area
   : 선택한 파일에 대한 정보를 나타내는 영역

왼쪽부터

• File inspector
  - 선택된 파일에 대한 정보를 보여준다.
  - story board라면? 파일 정보, 빌드 대상 iOS 버전, 자동 레이아웃 옵션 등 설정하는 항목 표시
  - 화면 크기에 대응하는 앱, 국가별 언어 설정 처리 가능
• History inspector
  
• Quick Help inspector
  
• Identity inspector
  - 인터페이스 빌더에 추가된 객체와 이를 구현한 클래스 사이의 연결, 객체의 ID 등 고유 정보 관리를 할 수 있다.
  - UI 객체를 소스 코드에서 참조하기 위한 식별 값을 정의할 수 있다.
  - 소스 코드와 화면 상의 객체를 연결할 수 있다.
• Attributes inspector
  - 선택된 객체의 속성을 관리한다.
• Size inspector
  - 선택된 객체의 외형에 대한 속성을 관리한다.
  - 주로 크기, 위치, 배치 방식 등을 다룰 수 있다.
• Connections inspector
  - 인터페이스 빌더와 소스 코드 간의 연결 관계를 관리할 수 있다.

 

- Debug Area
   : 디버그 관련 내용 표시되는 영역

• 에러 로그, 출력 로그 등 확인 가능합니다.

 

- Tool Bar
   : 핵심 버튼이 있는 영역

• ▶️ 버튼을 누르면 빌드가 되고, 시뮬레이터가 작동됩니다.
• 이미지 중간 부분의 'iPhone 11'을 누르면 시뮬레이터 기종을 선택할 수도 있습니다.
  (여기서 아이폰을 유선 연결해서 시뮬레이터로 설정할 수 도 있습니다.)

 

각 부분마다 이런 아이콘이 있을 겁니다!
이걸 눌러주면 해당 부분을 접었다 폈다 할 수 있습니다.
저도 14인치를 쓰고 있기 때문에.. 접어 놓고 쓰는 게 눈이 조금이나마 편하더라구요.. 하하
 
 
다음으로는 파일들에 대해 살펴보겠습니다.
 

1. *.swift

    - Swift 클래스 파일로 앱의 소스 코드를 구성하는 역할을 합니다.
    - AppDelegate, SceneDelegate 파일은 앱 전체의 생명 주기를 관리하는 클래스 파일입니다.
        * 생명주기에 대해서는 따로 포스팅하도록 하겠습니다!
    - ViewController 파일은 화면(뷰)에서 처리하는 작업들을 처리하기 위한 소스 코드를 담고 있는 클래스 파일입니다.
      storyboard에 가면 화면이 보일텐데요, 일반적으로 화면 개수만큼 ViewController가 필요합니다!
 

2. *.storyboard

    - 유저 인터페이스를 종합적으로 구현하는 역할을 합니다.
    - Main.storyboard 파일은 프로젝트 생성 시 기본으로 생성이 되고, 앱의 GUI를 담당합니다.
    - LaunchScreen.storyboard 파일은 앱을 실행하면 처음 나타나는 시작 화면의 인터페이스 설계를 담당합니다. (스플래시)
    - 화면 간의 연결을 보여줍니다.
    - View Controller와 View를 담는 공간입니다.
    - 처음 iOS 개발을 공부하게 되면 이 스토리 보드에서 화면 구현을 공부할 거예요!
 

잠깐, View Controller는 뭐고, View는 뭔데 ?!

간단하게 View Controller 안에 View가 있다고 생각하면 될 것 같습니다.

View Controller는 뷰의 계층 구조를 관리하는 것입니다.
뷰 컨트롤러에는 모든 콘텐츠를 포함하는 하나의 루트 뷰(Root View)가 있으며,
이 루트 뷰에는 콘텐츠를 표시하는 데에 필요한 뷰(View)를 추가합니다.

View는 iOS 앱 사용자 인터페이스를 구성하는 기본 구성 요소입니다.
뷰를 사용해서 화면에 컨텐츠를 배치하거나 그릴 수 있으며 뷰 안에 또 다른 뷰가 들어갈 수 있습니다.
UI 컴포넌트인 Label이나 Button 등도 하나의 View 입니다.


‼️ ViewController.swift 파일과 View Controller는 다릅니다!!!!!

위에서 swift 파일에 대해 언급을 했 듯이 ViewController 파일은 작업에 필요한 소스 코드를 담고 있는 파일입니다.
먼저 ViewController.swift 클래스 파일은 말 그대로 '클래스' 파일이기 때문에 storyboard에 있는 View Controller와 연결해서 사용하게 됩니다.
그럼 해당 View Controller에서 ViewController.swift 파일에 있는 소스 코드를 사용할 수 있겠죠?!

 

3. Assets.xcassets

    - 이미지 및 아이콘 등의 리소스를 관리할 때 사용하는 폴더입니다.
    - 슬라이더를 커스텀하거나 앱의 아이콘 등등이 포함될 수 있겠죠?!
 

4. info.plist 

    - 프로젝트 설정을 담당하는 파일입니다.
    - 시작화면 설정, 네트워크 접근 허용, 카메라 접근 허용, 위치 접근 허용 등이 있습니다.
 

 📌 마치며

기깔난 세미나 자료를 만들어 주신 솝트 30기 iOS 파트장 태끼님께 감사의 말씀을 전합니다...
 
 
참고
* SOPT 30th iOS 1차 세미나 자료
* https://m.blog.naver.com/PostView.naver?isHttpsRedirect=true&blogId=sqlpro&logNo=221045495843