Swift 4. 스위프트 일지 (1)

박건희·2022년 3월 28일
0

Swift

목록 보기
4/10

📌 갓데미

네이버 부스트캠프로 실전 프로젝트 강의를 듣다가 스타일에 맞지 않아 다시 새로운 강의를 찾아 나섰다.
완성된 코드와 레퍼런스들을 알려주는 형식이었기 때문에 개인적으로 학습에 도움이 되지 않는다고 느꼈다.

하고 싶은 프로젝트가 명확하게 있었다면 강의를 듣지 않고 직접 부딪혀가며 시작할 수도 있었지만,
카카오브레인 인턴쉽을 끝내고 프로젝트 기획엔 번아웃이 와서 일단은 학습만 하고 싶었다.

그렇게 돌고 돌아 찾아낸 udemy 강의!

https://www.udemy.com/course/ios-13-app-development-bootcamp/

영어도 잘하면서 왜 굳이 한글 강의만 찾았을까...

udemy에서는 정확히
1. 내가 원하는 syllabus
2. 최신 Xcode & Swift 버전
으로 돼있는 강의를 너무 쉽게 찾을 수 있었다.

심지어 최초 가입 할인을 통해 60시간짜리 강의를 10만원에서 17000원까지 깎을 수 있었다 대박 (절대 광고 아님)

일주일간 느낀 장점

1. 설명이 자세하다

나는 성향상 너무 많이 덜어낸 강의보다 자세하고 친절한 강의를 1.5배속으로 보는 걸 좋아한다. (RPG게임하면 모든 길을 다 가봐야 직성이 풀리는 타입..)

그 외에도 자세한 강의의 객관적 장점은 크게 세가지가 있는 것 같다.

  1. 스쳐지나가는 말들 중에 꿀팁들이 은근히 많다. 10초면 알 수 있는 내용을 몰라 에러 고치는 데 10시간을 넘게 써본 경험은 모두 있잖아~
  2. 단순히 코드 뿐 아니라 강사가 앱을 만들때 어떤 관점에서 문제를 보고 어떻게 생각해서 풀어나가는지 배우는 것이 엄청 중요하다고 생각하기 때문이다.
  3. 이미 아는 내용이면 넘기면 그만이다.

2. 커리큘럼이 전문적이다.

The App Brewery라는 전문 강습 기관 겸 앱 아웃소싱 회사에서 만든 강의다.
잘 아는 것과 잘 가르치는 것의 차이는 엄청 크다. 이 분들은 단계적 성장을 위한 효율적이고 친절한 계단을 마련해주는 사람들이다.
직접 부딪히면서 배우는 raw한 개발자도 좋지만, 내 시간과 노력을 아껴줄 사람들을 이용 안 할 이유도 없다.

3. 은근 동기부여 시켜준다.

중간 중간 동기부여용 짧은 강의가 생각보다 큰 도움이 된다.
강사인 Angela Yu씨가 심지어 의사 출신이라서 굉장히 신빙성이 있다.
10분이라도 더 공부하게 힘을 주고, 온라인 강의지만 인격적으로 만나는 것 같은 기분이 들어 더 집중하게 된다.


📌 Study Summary

Physical Device로 프로젝트 실행하기

  1. Xcode 버젼과 iOS 버젼 호환성 검사 (Xcode 버전 + 2 == iOS 호환 가능 버전. 소숫점까지 동일함)
  2. Signing & Capabilities에 애플 개발자 계정 추가
  3. 아이폰에 usb로 연결 후 이 컴퓨터를 신뢰하겠냐는 팝업에 ‘신뢰’ 클릭
  4. Xcode에서 target을 iPhone으로 바꾸고 Run

와이파이로 Physical Device에 실행하기

주의: 최초 한번은 무조건 USB로 연결해야 함

  1. USB로 기기를 연결한 후 Xcode에서 device와 연결됐는지 확인
  2. Xcode 상단 툴바의 Window > Devices and Simulators 들어가기
  3. Connect via network 체크박스 클릭
  4. 맥과 아이폰을 동일한 Wifi로 접속한 후 Run하기

Xcode 프로젝트 GitHub clone 하기

  1. 원하는 깃헙 repo에서 http url 복사
  2. Xcode 상단 툴바의 Source Control > Clone…을 누르거나 Xcode 시작 시 welcome 화면에서 Clone an existing project 클릭
  3. 1번에서 복사한 url을 붙여넣고 디렉토리 생성

