IOS 관련된 포스팅을 시작도 하기전에 블로그를 작성하다 한번 날렸습니다...
상당히 하기 싫어졌지만 준비한 스크린샷을 확인하고 다시 마음을 다잡아 다시 시작해보겠습니다.
IOS 를 놓은지도 어언 7년쯤 됬네요.
그동안 변경된 사항도 많기도 하고 관련 언어를 직접 다루는 프로젝트도 없어 서서히 잊어져 가다가
다시 한번 기본 개념을 잡기 위해 공부를 시작했습니다.
언어를 새로 시작할때 항상 HelloWorld 를 찍었기 때문에
이번 포스팅에는 이 과정에서 필요한 프로젝트 초기 설정 부터 실행한 화면이 에뮬레이터에서 보이는 과정까지의
내용을 담아보려고 합니다.
시스템 환경
- 운영 체제 : macOS Mojave
- Tool : Xcode 3.4.0
- Swift 5.0
시작
IOS 개발을 위해선 Mac 에 Xcode 라는 툴을 설치해야 합니다.
AppStore 에서 다운 받으실수 있으니 다운 받고 설치를 해줍시다.
설치 시간이 좀 걸리니 인터넷이 끊기지 않는 곳에서 설치 걸어주시고 다른 일을 하시는게 좋을거예요.
설치가 완료되면 Xcode 를 실행해주세요.
그럼 다음과 같은 화면이 노출될겁니다.
보시면 알겠지만 저희는 프로젝트를 처음 생성하는 입장이라 오른쪽 최근 프로젝트 항목이 텅텅 비어있는 것을 확인 하실수 있어요.
첫 프로젝트의 생성을 위해 빨간색 네모칸 표시가 되어 있는 'Create a new Xcode proejct' 라는 항목을 클릭해주세요.
기본적으로 프로젝트 생성시 Single View App 을 선택해서 진행해 주세요.
그러면 최초 프로젝트의 설정 입력화면이 나타나게 됩니다.
각각의 입력정보를 작성 후 넘어가 줍니다.
Organization Identifier 는 서비스할 앱이면 신중하게 고민해서 작성해주는 것을 추천드려요.
테스트 목적이라면 대충 입력하고 다음으로 넘어가 줍시다.
사용할 언어는 Swift 로 선택!
Notice! 여기서 나타내는 용어의 자세한 설명을 아래에 작성했으니 참고해주세요.
Product Name - 프로젝트 이름
Team - 애플 개발자 계정으로 생성된 인증서를 선택하는 부분 개발자를 가입만 하면 사용할 수 있으며 디바이스에서 실행할 수 있는 앱 당 7일간의 유효 인증서를 사용할 수 있습니다.
유료 개발자를 등록하면 1년간의 인증서를 사용할 수 있습니다.
Organization Name - 소속된 조직 이름
Organization Identifier - 조직의 식별값 보통은 해당 프로젝트의 도메인 주소를 거꾸로 입력합니다. Product Name과 연결되어 Bundle Identifier 항목을 완성하게 됩니다.
Bundle Identifier - 앱의 고유 식별값 자동완성됩니다.
Language - 앱을 제작할 개발 언어 선택 Objective-C, Swift 중 선택 가능
Use Code Data - 기기 내부의 저장소를 이용해 데이터를 저장할 때 사용할 수 있는 코어 데이터 객체를 사용할지에 대한 선택
Include Unit Tests - 소프트웨어 품질 관리를 위한 단위 테스트 기능 사용 여부
Include UI Tests - 화면 요소에 대한 자동 테스트 기능 사용 여부
자 드디어 프로젝트 생성 완료되었습니다.
저기 깨름직한 빨간색 느낌표도 보이지만 일단 무시하고
우선 에뮬레이터를 구경하고 동작도 확인할 겸 겸사 겸사 확인해볼까요?
왼쪽 상단에 플레이 버튼을 눌러 에뮬레이터 실행해 봅시다.
실제 디바이스 프레임에 맞게 에뮬레이터가 실행되서 보이네요
아직 아무것도 해주지 않아 흰색 화면만 덩그러니 보입니다.
이 화면은 실제 디바이스에 설치했을때 동일하게 보이는 화면입니다.
이제 저희가 UI 작업을 해주고 재 실행하면 에뮬레이터에서 실제 단말기에서 이렇게 보인다 ~ 라고 화면이 업데이트되어 보이게 되죠
동작도 실제 디바이스에서 동작하는 것처럼 나옵니다.
자! 제 목적은 오직 HelloWorld 를 이 에뮬레이터에 보이게 하는 거예요.
다시 Xcode 로 돌아와서 왼쪽 파일들 중 Main.storyboard 라는 파일을 선택해주세요.
그러면 에뮬레이터 화면과 동일한 화면이 나옵니다.
스토리보드는 UI 개발을 담당하는 파일로 준비된 각종 View 들과 설정창으로 쉽게 화면을 구성할수 있습니다.
이번 포스팅에서는 자세하게 다루지는 않겠습니다.
우리의 목적은 뭐다? HelloWorld 다.
상단에 표시된 버튼을 클릭해주세요.
독립된 기능을 가진 모듈을 컴포넌트라고 하는데 Library 는 UI 에 관련한 컴포넌트들을 보여주고 사용할수 있게 해줍니다.
마우스 클릭도 좋지만 편의를 위해 알아둡시다!
단축키는 command + shift + L !
동일하게 Library 검색창이 나옵니다.
우선 화면에서 보이는 것처럼 Label 을 검색하여 아이콘 부분을 스토리보드의 단말기 가운데로 드래그 해봅시다.
드래그 하다보면 어느 순간 가이드 라인이 나와 중앙에 위치시킬수 있도록 도와줄거예요.
그리고 나서 위치시킨 Label 위로 커서를 두고 한번 살짝 클릭하면 문자를 입력할수 있습니다.
우리의 목적은 뭐다? 다시한번 외쳐! HelloWorld 다.
이렇게 입력해줬으면 다 우리의 목적은 달성되었습니다.
이제 아까 에뮬레이터 실행했던것 처럼 왼쪽 상단 플레이버튼으로 실행해볼까요
자동으로 에뮬레이터에서 앱이 재 실행되며 우리가 설정해줬던 화면처럼 HelloWorld 가 똭 보입니다.
참 쉽죠?
이제 UI 설정까지 살펴 보았으니 실제 코드와 연계하여 동작을 설정하는 것을 살펴봐야 합니다만
이번 포스팅은 여기서 마치겠습니다.
다음 포스팅에서는 Swift 코드로 스토리보드에 만들었던 HelloWorld 의 Label 의 텍스트 내용을 변경하는 내용을 다루면서
UI + Swift 연결 기본 내용을 다뤄보도록 할게요.
이 포스팅은 제가 저에게 까묵지 말라고 정리하며 남기는 포스팅입니다.
부족한 부분이 많으니 잘못된 부분이 있으면 덧글 부탁드립니다.
긴글 봐주셔서 감사합니다.
참고 블로그
'IOS' 카테고리의 다른 글
| [Swift5.0/IOS] HelloWorld - IOS 프로젝트를 시작해보자2 (0) | 2019.09.11 |
|---|