AutoLayout 사용법:

  1. 전체 화면을 기준으로 하는 것은 그냥 Superview 기준으로 constraints & alignment girl
  2. 화면을 분할해서 사용할 경우 View를 가져와서 컴포넌트를 고정할 Container로 쓴다.
    방법 1. View에 포함시키고 싶은 컴포넌트들을 묶은 후 상단 툴바의 Editor > Embed in > view 클릭
    방법 2. View에 포함 시키고 싶은 컴포넌트들을 묶은 후 console 최우측 하단 버튼 클릭 (추천 방법)
    방법 3. Object library에서 View를 클릭한 후 storyboard에 추가한 후 좌측 view navigator pane에서 hierarchy 수정하기
  3. 여러 Container들로 화면을 순서대로 꽉 채우려면 Stack View를 쓴다. View들을 동시에 클릭한 후 Editor > Embed in > Stack view

Auto Layout에서 Text Overflow 해결하기

storyboard의 label property (화면 우측 Pane)에서:

  1. Lines 를 0으로 바꾸면 Overflow 시 자동 줄바꿈을 해준다
  2. AutoShrink에서 minimum font size를 설정해준다.

MVC 패턴

Navigator Pane에서 파일 우클릭 > New Group from Selection을 통해 폴더 구조로 나눠 놓으면 더욱 visualization에 좋다.

Model: Class 혹은 Structure로 Data 구조를 규정하고 Data 관련 로직들을 method로 구현
Controller: UIViewController를 상속해서 직접적으로 View와 소통하는 부분
View: AutoLayout이나 SwiftUI를 통해 만드는 View 부분

💡 Function definition 시 parameter 가 들어가는 소괄호 안에 ‘_ ‘를 넣으면 (e.g. func checkAnswer(_ answer: String) {…})
후에 함수 호출 시 그냥 값만 넣어도 된다는 뜻이다 (e.g. checkAnswer(answer: “Answer”) => checkAnswer(“Answer”))

self property의 Immutability:

  • Let/var 선언 상관없이 모든 self property는 Immutable하다.
  • 따라서 instance 스스로 자신의 값을 바꾸는 메소드를 작성하려면 mutating keyword를 func 앞에 써줘야 한다.

Dark Mode 확인/적용

  • 확인하기
    • Xcode에서 Main.storyboard 하단에 있는 반은 까맣고 반은 하얀 원을 클릭하면 된다.
  • 적용하기
    1. Color의 경우 간단하게 component의 색을 Custom color가 아니라 System Color를 사용하면 된다.
      • Custom color를 사용하고 싶은 경우 Main.storyboard에서 사용하고 싶은 색상을 팔레트에 추가한다 (Optional)
    2. Assets.xcassets 에 들어가서 “New Color Set”을 추가한다.
    3. 해당 Color set을 클릭한 후 오른쪽 pane에서 Appearance를 Any, Light, Dark로 변환
    4. 다시 한번 오른쪽 pane 최하단의 Show Color Panel을 누르고 Any, Light appearance에 추가한다.
    5. Dark mode 일 때 사용하고 싶은 색상도 설정한다

화면끼리 이동시키는 법 (segue)

  1. Main.storyboard에 새로운 View Controller 를 라이브러리에서 드래그 해온다
  2. 새로운 View Controller를 꾸민다
  3. Cocoa Touch class를 생성한 후, 2번의 view controller (화면 상단의 3개의 icon 중 첫번째, 혹은 storyboard navigator에서 클릭)의 Custom class로 지정해준다.
  4. Initial View Controller에서 그 다음 순서의 view controller로 control + drag and drop을 한 뒤, ‘present modally’를 클릭해서 storyboard segue를 생성

Vector Image (.svg)

Vector Image (.svg)를 사용할 때 x2, x3를 설정하지 않아도 픽셀이 깨지지 않는 이유:
화면에 있는 모든 선분들을 픽셀이 아니라 vector로 저장해놓은 형식이기 때문에 화면비와 상관없이 깨지지 않는다.

Vector image를 적용하는 방법

  1. Assets.xcassets에 drag & drop
  2. Resizing의 Preserve Vector Data를 Check
  3. Scale을 Individual Scales에서 Single Scale로 변경

Autolayout에 대한 개인적인 깨달음

너무 어렵게 생각하지 말고 플러터와 동일하게 생각하면 된다.

화면 UI를 구성할 때, Row나 Column으로 세분화되서 찢어지는 것들은 모두 stack view로 만든다.
Flutter의 Expanded widget처럼 남은 공간을 전부 하나의 component에게 주고 싶을 땐,
해당 component가 있는 StackView에서 다른 모든 컴포넌트들의 값을 설정해주면 남은 공간을 전부 가질 수 있다.
(Flutter에서 column/row안에 있는 widget들에만 expanded를 적용할 수 있고, expanded widget을 제외한 다른 widget들은 전부 정해진 길이가 있어야 하듯이)

profile
CJ ENM iOS 주니어 개발자

0개의 댓글