Peppo

[배포] 프로비저닝 프로파일 (Provisioning Profile) 등록

Peppo — Sat, 13 Sep 2025 15:11:49 +0900

개념

앱의 신뢰성과 보안을 보장하고, Apple 내에서 앱이 정상적으로 실행될 수 있도록 허가 하는 역할

프로비저닝 프로파일 (Provisioning Profile)

기기에서 앱을 실행하고 특정 서비스를 사용하고자 할 때 사용되는 파일

프로비저닝 프로파일(이하 pp)를 생성하기 위해 필요한 것들

Identifiers
Certificates
Devices

앱 ID (Identifiers)

앱을 고유하게 식별하는 ID

생성방법

1. 애플 디벨로퍼 > Certificates, Identifiers & Profiles > Identifiers 카테고리 > '+' 클릭

2. App IDs 선택

3. App 선택

4. Description, BundleID, Capabilities 입력

5. 생성완료

CSR 생성 (CertificateSigningRequest)

Certificate를 만드는데 사용

생성방법

1. 키체인 접근 실행

2. 이메일 주소, 이름 입력 후 아래와 같이 체크

3. '계속' 누르면 CSR이 생성됨

비대칭키: 잠글수 있는 키(public key), 열수있는 키(private key) - "RSA"가 대표적
이 private key가 존재해야, xcode에서 실행할 수 있는데 개발자끼리 협업을 할 때 이 private key를 공유해서 써야 원활한 개발이 가능
private key를 잊으면 갱신하면 되는데, 이 때 다른 개발자가 기존의 private key는 무효화 되어 동기화에 문제가 생김
보통 private key를 공유 하려면, git repository에 Certificate와 private키를 올려놓고 각 개발자들은 이 파일을 다운받아서 keychain에 저장하는 형태로 사용
private key를 추출하려면, 인증서에 해당하는 key에 오른쪽 마우스 -> 내보내기로 ~.p12파일 획득 가능

4. 생성완료

키체인 접근에서 Public Key | Private Key 확인 방법

키체인 접근 → (좌측 카테고리) 로그인 → (상단 카테고리) 키 → 등록했던 CSR 이름 확인

.p12 파일 추출 방법

위 접근 방법 → 개인키(private key) 우클릭 → 내보내기 → .p12 파일 획득

인증서(Certificates)

개발용 | 배포용 인증서

앱을 빌드하고 서명한 개발자 또는 팀이 Apple 개발자 프로그램에 등록된 유효한 회원임을 증명하는 용도

생성방법

1. Certificates 카테고리 > '+' 클릭

2. 필요 목적에 따라 Software, Services 선택

Development (개발용) | Distribution(배포용)

3. CSR 파일 추가 → 저장해둔 CSR 파일 불러오기

4. 다운로드

5. .cer 파일 확인 → 다운받은 파일 더블 클릭 → 자동 등록 (키체인에 인증서 등록 완료)

기기등록 (Devices)

1. Devices 카테고리 > '+' 클릭

2. 기기 이름, 기기ID 입력

3. 등록완료

프로비저닝 프로파일 (Provisioning Profile)

생성방법

1. Profiles 카테고리 > '+' 클릭

2. 개발용 (iOS App Development) | 배포용 (Ad Hoc)

3. 'Identifier' 에서 생성한 AppID 등록

4. 'Certificates'에서 생성한 Certificate 등록

5. 'Devices'에서 생성한 Device or 팀원 Device 등록

6. Provisioning Profile 이름 입력 → Download

7. (Xcode) Provisioning Profile 등록

Xcode → Signing & Capabilities → Provisioning Profile → Import ... → 다운받은 pp (Provisioning Profile) 등록

[iOS] layoutIfNeed, setNeedsLayout

Peppo — Sun, 16 Mar 2025 22:53:30 +0900

레이아웃 작업을하면서 메소드 정리가 필요할것 같아 작성해봅니다

요약

layoutIfNeeded

: 즉시 업데이트

setNeedsLayout

: 다음 UI *update cycle에 업데이트

들어가기전에 update cycle부터 알아보고 갑시다.

update cycle이란?

iOS는 화면을 업데이트할 때, 아래의 과정을 거칩니다

유저의 이벤트 → 레이아웃 → 디스플레이 → 렌더링

어플리케이션이 유저로부터 모든 이벤트 핸들링 코드를 수행하고 다시 *Main Run Loop로 컨트롤을 반환하는 지점 입니다.

이론적인 내용이라 이해하기 어려운데 조금더 정리해보자면

1. Event Handling

: 유저가 view를 터치하거나 버튼을 누르면

2. Layout Pass

: 레이아웃 재계산이 필요한 경우 setNeedsLayout()으로 예약하거나, layoutIfNeeded()로 즉시 적용합니다.

3. Display Pass

: 레이아웃 변경이 완료되면 화면을 다시 그립니다.

4. Rendering

: GPU가 픽셀을 렌더링해 사용자에게 보여줍니다

위의 과정을 update cycle이라고 합니다.

그럼 Main Run Loop 는 뭐죠?

Main Run Loop

Run loop는 어플리케이션의 터치와 같은 input sources를 관리하는 object에 대한 프로그래밍 인터페이스 입니다.

Run loop는 시스템에서 생성, 관리하며, 각 스레드 객체에 대한 런루프 객체 생성도 담당합니다.

즉, 입력 소스를 처리하는 이벤트 처리 루프

layoutIfNeeded()

view가 레이아웃을 즉시 업데이트 하도록 하려면 이 방법을 사용

Constraint를 이용한 애니메이션을 쓰는 상황에서 자주 사용되며,

아래 예시를 통해 사용하고 안하고 차이를 먼저 봅시다.

하단의 버튼을 눌렀을 때 가운데 blueView의 height가 10씩 증가하도록 했습니다.

UI property 코드

    private lazy var blueView: UIView = {
        let v = UIView()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.backgroundColor = .systemBlue
        return v
    }()
    
    private lazy var increaseHeightButton: UIButton = {
        let v = UIButton()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.backgroundColor = .systemBlue
        v.setTitle("increase height", for: .normal)
        v.setTitleColor(.white, for: .normal)
        v.addTarget(self, action: #selector(increaseHeightTapped), for: .touchUpInside)
        return v
    }()
    
    private var blueViewHeightConstraint: NSLayoutConstraint!

Constraint

    func setupUI() {
        self.view.addSubview(self.blueView)
        self.view.addSubview(self.increaseHeightButton)
        
        self.blueViewHeightConstraint = self.blueView.heightAnchor.constraint(equalToConstant: 100)
        
        NSLayoutConstraint.activate([
            self.blueView.centerXAnchor.constraint(equalTo: self.view.centerXAnchor),
            self.blueView.centerYAnchor.constraint(equalTo: self.view.centerYAnchor),
            self.blueView.widthAnchor.constraint(equalToConstant: 100),
            self.blueViewHeightConstraint
        ])
        
        NSLayoutConstraint.activate([
            self.increaseHeightButton.leadingAnchor.constraint(equalTo: self.view.leadingAnchor, constant: 32),
            self.increaseHeightButton.trailingAnchor.constraint(equalTo: self.view.trailingAnchor, constant: -32),
            self.increaseHeightButton.bottomAnchor.constraint(equalTo: self.view.bottomAnchor, constant: -32)
        ])
    }

버튼을 누르고 blueView의 height값을 하기 위해 print를 남겨놓고 테스트를 해봅시다.

    // 버튼 눌렀을 때
    @objc func increaseHeightTapped() {
        print("Before increasing blueView height: \(self.blueView.frame.height)")
        
        self.blueViewHeightConstraint?.constant += 10
        
        print("After increasing blueView height: \(self.blueView.frame.height)")
        
    }

UI적으로는 blueView height가 변하긴 하지만 실질적으로 blueView.height 값은 바뀌기 전과 후가 같습니다.

이유는 frame은 레이아웃이 업데이트된 뒤에 변경되기 때문이에요.

내용을 좀 더 덧붙여보자면

iOS에서 constraint 변경 감지 → 자동으로 다음 화면 리프레시 때 레이아웃 다시 계산 → 화면 반영 순서로 진행이 되는데,

코드 상에선 레이아웃이 아직 반영되지 않았기 때문에 frame 값이 변하지 않은것 처럼 보이는겁니다.

이제 layoutIfNeeded()를 height 값을 바꾼후 적용해봅시다.

    // 버튼 눌렀을 때
    @objc func increaseHeightTapped() {
        print("Before increasing blueView height: \(self.blueView.frame.height)")
        
        self.blueViewHeightConstraint?.constant += 10
        self.view.layoutIfNeeded()

        print("After increasing blueView height: \(self.blueView.frame.height)")
        
    }

layoutIfNeeded() 적용

layoutIfNeeded가 실행되면서 레이아웃을 즉시 업데이트하기 때문에 After increasing blueView height도 바뀐 frame값이 적용된걸 볼 수 있습니다.

그리고 layoutIfNeeded가 필요한 이유를 보려면 애니메이션을 구현해보면 알게 됩니다.

아래는 layoutIfNeeded가 없는 상태에서 애니메이션을 적용했을 때 입니다.

    @objc func increaseHeightTapped() {
        
        print("Before increasing blueView height: \(self.blueView.frame.height)")
        
        UIView.animate(withDuration: 1) {
            self.blueViewHeightConstraint?.constant += 10
        }
        
        
        print("After increasing blueView height: \(self.blueView.frame.height)")
        
    }

결과는?

frame값도 변하지 않고 애니메이션도 적용되지 않는 모습입니다.

다음은 layoutIfNeeded적용 코드입니다.

    @objc func increaseHeightTapped() {
        
        print("Before increasing blueView height: \(self.blueView.frame.height)")
        
        UIView.animate(withDuration: 1) {
            self.blueViewHeightConstraint?.constant += 10
            self.view.layoutIfNeeded()
        }
        
        print("After increasing blueView height: \(self.blueView.frame.height)")
        
    }

늘어나는게 보이시죠?

layoutIfNeeded()가 없으면 constraint 변경은 예약만 되고, 애니메이션 없이 다음 Run Loop 에서 즉시 반영됩니다.

그래서 애니메이션 효과가 없이 보이게 되는거죠.

layoutIfNeeded()를 사용하면 애니메이션 블록 내에서 즉시 레이아웃을 업데이트해 초기/최종 상태가 감지되면서 부드러운 애니메이션이 적용됩니다.

setNeedsLayout()

layoutSubviews를 가장 적은 부하로 호출할 수 있는 메소드 입니다.

비용이 가장 적게 드는 방법으로 해당 메소드를 호출한 view는 재계산 되어야 하는 View로 인식되며 update cycle에서 해당 view의 layoutSubviews()가 호출되게 됩니다.

대부분 iOS가 알아서 setNeedsLayout을 호출하기 때문에 직접 호출할 필요는 없지만

아래의 경우에서 유용하게 사용됩니다.

constraint를 건들지 않고, view 속성을 직접 변경하는 경우

// constraint를 건들지 않은 경우
self.blueView.frame.size.height += 10
self.view.setNeedsLayout()

여러 레이아웃 변경을 한 번에 처리하고 싶을 때

self.blueViewHeightConstraint?.constant += 10
self.redViewHeightConstraint?.constant += 20
self.view.setNeedsLayout()  // 한 번만 호출해서 최적화

부모 뷰 전체가 아닌, 특정 subview에만 레이아웃 갱신을 하고 싶을 때

self.blueView.setNeedsLayout()

정리

layoutIfNeeded 는 레이아웃을 즉시 업데이트하고 애니메이션, 변경 직후 상태를 바로 확인할 때 사용을 하며, 즉시 반영이기 때문에 성능 저하 우려가 있고,

setNeedsLayout 은 모든 레이아웃 업데이트를 하나의 업데이트 주기로 통합할 수 있으므로 성능적으로 이점이 있다.

그동안 기존 코드에 뒤 두 메소드의 역할이 어떤것이었는지 궁금했는데

이번기회에 동작 방식을 알고 가니 어떤 상황에 사용되야할지 명확해진것 같습니다.

참고

1. https://www.youtube.com/watch?v=0loU4SyTfho

2. https://frouo.com/posts/ios-layoutifneeded-vs-setneedslayout

3. https://duwjdtn11.tistory.com/619

4. https://skytitan.tistory.com/514

[Swift] POP(Protocol Oriented Programming) 한번쯤 들어봤을거고, 어쩌면 나도 모르게 하고 있었던거

Peppo — Sat, 1 Feb 2025 21:11:36 +0900

오늘은 POP (Protocol Oriented Programming)에 대해 공부해보려고 합니다.

그동안 Protocol이란

1. 채택하면 해당 protocol 내부의 구현을 해야하고

2. struct, enum에도 채택을해서 구현할 수 있고

3. extension으로 구현부를 작성할 수 있고

4. delegate로 대리자에게 기능을 위임하도록 할 수 있고

등등 생각보다 protocol이란 개념은 알겠지만

'POP 프로토콜 지향 프로그래밍을 하고 있나?'

라는 질문에는 섣불리 대답을 못할것 같다..

이에 어떤 장점이 있고

어떤 상황에써야 좋으며,

왜 써야하는지에 대해 정리를 해보고자 합니다.

프로토콜을 알고 있다는 가정하에 아래 내용을 작성합니다.

약간의 개념과 예시를 참고 하고싶다면 여기를 읽고 와주세요.

POP (Protocol Oriented Programming)

Swift에서 강조하는 프로그래밍 패러다임으로, 프로토콜을 중심으로 설계하는 방법 입니다.

OOP(객체 지향 프로그래밍)에서는 상속을 통해 기능을 확장하는 방식이 일반적이었지만,

상속은 하나밖에 할 수 없으며, 애플에서 구조체 사용을 권장하는데 구조체(struct)는 상속을 받지 못합니다.

이를 보완하기 위해 등장한 개념이 POP 입니다.

OOP, POP의 차이점

보완하기 위해 나왔다는 POP.

그럼 비교도 한번 해보겠습니다.

	OOP (객체 지향)	POP (프로토콜 지향)
개념	클래스(Class) 중심	프로토콜 중심
기능 확장	상속(Inheritance) 사용	프로토콜 준수(Conformance) 사용
다중 기능 적용	단일 상속(다중 상속 불가)	다중 프로토콜 채택 가능

설명을 쓰는것보단 예시로 작성하는게 이해가 잘 될것 같아 바로 예시로 넘어가겠습니다.

예시

자전거, 자동차는 모두 탈것(Vehicle)에 속하고 공통으로 사용되는 프로퍼티, 메서드가 있을겁니다.

아래 예시에서는 공통 프로퍼티를 speed, 메서드를 가속(accelerate)으로 예를 들어볼게요.

먼저 공통으로 사용되는 부분은 protocol로 선언해주고 (Vehicle)

protocol Vehicle {
    var speed: Double { get set }
    func accelerate()
}

Car, Bicycle 클래스를 만들어 각각 Vehicle 프로토콜을 채택해주면 Vehicle을 따르지 않았다고 에러가 뜹니다.

해당 프로토콜을 구현해줍니다.

class Car: Vehicle {
	var speed: Double = 0.0
    
    func accelerate() {
        self.speed += 10.0
        print("Car is accelerating. Current speed: \(self.speed) km/h")
    }
}

class Bicycle: Vehicle {
    var speed: Double = 0.0
    
    func accelerate() {
        self.speed += 5.0
        print("Bicycle is accelerating. Current speed: \(self.speed) km/h")
    }
}

let myCar = Car()
myCar.accelerate()
myCar.accelerate()
myCar.accelerate()

let myBicycle = Bicycle()
myBicycle.accelerate()
myBicycle.accelerate()

/* 출력
Car is accelerating. Current speed: 10.0 km/h
Car is accelerating. Current speed: 20.0 km/h
Car is accelerating. Current speed: 30.0 km/h
Bicycle is accelerating. Current speed: 5.0 km/h
Bicycle is accelerating. Current speed: 10.0 km/h
*/

초기구현(Default Implementation)

여기서 멈췄을때를 공통적으로 구현해주고 싶을때 extension으로 따로 구현해줍니다.

protocol Vehicle {
    var speed: Double { get set }
    func accelerate()
}

extension Vehicle {
    func stop(vehicle: String) {
        print("\(vehicle) is stopped")
    }
}

Car에서도, Bicycle에서도 stop() 메서드를 사용할 수 있게 됩니다.

let myCar = Car()
myCar.accelerate()
myCar.accelerate()
myCar.accelerate()
myCar.stop(vehicle: "Car")

let myBicycle = Bicycle()
myBicycle.accelerate()
myBicycle.accelerate()
myBicycle.stop(vehicle: "bicycle")

/* 출력
 Car is accelerating. Current speed: 10.0 km/h
 Car is accelerating. Current speed: 20.0 km/h
 Car is accelerating. Current speed: 30.0 km/h
 Car is stopped.
 Bicycle is accelerating. Current speed: 5.0 km/h
 Bicycle is accelerating. Current speed: 10.0 km/h
 bicycle is stopped.
 */

위와 같이 extension으로 프로토콜을 구현하는 방식을 초기구현(Default Implementation) 이라고 합니다.

오케이, 근데 아직 '와.. 꼭 써야겠는데?' 하는 포인트가 없는것 같은데.

좀 더 가보죠

프로토콜은 프로토콜끼리 상속도 가능하다.

만약 여기서 전기차, 전기자전거가 추가 된다면?

탈것이긴한데, 배터리 관련해서 정보가 있어야할거고, 충전도 해야할겁니다.

이에 아래와 같이 batteryLevel, charge() 메서드를 추가해보겠습니다.

'프로토콜은 프로토콜끼리 상속이 가능합니다.'

이전에 만들어뒀던 Vehicle을 상속시켜보면

protocol ElectricVehicle: Vehicle {
    var batteryLevel: Double { get set }
    func charge()
}

사실상 아래와 같은 코드겠죠.

protocol ElectricVehicle: Vehicle {
//  Vehicle 
//  var speed: Double { get set }
//  func acclerate()

    var batteryLevel: Double { get set }
    func charge()
}

Tesla라는 Class를 만들어서 ElectricVehicle을 채택시켜보면 아래와 같은 에러가 납니다.

ElectricVehicle, Vehicle을 준수해라

그리고 ElectricVehicle을 채택했으니 준수(따라줘야)해줘야겠죠.

구현해줍시다.

protocol ElectricVehicle: Vehicle {
    var batteryLevel: Double { get set }
    func charge()
}

class Tesla: ElectricVehicle {
    var batteryLevel: Double = 60.0
    
    func charge() {
        self.batteryLevel += 20.0
        if self.batteryLevel >= 100 {
            print("Tesla is fully charged")
        }
        else {
            print("Tesla is charging.. batteryLevel: \(self.batteryLevel)")
        }
    }
    
    // Vehicle
    var speed: Double = 0.0
    
    func accelerate() {
        self.speed += 20
        print("Tesla is accelerating. Current speed: \(self.speed) km/h")
    }
}

let myTesla = Tesla()
myTesla.charge()
myTesla.charge()
myTesla.accelerate()
myTesla.stop(vehicle: "Tesla")

/* 출력
 Tesla is charging.. batteryLevel: 80.0
 Tesla is fully charged
 Tesla is accelerating. Current speed: 20.0 km/h
 Tesla is stopped.
 */

정리

위의 예제를 통해 느꼈던점은 아래와 같습니다.

protocol의 역할을 세분화하게 되면서 필요한 기능들만 채택하게 할 수 있고 (여러 프로토콜 상속)

extension을 통해 기본 구현을 제공함으로써 중복될 코드들을 줄일 수 있고,

Swift에서 구조체사용을 권장하듯, 구조체(값 타입)에도 protocol을 통해 상속이 가능하도록 할 수 있다는 장점이 있다.

이전에 protocol 관련 세션을 들었을때

protocol 네이밍을 대부분 ~able (~할 수 있는)로 지어주는게 좋다고 했던것도,

'가능한 하나의 프로토콜이 하나의 기능을 담당하도록 세분화 하라'는 의미가 이번 글을 정리하면서 이해가 됐었습니다.

처음 들었을땐 메서드 하나당 프로토콜을 새로 하나 만드는 모습을 보고 '저렇게 까지 세분화 할 필요가 있나?' 라는 생각이

기능별로 protocol을 만들어두고 필요한것만 쏙쏙 골라 채택해주고 준수해주기만하면 되니

추후 확장성을 고려하면 '해야겠다'는 생각으로 고쳐지게된것 같습니다.

참고

[iOS] Decode 한번 뜯어보자 (feat. container, nestedContainer, decode)

Peppo — Sat, 18 Jan 2025 15:42:21 +0900

아래와 같은 JSON data가 있다고 했을때 어떻게 decoding을 하나요?

{
  "id": 1,
  "name": "John Doe",
  "details": {
    "address": {
      "city": "Seoul",
      "postalCode": "12345"
    },
    "contacts": {
      "email": "john.doe@example.com",
      "phone": "010-1234-5678"
    }
  }
}

최상위로 id, name, details가 있고

details 내부에 address, contacts 가 있고,

address 내부에 city, postalCode,

contacts 내부에 email, phone이 있는 구조입니다.

보통 저는 decoding을 하게되면 아래와 같이 JSO 중괄호 ( { } )를 기점으로 struct를 하나씩 만들어서 관리를 했었습니다.

struct User: Decodable {
    let id: Int
    let name: String
    let details: DetailsInfo
    
    struct DetailsInfo: Decodable {
        let address: AddressInfo
        let contacts: ContactsInfo
    }

    struct AddressInfo: Decodable {
        let city: String
        let postalCode: String
    }

    struct ContactsInfo: Decodable {
        let email: String
        let phone: String
    }
}

오늘은 이 방법 이외에 nestedContainer라는 인스턴스 메서드를 사용한 decode 방법을 알아보려고 합니다.

예를들어 아래와 같은 UserDTO(Data Transfer Object)가 있다고 가정해봅시다.

struct User: Decodable {
    let id: Int
    let name: String
    
    enum UserKeys: String, CodingKey {
        case id
        case name
    }
    
    init(from decoder: Decoder) throws {
        let container = try decoder.container(keyedBy: UserKeys.self)
        
        self.id = try container.decode(Int.self, forKey: .id)
        self.name = try container.decode(String.self, forKey: .name)
    }
}

User struct에 Decodable을 채택해준 후 init()을 해보면 아래와 같이 자동완성이 뜹니다.

init에 파라미터인 decoder는 Decoder 프로토콜을 채택하고 있으며,

아래 프로퍼티 및 메서드를 정의하고 있습니다.

이중 container(keyedBy:) 를 아래 로직로 예를들어 해석을 해보면
container(keyedBy: CodingKeys.self)를 호출하면 *CodingKeys를 채택하는 UserKeys가 갖고 있는 id, name의 key값을 반환합니다.

*CodingKey 란?
encoding과 decoding을 위해 'key'로 사용할 수 있게한 타입

let container = try decoder.container(keyedBy: UserKeys.self)

이후 container의 key들을 디버깅해보면 name과 id가 반환된걸 볼 수 있습니다.

그 다음줄을 봅시다 (decode)

self.id = try container.decode(Int.self, forKey: .id)
self.name = try container.decode(String.self, forKey: .name)

name과, id의 key를 가지고 있는 container (UserKeys container)에 decode(type:, forKey)를 호출하는데,

decode 메서드 선언부는 아래와 같습니다.

type:
파라미터의 type에는 다양한 데이터 타입이 (String, Bool, Int, Double 등) 들어가고,
여기엔 변환하고자 하는 데이터 타입을 넣어줍니다.
key:
container에 저장되어있는 key에 해당하는 값을 decoding해 return합니다.

에러처리는 아래와 같이 되어있습니다.
1. typeMismatch: 타입이 맞지 않는경우
2. keyNotFound: key를 찾을 수 없는 경우
3. valueNotFound: 값을 찾을 수 없는 경우

아래 예제 코드를 분석해보자면

self.id = try container.decode(Int.self, forKey: .id)
self.name = try container.decode(String.self, forKey: .name)

id라는 key의 데이터를 Int 타입으로 decoding후 self.id에 할당
name key의 데이터를 String 타입으로 decoding 후 self.name에 할당 하는게 되겠네요.

이렇게 계층이 하나만있는 경우에는 decode하는 흐름을 파악하기 쉽죠

container에서 decode까지의 흐름은 알았으니,
그럼 좀더 심화해서 아래의 경우처럼 계층이 여러개 있다면?
그리고 아래 JSON에서 city라는 데이터를 가져오고 싶다면?

{
  "id": 1,
  "name": "John Doe",
  "details": {
    "address": {
      "city": "Seoul",
      "postalCode": "12345"
    },
    "contacts": {
      "email": "john.doe@example.com",
      "phone": "010-1234-5678"
    }
  }
}

이런 경우에 사용하는게 nestedContainer 메서드 입니다.

nestedContainer 란?

https://developer.apple.com/documentation/swift/keyedencodingcontainerprotocol/nestedcontainer(keyedby:forkey:)

주어진 key에 대한 key encoding container를 저장하고 반환합니다.

예시를 들면서 하나씩 뜯어봅시다.

CodingKey를 채택하는 Key(enum)가 갖고 있는 case들의 key에 접근합니다
만약 city 값을 decoding해서 가져오고 싶다고 가정하면

city는 아래와 같이 접근해서 가져와야 합니다.
details.address.city

위 예제에서 UserKeys를 통해 container를 만들어 id, name key에 접근할 수 있었듯이
이번엔 details에 접근하기 위해 CodingKey를 채택하고 있는 DetailsKeys 열거형을 하나 만들어 줍시다.

struct User: Decodable {
    let id: Int
    let name: String
    let city: String
    let postalCode: String
    
    enum UserKeys: String, CodingKey {
        case id
        case name
        case details
    }
    
    // 추가
    enum DetailsKeys: String, CodingKey {
        case address
        case contacts
    }
    
    init(from decoder: Decoder) throws {
        let container = try decoder.container(keyedBy: UserKeys.self)
        
        self.id = try container.decode(Int.self, forKey: .id)
        self.name = try container.decode(String.self, forKey: .name)
        
    }
}

UserKeys의 key 중 details에 대한 container를 만들어주기 위해 사용하는게 nestedContainer 입니다.

let detailsContainer = try container.nestedContainer(keyedBy: DetailsKeys.self, forKey: .details)

코드를 해석하자면 아래와 같겠네요.

UserKeys로된 container내부에 container를 만들건데, DetailsKeys의 key 중 details에 해당하는 container를 만들거야

detailsContainer의 key들을 디버깅해보면 아래와 같이 생성된걸 볼수 있습니다.

아직 city에 접근하려면 한단계 더 가야합니다.

city는 address 내부에 있으므로 위에서 진행한 방법과 같이 nestedContainer를 하나 더 만들어줍니다.

struct User: Decodable {
    let id: Int
    let name: String
    let city: String
    let postalCode: String
    
    enum UserKeys: String, CodingKey {
        case id
        case name
        case details
    }
    
    enum DetailsKeys: String, CodingKey {
        case address
        case contacts
    }
    // AddressKeys 추가
    enum AddressKeys: String, CodingKey {
        case city
        case postalCode
    }
    
    init(from decoder: Decoder) throws {
        let container = try decoder.container(keyedBy: UserKeys.self)
        
        self.id = try container.decode(Int.self, forKey: .id)
        self.name = try container.decode(String.self, forKey: .name)
        
        let detailsContainer = try container.nestedContainer(keyedBy: DetailsKeys.self, forKey: .details)
        
        // addressContainer 추가
        let addressContainer = try detailsContainer.nestedContainer(keyedBy: AddressKeys.self, forKey: .address)
        
        // decode한 값 할당 (self.city, self.postalCode)
        self.city = try addressContainer.decode(String.self, forKey: .city)
        self.postalCode = try addressContainer.decode(String.self, forKey: .postalCode)
    }
}

위와 같이 생성 후 디버깅을 해보면 addressContainer가 잘 생성되었고,
decoding 된 값이 self.city에 할당된걸 볼 수 있습니다.

최종 코드는 아래와 같습니다.

struct User: Decodable {
    let id: Int
    let name: String
    let city: String
    let postalCode: String
    let email: String
    let phone: String
    
    enum UserKeys: String, CodingKey {
        case id
        case name
        case details
    }
    
    enum DetailsKeys: String, CodingKey {
        case address
        case contacts
        
    }
    
    enum AddressKeys: String, CodingKey {
        case city
        case postalCode
    }
    
    enum ContactsKeys: String, CodingKey {
        case email
        case phone
    }
    
    init(from decoder: Decoder) throws {
        let container = try decoder.container(keyedBy: UserKeys.self)
        self.id = try container.decode(Int.self, forKey: .id)
        self.name = try container.decode(String.self, forKey: .name)
        
        let detailsContainer = try container.nestedContainer(keyedBy: DetailsKeys.self, forKey: .details)
        
        let addressContainer = try detailsContainer.nestedContainer(keyedBy: AddressKeys.self, forKey: .address)
        self.city = try addressContainer.decode(String.self, forKey: .city)
        self.postalCode = try addressContainer.decode(String.self, forKey: .postalCode)
        
        let contactsContainer = try detailsContainer.nestedContainer(keyedBy: ContactsKeys.self, forKey: .contacts)
        self.email = try contactsContainer.decode(String.self, forKey: .email)
        self.phone = try contactsContainer.decode(String.self, forKey: .phone)
    }
}

느낀점

개인적으로 nestedContainer를 써야겠다고 생각이 들었던 점은
key에 해당하는 value값을 flat하게 접근하기 위한 용도로 사용하면 좋겠다는 생각이 들었습니다.
struct를 사용할경우 User.Details.Address.city 이렇게 타고타고 들어가야 되는점과 비교가 됐던것 같네요.

오늘은 decoder부터 container, nestedContainer까지 decode하는 또 다른 방법과 흐름을 훑어봤습니다.
처음엔 이 코드를 보고 코드양이 많아 '이게 뭐지..' 하면서 한참동안 들여다 봤던 기억이 있는데
막상 하나씩 분석해보니 가독성도 늘고 어떤 흐름으로 decode를 할 수 있는지 배울 수 있었던것 같습니다.
아는만큼 보이는것 같네요.
그동안 사용했던 메서드등도 한번씩 다시봐야겠다는 생각이 들었습니다 :)

참고

1. container
https://developer.apple.com/documentation/swift/decoder/container(keyedby:)

container(keyedBy:) | Apple Developer Documentation

Returns the data stored in this decoder as represented in a container keyed by the given key type.

developer.apple.com

2. decode
https://developer.apple.com/documentation/swift/keyeddecodingcontainer/decode(_:forkey:)-7vj8e

decode(_:forKey:) | Apple Developer Documentation

Decodes a value of the given type for the given key.

developer.apple.com

3. swift decode example

Swift Nested JSON Decoding example

Swift Nested JSON Decoding example. GitHub Gist: instantly share code, notes, and snippets.

gist.github.com

2024 회고

Peppo — Sun, 5 Jan 2025 19:09:19 +0900

개발을 시작하고 벌써 세번째 회고글을 써본다.
지난 1년은 정말 빠르게 지나갔던것 같다.

결혼 이후 생활부터 재취업까지 어떤일이 있었고, 어떤걸 배웠는지 적어보려한다.

2024의 키워드 '선택과 집중'

과연 잘 했을까?
상반기때는 '아니다' 인것 같다.
그치만 하반기는 집중했던 한 해였다.
집중할 수 밖에 없었지만, 덕분에 앱 전체를 리뉴얼 할 수 있는 계기가 되었다.
상반기, 하반기 둘을 나눠서 작성해본다.

회사

6월 권고사직을 끝으로 많은 일들도 있었고, 많이 배웠던것 같다.
마지막은 회사와 나의 가치관 차이로 돌아서게 됐지만, 그래도 불경기속에 iOS 커리어를 시작하게 해준 회사에 감사를 표합니다.
개인적으로는 나를 돌아보는시간, 기술적으로는 한 분야를 깊게 파볼 수 있었던 뜻 깊은 시간이었다.
WebRTC, AVFoundation, RIBs 등 공부할것도 많았고 흔치 않은 기술이다보니 참고할 수 있는부분도 많지 않아 힘들었지만,
그럼에도 해결해야하기 때문에 집요함과 다른 분야의 개발자분들에게 문제를 공유하고 해결해나가는 방법을 배울 수 있었던 회사였던것 같다.
100% 개선하지 못한 아쉬움도 있지만 여러모로 좋은 경험이라 생각한다.
감사하게도 팀원들이 다들 열정적이어서 자체적으로 스터디하는 문화가 있고, 서로 모르는 부분에 대해 공유하고 문제를 해결해나가는 문화가 재밌었고 배울점도 있었던 회사였다고 생각한다.

다시시작

요즘 취업시장이 혹한기다 라는 말을 정말 많이 들었던터라 어느정도 긴장은하고 있었다.
생각만큼 공고도 많이 없었고, 연차도 기본이 5년차 이상인곳들이 많이 늘었다.
내 iOS 경력은 1~2년 정도였고, 많은 회사들의 자격요건에 부합하지 못했다.
지난 회사에서 썼던 기술들과는 조금 거리가 있었고 맞춰나갈 방법을 생각했다.
취업 플랫폼의 모든 구인공고를 훑어보고 한번 추려냈던 회사들, 그 다음순위의 회사들, 여긴 피해야겠다 생각했던 회사들을 정리한 뒤
다음에 들어가고 싶은 회사의 환경을 아래와 같이 추려봤었다.

1. 같은 분야(iOS)에 대해 조언을 구할 동료들이 있는지
2. 개발 문화가 존재하는지
3. 다양한 경험을 해볼 수 있는지
4. 출, 퇴근 왕복 3시간 이내

그리고 공통적인 기술스택 등을 정리하면서 앞으로 취업준비를 어떻게 해나가야할지 리스트업을 했었다.

UI

대다수의 기업은 UIKit이 많았고
UIKit → SwiftUI로 넘어가는 회사
SwiftUI로 프로젝트를 진행하는 회사

비동기처리

async-await
RxSwift
Combine
GCD

아키텍처

MVVM이 압도적으로많았고
MVVM + 클린아키텍처 등 또 여러가지가 있었던걸로 기억한다.

그 밖에,
CI/CD, 모듈화(tuist), TDD 등등 할게 너무 많았고 이걸 다 하기엔 시간이 너무 부족하다는걸 알았다.
그냥 지금 환경에서 할 수 있는것들만 먼저 추려내 사이드프로젝트로 진행해봤다.

A 사이드프로젝트

총 3명의 스터디원들과 시작했던 프로젝트는 각자 회사에서 배울만한 코드들을 해당 프로젝트에 녹여내, 성장하자는 취지로 시작했다.
UIKit, RxSwift, MVC로 작업을 시작했고,
추후 MVVM으로 리팩토링하며 두개의 차이를 비교해보고 회고를 하는 방식으로 마무리를 했다.

B 사이드프로젝트

개인 앱으로 만들었던 BestEats라는 앱을 리뉴얼하자는 취지였다.
iOS 개발을 아무것도 모르고 시작했던 프로젝트라
코드를 보는 내내 '와.. 내가 ..? 내가 이렇게 썼다고..?' 라는 말을 되뇌었던게 기억난다 .. ㅋㅋㅋㅋ
1년 넘게 방치해뒀던 앱을 다시 분석하고 기능을 붙이기보단
싹 뜯어고치는게 더 빠르겠다는 생각이 들어 아래와 같이 바꿨다.

UIKit → SwiftUI
GCD → async-await
UserDefaults → CoreData

그렇게 시작했던 A 사이드프로젝트는 이쯤인가 라는 앱으로 출시되었고,
서울시 공공API를 활용해 버스 현재위치를 추적하고 목적지 도착전에 알림을 받는 시나리오로,
3명의 iOS 개발 스터디원들과 기획, 디자인, 배포까지 경험할 수 있었던 뜻깊은 프로젝트가 되었다.

이때 가장 좋았던 경험은 Dynamic Island 기능 구현을 하기위해 SwiftUI를 다룰줄 알았어야 했는데,
B 사이드프로젝트를 동시에 진행하면서 공부했던 SwiftUI를 여기서도 써볼 수 있었던게 좋았다.

https://apps.apple.com/kr/app/%EC%9D%B4%EC%AF%A4%EC%9D%B8%EA%B0%80/id6736941116

‎이쯤인가

‎서울시 공공API를 활용하여 실시간으로 탑승 중인 버스의 현재 위치를 추적하고, 목적지 도착 전에 미리 알림을 받아보세요. 이제는 도착지 걱정 없이 버스에서 편안하게 시간을 보내세요! 주

apps.apple.com

B 사이드프로젝트 BestEats는 취준 기간동안 주력으로 시간을 썼던 프로젝트였다.
그만큼 여기에 공부시간도 투자를 많이 했고, 이것저것 적용해보면서 동시에 이쯤인가 프로젝트에도 녹여내볼 수 있는 기회가 생겨
iOS 공부를 시작할때 부터 지금까지 개발에 재미를 느끼게 해줬던 프로젝트가 아니었나 싶다.

https://apps.apple.com/kr/app/besteats/id1618130833

‎BestEats

‎배만 채우면 되던 시대는 이제 옛날 얘기!! 한끼를 먹어도 맛있게 먹기를 고민하는 시대 맛있게 먹었던 방법들을 기록하고 나만의 맛집 기록으로 쉽게 찾고 맛있게 먹자! 이런 분들에게 추천

apps.apple.com

취업시장으로

7월부터 10월까지 진행했던 두 가지 프로젝트와 회사의 경험들을 토대로 이력서와 포트폴리오를 작성했고,
하루 루틴은 아래와 같았다.

1. 2~3군데씩 회사 지원
2. 코딩테스트 2문제씩 풀이
3. 사이드프로젝트 진행 및 리팩토링
4. 무조건 카페가기

가급적 회사 지원을 할때 채용관련내용은 채용플랫폼을 통해서 보되, 지원은 회사 공식홈페이지에서 지원했었다.
주 6일동안 3개월 가량 이 생활을 유지했었고, 여름철이라 폭우가 와도 카페는 무조건 갔다.
불편한 환경이 나를 일하게 만들었던것 같다.

첫 한달은 서류광탈 소식만 와다다 들려왔고 불안하기 시작했었다.
(기간이 길어지면 알바라도 하면서 취준을 해야되나? 개발 말고 다른길로 가야하나? 등등)
잡생각이 들때마다 기업 하나 더 지원하고, 리팩토링을 하나 더 했다. (그럼에도 불안함은 사라지지 않았지만..)
한달정도 지났을까 서류광탈하던 소식들은 조금씩 서류합격 소식으로 전해지기 시작했고,
과제도 받아보고, 면접도 볼 수 있는 기회가 생기기 시작했다.
9월 말 부터 정말 바빴던것 같은데 과제 기한이 겹쳐 일주일안에 해야하는 촉박함도 있었고
여러 회사를 지원하다보니 서류합격 연락이 전화로 왔을때 '어떤회사요..?' 라는 말을 했던 기억도 있었다. (지원 리스트들을 보고나서 생각이 났던.. ㅠ)

이후 운이좋게 A 회사의 과제에 합격 후 면접을 보러갔고, 면접관은 총 네 분. 1:4로 진행이 됐었다.
그동안의 프로젝트들, 회사 프로젝트들의 경험들에 관해 얘기했고, 기술면접에 이어 인성면접을 진행하며 그동안 봤던 면접중 가장 분위기를 편하게 만들어주셨던게 인상 깊었던것 같다.
프로젝트 설명을 할 때는 아래와 같은 방식으로 설명했을 때 긍정적인 반응을 보였던것 같다.

'어떤 문제가 있었고 어떻게 해결하려고 했으며 A 방법으로 해봤지만 다시 문제가 생겨 B 방법으로 빠르게 다시 해결했던 경험이 있었다.
그리고 B 방법을 하다가 이런것도 배웠다.'

한시간 좀 넘게 봤던것 같은데 혼은 나가있었지만 시간이 금방 갔다는 생각이 들 정도로 면접경험이 좋았었던것 같다.

그 외에도 다른 과제들을 진행하면서 배워가는점이 꽤 많았던것 같다.
과제 불합격한곳에 피드백 요청을 보내는것도 잊지 않았지만, 지원자가 많은지 일일히 혹은 공정성을 위해 피드백은 줄 수 없다는 답변이 대다수여서 아쉬웠다.

현재

A 회사의 면접을 끝마치고 숨돌릴 틈도 없이 다른 회사의 과제, 다른회사의 면접준비에 정신없었다.
그렇게 일주일 정도 지난 후 A 회사의 합격 및 처우협의 소식들 듣게 되었고 처음으로 '오퍼레터' 라는걸 정식으로 받아봤다.

현재는 오퍼 받은 회사에서 입사해 수습기간중에 있고, 이제 두 달째 근무해보면서 느끼는 점은 기술적 소통이 자유롭다는 점에 가장 만족하고 있는것 같다.
여러 팀이 존재하고 그중 우리 팀원은 20명 정도 되는데 iOS 개발자만 4~5 분이 계셔서 기술적으로 궁금한점이 있으면 왠만하면 친절하게 다들 알려주시려고 했던게 너무 좋았던것 같다.

입사초에 온보딩을 끝마치고 입사지원시 진행했던 과제를 SwiftUI → UIKit으로 컨버팅하는 작업을하면서 사수분의 코드리뷰를 받으며,
몰랐던 노하우들과 여러 피드백 받으면서 성장해나가고 있는것 같다.
아직도 모르는게 많고 페어프로그래밍을 하고있으면 사수분 앞에서 버벅거리기도 하지만 많이 물어보고 남은 한달의 수습기간 동안 잘 해나가보고 싶다.

고로 올해 2025 목표는 아래와 같다.

2025 목표

아래는 2024년 목표였다.

일단 상반기 동안 2024년의 키워드, 선택과 집중은 잘 지키지 못한것 같다.

한 가지에 몰두하기 어려운 상황이었고 고민이 많았던 시기라 정신적으로 많이 힘들었던것 같다.

그래도 이후에 취준을하게 되면서 2개의 사이드 프로젝트를 앱 스토어에 출시하고, 알고리즘 공부도 꾸준히 했었던게 좋았다.

취업후 습관은 조금씩 잡아가는중이다. (출 퇴근길에 책 읽기, 퇴근 후 운동 등)

개인 앱 재출시와 사이드 프로젝트는 수익 창출까진 아니어도 이뤄낸건 정말 잘한것 같다.

올해 내 목표 키워드는 적극성과 적응 이다.
새로운 회사 환경에 적응과 커뮤니티 등에 적극적으로 참여하는걸 목표로 하고싶다.

1. 스터디 그룹 만들기 or 커뮤니티 적극 활동하기

다른 iOS 개발자 코드들을 보면 정말 아직도 배워야할게 많겠다는 생각이 든다.
iOS 공부를 처음시작했을때 들었던 Swift 공식문서 스터디 모임이 있었는데 그 때 봤던 공식문서와
지금 다시보는 공식문서의 느낌은 어떨지 궁금하다.
또 스터디때 좋았던건 현업 개발자분들이 현업에서 사용하는 팁들을 알아갈 수 있었던게 좋았고,
이번에 기회를 만들어서 스터디 그룹을 만들어 진행을 해볼까 한다.

2. 시스템 만들기

최근에 다시본 영화 '포레스트 검프'를 보고 문득 이런 생각이 들었다.
주인공은 지적 장애가 있지만 목표를 향해 한 가지의 일만 꾸준하게 했던부분이 단순하지만 최고의 방법이라 생각한다.
(ex. 달리기, 탁구, 군인)
또 작년에 읽었던 One thing 이라는 책에서도 이런말이 있다.
'단 하나의 일을 정하고 행했던 날을 달력에 표시해라, 표시했던 그 사슬이 끊기지 않게 해라'
운동을하려면 헬스장가기가 아닌 운동화 신기, 개발 공부를하려면 카페가기 등 사소한것부터 시스템을 만들어보자.

3. 운동 배우기

그래도 취준기간동안 그동안 배우고 싶었던 수영도 배웠고 (자유형, 배영, 접영까지는 잘 배운것 같다.)
기회가 된다면 다른 운동들도 더 배워보고 싶다.
수영을 더 배우던지 복싱도 배워보고 싶다. 건강에 투자하는거라면 돈 아끼지 말기!

4. 책 4권 이상 읽기

2024년에는 아래의 책들을 읽었다.


부자아빠 가난한 아빠	사는 동안 한 번은 팔아봐라	아주 작은 습관의 힘	클린코드 (읽는중)

개발 관련 책 외에 다른 분야의 책을 읽는것도 꽤 중요하다고 생각이 들게 해줬던것 같다.
특히 부자 아빠 가난한 아빠는 '근로소득'에 대한 내 생각을 완전 바꿔줬던 책이었다.
모든 경제 관련책을 읽으면 항상 언급되는 책이니 두고두고 다시 읽어봐야겠다.

책을 보면서 항상 얻어가는게 많은것 같다.
올해 읽을 책으론
세이노의 가르침
도파민네이션
일단 이렇게 후보로 있는데 다른 책들도 추천 받아보고싶다.

마지막으로 작년에 나에게 포기하지 않아줘서 고맙다라고 말해주고 싶다.
더 잘하라는말보다 지금처럼만 포기하지말고 꾸준하게 하자.

2024년에는 많은 일들이 있었지만 그 시간에서도 배웠던것만, 좋은것만 기억하도록하자 다 경험이었다.

[iOS] UITableView cell LifeCycle

Peppo — Sun, 22 Dec 2024 00:56:00 +0900

최근 UIKit을 통해 작업할 일이 생겼는데

생각보다 TableView의 활용도가 꽤 많다는걸 느꼈습니다.

오늘은 TableView를 사용한다면 알아야할 것중 하나인 lifeCycle에 대해 블로깅을 해보려고 합니다.

아래 예시의 UI는 code base로 구현합니다.

테스트 해볼 UI는 아래와 같아요

TableView

가장 기본적인 TableView 형태로 만들고나서,

tableView의 delegate, dataSource 프로토콜에서 lifeCycle 역할을 하는 메서드들을 나열해보자면 아래와 같습니다.

UITableViewDelegate

willDisplay

cell이 나타날때 쯤 호출

func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath)

: 테이블 뷰가 특정 행의 셀을 그리려고 할때 delegate에 알립니다.

활용 예시

: 무한 스크롤, 로딩 인디케이터 추가 시

didEndDisplaying

cell이 사라진 후 호출

func tableView(_ tableView: UITableView, didEndDisplaying cell: UITableViewCell, forRowAt indexPath: IndexPath)

: delegate에게 지정된 셀이 테이블에서 제거됐을 경우 알립니다.

활용 예시

: 이미지 다운로드 취소

- cell에 이미지가 있는 경우, 화면에 보여질 cell이 이미지 다운로드를 시작하게 되는데 스크롤을 빠르게하게 되면 사라질 cell은 이미지 다운로드를 취소하도록 구현

UITableViewDataSource

cellForRowAt

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell

: tableView의 특정 위치에 삽입할 cell의 dataSource를 요청 합니다.

여기서 dataSource를 요청 한다는 말이 아래 영상을 보면 이해가 되실겁니다.

row값이 15가 보일때 호출되는 indexPath의 값은 [0, 16] 인걸 보면 알 수 있듯

다음 dataSource를 요청한다는걸 알 수 있습니다.

참고
indexPath의 0번째 index는 section
indexPath의 1번빼 index는 row 입니다.

Cell

init

override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?)

cell을 초기화 하는 부분 입니다.

tableView, collectionView의 경우

일정 부분 cell을 초기화를 한 후 나머지 스크롤로 생성되는 cell들은 이전에 없어진 cell들을 queue에 담아두고 재사용 합니다.

이번에도 아래 영상을 보면 알 수 있듯

일정부분까지만 cell 초기화를 하고 추가로 생성되는 cell은 재사용이 되기때문에 cell init이 호출되지 않는걸 볼 수 있습니다.

prepareForReuse

override func prepareForReuse()

cell init에서 언급했던 재사용 부분 입니다.

처음 cell init이 됐을때는 호출되지 않다가 init 이후 재사용 되는 부분에서는 prepareForReuse 메서드가 호출됩니다.

활용 예시

- UI 초기화

정리를 해보다가 궁금한점이 생겼는데

willDisplay, prepareReuse가 호출되는 시점은 비슷한데 어떤경우에 따라 사용해야 하는지 찾아봤습니다.

willDisplay와 prepareReuse의 차이점?

테스트 해보면서 느꼈던 점을 정리해보자면 아래 표와 같았습니다

	willDisplay	prepareForReuse
호출 시점	cell이 화면에 표시되기 직전	cell이 재사용되기 직전
사용 목적	cell의 최종 상태 업데이트	cell의 이전 상태 초기화
대상 cell	화면에 보이는 모든 cell	재사용되는 cell
주요 작업	데이터 바인딩, UI 업데이트	데이터 초기화

마무리해보자면 TableView LifeCycle은 아래와 같습니다.

순서

cell init
cellForRowAt
(cell이 없어질때) didEndDisplaying cell
willDisplay cell
============ cell init 이후 ==========
prepareForReuese
cellForRowAt
(cell이 없어질때) didEndDisplaying cell
willDisplay cell

UIKit에 대해 많이 접해보지 못해 기본적인 부분을 놓치고 있었는데

이번기회에 메서드별로 테스트도 해보니 어느정도 정리가 되는것 같았습니다.

CollectionView도 비슷한 lifeCycle로 알고 있는데 추후 사용해보고 또 느낀점을 포스팅해봐야겠네요.

아래는 테스트했던 전체 코드 입니다.

⬇️ 전체 코드 ⬇️

import UIKit

class ViewController: UIViewController {
    
    private lazy var tableView = {
        let t = UITableView()
        t.translatesAutoresizingMaskIntoConstraints = false
        t.rowHeight = 56
        t.delegate = self
        t.dataSource = self
        t.register(SomeCell.self, forCellReuseIdentifier: SomeCell.Constants.identifier)
        return t
    }()

    override func viewDidLoad() {
        super.viewDidLoad()
        
        self.setupUI()
        self.setupLayout()
    }

    private func setupUI() {

    }
    
    private func setupLayout() {
        self.view.addSubview(self.tableView)
        
        NSLayoutConstraint.activate([
            self.tableView.topAnchor.constraint(equalTo: self.view.topAnchor),
            self.tableView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor),
            self.tableView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor),
            self.tableView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor),
        ])
    }

}

extension ViewController: UITableViewDelegate {
    
    func tableView(_ tableView: UITableView, willDisplay cell: UITableViewCell, forRowAt indexPath: IndexPath) {
        print("========= willDisplay index: \(indexPath.row)")
    }
    
    func tableView(_ tableView: UITableView, didEndDisplaying cell: UITableViewCell, forRowAt indexPath: IndexPath) {
        print("========= didEndDisplaying index: \(indexPath.row)")
    }
    
}

extension ViewController: UITableViewDataSource {
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 30
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell: UITableViewCell
        
        guard let someCell: SomeCell = tableView.dequeueReusableCell(
            withIdentifier: SomeCell.Constants.identifier,
            for: indexPath
        ) as? SomeCell
        else {
            return UITableViewCell()
        }
        
        print("========= cellForRowAt index: \(indexPath)")
        someCell.setupUI(indexPathRow: indexPath.row)
        cell = someCell
        return cell
    }
    
    
}


final class SomeCell: UITableViewCell {
    
    private lazy var label: UILabel = {
        let v = UILabel()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.font = .boldSystemFont(ofSize: 24)
        v.textColor = .black
        return v
    }()
    
    
    override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        
        print("========= Cell init")
        setupLayout()
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    override func prepareForReuse() {
        super.prepareForReuse()
        print("========= \(#function)")
    }
    
    func setupUI(indexPathRow: Int) {
        self.label.text = "label row index: \(indexPathRow)"
    }
    
    private func setupLayout() {
        self.contentView.addSubview(self.label)
        
        NSLayoutConstraint.activate([
            self.label.centerXAnchor.constraint(equalTo: self.contentView.centerXAnchor),
            self.label.centerYAnchor.constraint(equalTo: self.contentView.centerYAnchor)
        ])
    }
    
}

extension SomeCell {
    
    enum Constants {
        static let identifier: String = "SomeCell"
    }

}

[iOS] URLSession image upload

Peppo — Sun, 24 Nov 2024 22:42:27 +0900

평소 네트워크 통신을 할때 Alamofire를 사용하면서

직접 URLSession을 사용해 이미지 업로드를 구현해보며 내부 동작을 파악하고 싶어

해당 블로깅을 작성해봅니다.

기본적으로 URLSession의 request 헤더 부분에 'Content-Type: application/json'을 사용하게 되는데,

이미지나 대용량 파일 등을 전송하기 위해선 multipart/form-data로 전송하는게 적합 합니다.

multipart/form-data

먼저 application/json | multipart/form-data 각각 request body를 보내는 방법 부터가 다른데 아래를 먼저 보고 가봅시다.

// application/json

let body: [String: Any] = [
    "name": name,
    "content": content
]
        
let requestBody: Data? = try? JSONSerialization.data(withJSONObject: body)
request.httpBody = requestBody

// multipart/form

private func createUploadBody(params: [String: String], boundary: String, imageData: Data) -> Data {
    var body: Data = Data()
    let lineBreak: String = "\r\n"
        
    for (key, value) in params {
        body.append("--\(boundary)\(lineBreak)".data(using: .utf8)!)
        body.append("Content-Disposition: form-data; name=\"\(key)\"\(lineBreak)\(lineBreak)".data(using: .utf8)!)
        body.append("\(value)\(lineBreak)".data(using: .utf8)!)
    }
        
    // image 파일
    let fileName: String = "test.jpeg"
    let mimeType: String = "image/jpeg"
    body.append("--\(boundary)\(lineBreak)".data(using: .utf8)!)
    body.append("Content-Disposition: form-data; name=\"image\"; filename=\"\(fileName)\"\(lineBreak)".data(using: .utf8)!)
    body.append("Content-Type: \(mimeType)\(lineBreak)\(lineBreak)".data(using: .utf8)!)
    body.append(imageData)
    body.append("\(lineBreak)--\(boundary)--\(lineBreak)".data(using: .utf8)!)
        
    return body
}

body를 만드는 방법이 다르고 뭔가 복잡해 보이지만

multipart/form 방식 통신 규약에 대해 알고가면 조금 정리가 될겁니다.

위 createUploadBody 메서드로 body를 만들어 서버에 전송하면 아래와 같은 형태가 됩니다

https://m.boostcourse.org/web326/lecture/59008

POST /test.html HTTP/1.1
Host: example.org
Content-Type: multipart/form-data;boundary="boundary" // 1

// name
--boundary // 2
Content-Disposition: form-data; name="name"

// content
--boundary
Content-Disposition: form-data; name="content" 

// imageFile
// 3
Content-Disposition: form-data; name="image"; filename="test.jpeg" 
Content-Type: image/jpeg

1. Content-Type 헤더부분에 boundary 는 구분자 라고 생각하시면 됩니다.

해당 boundary 값으로 어디가 시작점이고 어디가 다음데이터 혹은 마지막 지점인지 구분할 수 있게 해주는 역할을 합니다.

대부분 boundary 값은 UUID() 값을 통해 고유한 값을 지정합니다 (request는 여러번 보내기 때문에 고유한 값을 지정해 구분이 필요하기 때문)

2. 1번에서 설명한것 처럼 boundary 값으로 시작점을 나타냅니다.

3. 'name', 'content'와 다르게 이미지 파일 업로드의 경우엔 mimeType, filename을 기입해줍니다.

image파일을 업로드할거니 mimeType은 image/jpeg가 되겠죠

filename은 말 그대로 파일 이름을 넣어주시면 됩니다.

참고

body를 만들때 값이 하나라도 맞지 않거나, 띄어쓰기, 줄바꿈이 다를 경우 통신이 되지 않습니다.
꼼꼼히 아래 규약을 잘 지키고 있는지 확인하셔야 합니다.

1. boundary로 구분을 잘해주고 있는지
2. 'lineBreak' ("\r\n")이 잘 되어있는지
3. data를 append 해줬는지
ex) Content-Disposition: form-data; name=\"\(key)\"\(lineBreak)\(lineBreak)
// 데이터 추가
4. 파일의 경우) 파일이름이 있는지, mimeType을 지정했는지
5. 데이터의 끝을 나타내는 경계값을 추가하여 데이터의 마지막 부분을 잘 구분 하고 있는지

아래는 사용 예시 입니다.

// UIImage를 Data로 전환
// self.selectedImage: UIImage
// guard let imageData = self.selectedImage?.jpegData(compressionQuality: 0.8) else { return }

func addTodo(
        name: String,
        content: String,
        imageData: Data,
        completion: @escaping (Result<SomeModel, Error>) -> Void
    ) {
        var urlComponents = URLComponents()
        urlComponents.scheme = "http"
        urlComponents.host = "localhost"
        urlComponents.port = 8080
        urlComponents.path = "/testPath"
        
        guard let url = urlComponents.url
        else {
            completion(.failure(NetworkError.invalidURL))
            return
        }
        
        // request
        var request: URLRequest = .init(url: url)
        request.httpMethod = "POST"
        // header
        let identifier: String = UUID().uuidString
        let boundary: String = "Boundary-\(identifier)"
        request.setValue("application/json", forHTTPHeaderField: "Content-Type")
        request.setValue("multipart/form-data; boundary=\(boundary)", forHTTPHeaderField: "Content-Type")
        
        let body: Data = createUploadBody(
            params: [
                "name": name,
                "content": content
            ],
            boundary: boundary,
            imageData: imageData
        )
        request.httpBody = body
        
        let task = URLSession.shared.uploadTask(
            with: request,
            from: body,
            completionHandler: { data, response, error in
                if let error = error {
                    completion(.failure(error))
                    return
                }
                if let data = data {
                    do {
                        let decodedData: SomeModel = try JSONDecoder().decode(SomeModel.self, from: data)
                        print(#function, "success: \(decodedData)")
                        completion(.success(decodedData))
                    }
                    catch {
                        completion(.failure(error))
                    }
                }
            })
        
        task.resume()
    }
    
    
    private func createUploadBody(params: [String: String], boundary: String, imageData: Data) -> Data {
        var body: Data = Data()
        let lineBreak: String = "\r\n"
        
        for (key, value) in params {
            body.append("--\(boundary)\(lineBreak)".data(using: .utf8)!)
            body.append("Content-Disposition: form-data; name=\"\(key)\"\(lineBreak)\(lineBreak)".data(using: .utf8)!)
            body.append("\(value)\(lineBreak)".data(using: .utf8)!)
        }
        
        // image 파일
        let fileName: String = "test.jpeg"
        let mimeType: String = "jpeg"
        body.append("--\(boundary)\(lineBreak)".data(using: .utf8)!)
        body.append("Content-Disposition: form-data; name=\"imageFile\"; filename=\"\(fileName)\"\(lineBreak)".data(using: .utf8)!)
        body.append("Content-Type: image/\(mimeType)\(lineBreak)\(lineBreak)".data(using: .utf8)!)
        body.append(imageData)
        body.append("\(lineBreak)--\(boundary)--\(lineBreak)".data(using: .utf8)!)
        
        return body
    }

Alamofire의 경우도 uploadTask를 사용하는걸 볼 수 있습니다.

public class UploadRequest: DataRequest {

    }

    // ...

    override func task(for request: URLRequest, using session: URLSession) -> URLSessionTask {
        // ...
        switch uploadable {
        case let .data(data): return session.uploadTask(with: request, from: data)
        case let .file(url, _): return session.uploadTask(with: request, fromFile: url)
        case .stream: return session.uploadTask(withStreamedRequest: request)
        }

    // ...
}

지난 블로깅에서 Kingfisher를 분해해보며

그동안 당연하게 사용하고있던 라이브러리들의 내부구조가 어떻게 되어있는지 파악하면서

동작원리를 알아가는데 배워가는게 많은것 같습니다.

이번 Alamofire를 통해 업로드 하는기능을 URLSession으로 직접 구현해보면서

다시한번 Alamofire 내부구조도 확인할 수 있었고,

막 가져다 쓰기보단 짬내서라도 하나씩 파악하면서 공부하는 습관을 길러야겠다는 생각이 들었습니다.

참고

1. https://developer.mozilla.org/ko/docs/Web/HTTP/Methods/POST

2.https://developer.apple.com/documentation/foundation/url_loading_system/uploading_data_to_a_website#2923850

3. https://sandclock-itblog.tistory.com/244

[iOS] Tuist App Extension (feat. WidgetExtension)

Peppo — Fri, 25 Oct 2024 17:01:53 +0900

최근 LiveActivity를 적용해보면서 App Extension 경험과

Tuist에 녹여내는 과정중에 삽질을 많이 하게 돼 복습도 할겸 블로깅을 해보려고 합니다!

겪었던 문제

1. Tuist를 통해 Widget Extension을 추가해야 함

2. Widget Extension에서도 Asset을 따로 만들어야 함

일반적으로는 App Extension의 경우 target membership을 아래와 같이 체크하면 해결 되는데,

tuist를 적용하게 되면 아래와 같은 방법으로 추가해줘야 합니다.

먼저 Project.swift 파일을 열기위해 아래 명령어를 터미널에 입력해주시고

tuist edit

Project 객체에 target을 추가해줍니다.

// Project.swift

let project = Project(
    name: appName,
    targets: [
        // App target
        .target(
            name: appName,
            destinations: .iOS,
            product: .app,
            
            // etc..
            
            dependencies: [
              // ... 
              .target(name: "WidgetExtension") // 1. 의존성 추가
            ]
        ),
        // 2
        // Extension target
        .target(
            name: "WidgetExtension",
            destinations: .iOS,
            product: .appExtension, // extension
            bundleId: bundleId + ".WidgetExtension",
            deploymentTargets: deploymentTarget,
            infoPlist: .extendingDefault(with: [
                "CFBundleDisplayName": "$(PRODUCT_NAME)",
                "UIUserInterfaceStyle": "Light",
                "NSExtension": [
                    "NSExtensionPointIdentifier": "com.apple.widgetkit-extension"
                ],
            ]),
            sources: "WidgetExtension/Sources/**",
            resources: "WidgetExtension/Resources/**",
            settings: configureSettings(with: .appExtension)
        ),
    ],
    additionalFiles: ["README.md"],
    resourceSynthesizers: [
        .assets(),
        .fonts()
    ]
)

1. app target의 dependencies에 WidgetExtension의 의존성을 추가해줍니다

2. target을 하나 추가하여 appExtension을 추가해줍니다.

새롭게 만들어진 target의 경우 infoPlist, sources, resources 등 다시 만들어줘야 하는데요.

App target에서 했던것 처럼 똑같이 추가를 해주면 됩니다.

+ 추가

공통 모듈 생성

추가된 Widget Extension의 경우도 Asset을 따로 만들어줘야 하는데요.

저는 공통으로 사용되는 Asset이나 코드가 있는 경우 공통으로 관리되는 모듈을 하나 더 만드는 방법으로 구현했습니다.

다시 Project.swift를 열어주시고

let project = Project(
    name: appName,
    targets: [
        .target(
            name: appName,
            destinations: .iOS,
            product: .app,
            bundleId: bundleId,
            deploymentTargets: deploymentTarget,
            infoPlist: .extendingDefault(with: infoPlist),
            sources: ["App/Sources/**"],
            resources: ["App/Resources/**"],
            dependencies: [
                .external(name: "RxSwift"),
                .external(name: "RxCocoa"),
                .external(name: "Alamofire"),
                .external(name: "CoreXLSX"),
                .external(name: "SwiftyJSON"),
                .external(name: "SkeletonView"),
                .target(name: "Common"),             // 의존성 추가
                .target(name: "WidgetExtension"),    // 의존성 추가
            ],
            settings: configureSettings(with: .app)
        ),
        .target(
            name: "WidgetExtension",
            destinations: .iOS,
            product: .appExtension,
            bundleId: bundleId + ".WidgetExtension",
            deploymentTargets: deploymentTarget,
            infoPlist: .extendingDefault(with: [
                "CFBundleDisplayName": "$(PRODUCT_NAME)",
                "NSExtension": [
                    "NSExtensionPointIdentifier": "com.apple.widgetkit-extension"
                ],
            ]),
            sources: "WidgetExtension/Sources/**",
            dependencies: [
                .target(name: "Common")           // 의존성 추가
            ],
            settings: configureSettings(with: .appExtension)
        ),
        .target(
            name: "Common", // 공통으로 사용해야할 코드가 있을 경우 여기에 코드 분리
            destinations: .iOS,
            product: .framework,
            productName: "Common",
            bundleId: bundleId + ".Common",
            deploymentTargets: deploymentTarget,
            sources: "Common/Sources/**"
        ),
    ]
)

위와 같이 'Common' 이라는 모듈을 만들었습니다.

폴더 구조는 아래와 같아요.

폴더구조

Usage

공통으로 사용하는 framework (Common)

// Common.swift

import ActivityKit

public struct WidgetExtensionAttributes: ActivityAttributes {
    public struct ContentState: Codable, Hashable {
        // Dynamic stateful properties about your activity go here!
        public var busNumber: Int
        public var currentBusStop: String
        public var stopLeft: Int
        public var totalStop: Int
        
        public init(busNumber: Int, currentBusStop: String, stopLeft: Int, totalStop: Int) {
            self.busNumber = busNumber
            self.currentBusStop = currentBusStop
            self.stopLeft = stopLeft
            self.totalStop = totalStop
        }
    }

    // Fixed non-changing properties about your activity go here!
    public var currentBusStopInfo: String
    
    public init(currentBusStopInfo: String) {
        self.currentBusStopInfo = currentBusStopInfo
    }
}

NOTE

struct, 변수들을 public 및 초기화(init)시켜줘야 다른 파일에서도 import해서 사용할 수 있습니다.

public을 붙이는 이유는 접근제어자 를 참고해주세요~!

사용방법은 아래와 같습니다.

저는 WidgetExtensionAttributes를 App, WidgetExtension 두 군데에서 다 사용하기 위해 Common 모듈에 따로 추가했습니다.

[App] LiveActivitiyManager

[WidgetExtension] WidgetExtensionLiveActivity

이외에도 Color, Font 등 각 모듈에서 공통으로 사용하는게 있다면 한곳에서 관리하고 가져오는 방법으로 구현하도록 했습니다.

물론 이 방법이 답은 아니라고 생각합니다.

만약 다른 모듈에서 Color가 하나만 필요할 경우에도 Common 모듈을 import 해야할까? 라는 의문이 생기게 되네요.

이런 경우는 따로 import 하지않고 해당 모듈에서만 필요한 Color를 사용한다던지 할것 같습니다.

이 부분은 좀더 익숙해져보고 다른분들에게 조언을 한번 구해보고 수정해보도록 하겠습니다. :)

오늘은 LiveActivity를 적용해보면서 아래의 방법들에 대해 배워갈 수 있었던것 같습니다.

1. Widget Extension을 적용하는 방법

2. tuist와 같이 사용하는 방법,

3. 공통으로 사용하는 경우 하나의 framework로 관리하는 방법

하나씩 tuist 기능을 알아가면서 일단은 정리하고 있지만 추후 새롭게 알게 되는게 있으면 수정하도록 하겠습니다.

참고

https://github.dev/Saik0s/BackgroundExperiments/blob/8ef3291d77f31a0aa95c3b8bda59a1bbcd86d6d7/Project.swift#L65

[iOS] 고해상도 이미지 다운시 성능 개선 (Image DownSampling)

Peppo — Fri, 11 Oct 2024 11:48:46 +0900

URL을 통해 여러 이미지를 받아오는 작업 많이 해보셨을 겁니다.

하지만 해당 이미지 하나당 크기가 엄청 크다면?

오늘은 위와 같이 큰 여러개의 이미지를 다운받아야 하는경우 사용자 경험 개선과 과부하되는 메모리 문제에 대해 해결하는 방법

다운 샘플링에 대해 블로깅 해보려고 합니다.

먼저 서론에서 언급했던 상황에서의 메모리는 아래와 같습니다.

이미지 사이즈가 큰 경우 여러개의 이미지를 받아올 때

이미지를 불러오는데도 당연히 오래걸리고

스크롤 했을때 버벅였던 현상이 있었습니다.

그 이유는 WWDC18 - Momory Deep Dive에서 나옵니다.

메모리 사용량은 파일 크기가 아니라 이미지의 사이즈와 관련이 있습니다.

이미지의 경우 메모리 사용량은 width(너비), height(높이)에 의해 결정이 되는데요.

위와 같은 상황에서도 실제로 이미지 하나당 4000 * 3000 이런식으로 이미지 크기가 어마어마 했습니다.

문제 접근 방식

해당 문제에 대해 고민은 했던 내용은

'모바일에 보여질거고, 이미지인데 굳이 사이즈가 저렇게 크게 필요할까?'

'최적화된 이미지 크기로 바꿀 순 없을까?'

였습니다.

여러 검색결과 다운샘플링(downsampling) 이라는 키워드를 접할 수 있었습니다.

사전지식

들어가기전에 사용자가 사진을 보게되는 과정을 보고 갑시다. (이미지가 render 되기까지 과정)

(UIImage) Image Load
Data Buffer > Image Buffer로 Decode

즉, UIImageView는 말 그대로 View일 뿐이고,

UIImage가 Load하는 과정에서 Data Buffer로된 이미지를 Image Buffer로 디코딩하게 되며

이에따라 사용자가 사진을 볼 수 있게 됩니다.

메모리 사용량이 늘어나는 이유?

여기서 메모리 사용량이 늘어나는 이유는 UIImage가 디코딩된 이미지를 갖고 있기 때문인데요.

이를 해결하기 위해 디코딩되기 전에 이미지 데이터를 축소시키는 방법을 downsampling이라고 합니다.

downsampling의 과정은 아래 그림과 같아요.

다운샘플링 과정 (downsampling)

기존 이미지 로그 과정에서 decode 이전에 한 단계가 더 생겼죠

이 부분에서 이미지 데이터를 축소시킨 후 디코딩 합니다.

아래는 WWDC에서 제공되는 다운샘플링 코드입니다.

func downsample(data: Data, to size: CGSize, scale: CGFloat) -> UIImage? {        
    let imageSourceOptions = [kCGImageSourceShouldCache: false] as CFDictionary
	guard let imageSource = CGImageSourceCreateWithData(data as CFData, imageSourceOptions) else {
            return nil
        }
        
    let maxDimension = max(size.width, size.height) * scale
    let downsampleOptions = [
      kCGImageSourceCreateThumbnailFromImageAlways: true,
      kCGImageSourceShouldCacheImmediately: true,
      kCGImageSourceCreateThumbnailWithTransform: true,
      kCGImageSourceThumbnailMaxPixelSize: maxDimension
    ] as CFDictionary
    
    guard let downsampledImage = CGImageSourceCreateThumbnailAtIndex(imageSource, 0, downsampleOptions) else {
        return nil
    }

    return UIImage(cgImage: downsampledImage)
}

코드를 하나씩 뜯어봅시다

ImageSourceOptions

이미지 소스 생성시 캐시를 사용할지 결정

ImageSource

이미지 데이터와 위 ImageSourceOptions에서 설정한대로 CGImageSource 생성

CGImageSource
이미지 데이터를 읽기 위해 사용되는 opaque(불투명) 타입
이미지 데이터를 load하는데 필요한 데이터버퍼 관리 및 사용가능 한 이미지로 변환하기 위해 해당 데이터에 대한 작업 수행

maxDimension

축소할 이미지의 최종 픽셀 설정

kCGImageSourceCreateThumbnailFromImageAlways

항상 imageSource가 원본 이미지를 썸네일로 만들지 결정

kCGImageSourceShouldCacheImmediately

이미지 생성 시 이미지 디코딩 및 캐싱을 수행할지 여부

kCGImageSourceCreateThumbnailWithTransform

이미지의 방향과 가로, 세로 비율에 맞게 조정할지 여부

kCGImageSourceThumbnailMaxPixelSize

썸네일 최대 픽셀사이즈 설정

CGImageSourceCreateThumbnailAtIndex

imageSource의 해당 index에 대해 썸네일 생성 (다운샘플링 이미지)

위와 같이 설정한 후 다운샘플링 적용 전, 후 차이를 살펴보겠습니다.

상황

List (tableView)에서 여러개의 이미지를 스크롤하면서 받아오는 상황

다운샘플링 적용 전	다운샘플링 적용 후

스크롤 할때 버벅임과 메모리차이가 확연하게 나는걸 볼 수 있습니다.

+ 추가

실제로 Kingfisher에서도 Downsapling 기능을 지원합니다

KFImage(URL(string: urlString))
            .resizable()
            .placeholder { 
                ProgressView()
            }
            .cancelOnDisappear(true)
            .cacheMemoryOnly()
        // MARK: - 성능문제 개선 (고해상도 이미지의 경우 썸네일만 먼저 받아오도록)
            .setProcessor(DownsamplingImageProcessor(size: CGSize(width: 100, height: 100)))
            .onFailureImage(KFCrossPlatformImage(systemName: NameSpace.ImageName.photo))

processor에서 DownsamplingImageProcessor를 이용해 다운샘플링을 하는 과정인데요.

해당 빌트인 메서드를 타고 들어가보면

WWDC에서 사용하던 코드 그대로 사용중인걸 볼 수 있습니다.

오늘은 다운샘플링에 대해 정리해봤는데

여러모로 꼭 필요한 기능인것 같다는 생각이 들었습니다.

WWDC를 주기적으로 봐야겠다는 생각도 들었고,

이런 기능들 하나하나 배워나가면서 사용자경험에 좋은 영향을 줄 수 있다면

선택이 아닌 필수라는 생각이 들었습니다 :)

참고

1. https://developer.apple.com/videos/play/wwdc2018/416/ (17:58~)

2. https://felix-mr.tistory.com/11

3. https://velog.io/@dev_jane/UICollectionView-%EC%9D%B4%EB%AF%B8%EC%A7%80-%EC%B2%98%EB%A6%AC-downsampling

[iOS] Tuist (feat. xcproj 충돌)

Peppo — Mon, 2 Sep 2024 16:50:06 +0900

협업을 하다보면 xcodeproj, xcworkspace 에서 충돌이 나는 문제를 자주 겪어볼텐데요.

저도 아래 사진처럼 일일히 충돌나는부분을 수정하느라 몇시간동안 삽질을 했었습니다..

대환장파티

충돌을 해결할 수 있는 툴은 몇가지가 있지만

그 중에서 요즘 모듈화로 잘 알려진 Tuist라는 툴을 사용해보면서 정리를 해보려고 합니다.

모듈화는 추후 차근차근 스터디해보고 업데이트 할 예정입니다.

오늘은 세팅하는것까지만!

그럼 Tuist에 대해 한번 정리해보겠습니다.

블로깅 시점 (24.09.02)

Tuist 버전은 4.25.0 입니다

알고가기

1. Tuist를 사용하게 되면 기존에 사용하던 xcodeproj, xcworkspace 파일이 필요없습니다.

프로젝트 설정하고 적용을하면 새로 만들어주기 때문이에요.

2. git 과 비슷한 느낌

스터디를 해보면서 느낀점은 CLI 명령어를 통해

수정하고, 업데이트하고 적용하는 방식이었습니다.

앞으로 아래 명령어를 자주 사용하게 될거에요

// 수정
tuist edit

// 업데이트
tuist install

// 적용 및 프로젝트 파일 생성
tuist generate

설치

mise라는 툴을 사용해서 tuist를 설치해줍니다.

mise가 설치 되어있지 않다면 여기서 설치

mise가 설치 되어있다면 terminal에 아래 명령어 입력

mise install tuist            // 현재버전 설치
mise install tuist@x.y.z      // 특정버전 설치
mise install tuist@3          // 3.x버전 설치

프로젝트 생성

Tuist를 적용하기 위해서 먼저 빈 폴더가 필요합니다.

터미널에서 아래와 같이 입력

mkdir TuistStudy // 프로젝트이름 
cd TuistStudy    // 이동해주시고

또는 Finder에서 그냥 빈 폴더 만드셔도 됩니다.

아래 명령어를 입력해주시면

tuist init

기본적으로 폴더들이 세팅됩니다.

하나씩 뜯어볼까요

Tests

Test코드 관련된 파일들을 여기에 넣으면 될것 같아요

Resources

Assets, Fonts 와 같은 종류들이 모여있는 곳입니다.

추후 블로깅하겠지만 이곳에 Color, Image, Font 등 Namespace로 알아서 정리되어서 쏙쏙 뽑아 쓰실 수 있습니다.
(하드코딩으로 값을 가져올 필요없이요)

Sources

나머지 소스코드들이 이곳에 들어갑니다.
View, ViewModel, Model 등 나누기 나름일것 같아요

Project | Package

Project.swift
- 해당 파일에서 프로젝트 세팅을 합니다. Tuist를 사용하면서 가장 많이 손 볼곳이 될거에요
Package.swift
- 이름 그대로 패키지를 관리하는 파일입니다.
~~config는 추후 스터디후 블로깅하겠습니다.~~

여기까지 하고 아래 명령어를 입력해줍시다.

tuist generate

아래 Xcode 화면이 잘 뜨신다면 잘 따라오고 계신겁니다!

Project 세팅

이제 Project 세팅을 해서 비어있는 값들을 채워주고, 원하는 세팅으로 바꿔볼겁니다.

아래 명령어를 입력해주세요

tuist edit

그럼 Manifests가 뜨는데 Project.swift를 열어줍시다

Project 부분도 하나씩 알아봅시다

import ProjectDescription

let project = Project(
    name: "프로젝트이름",                    // 프로젝트 이름
    organizationName: "OrganizationName", // 조직 이름
    settings: nil,                        // 다른 프로젝트 설정을 지정할 수 있음.
    targets: [                            // 프로젝트와 관련된 대상 목록
      .target(                             
         name: projectName,               // 앱 이름
         platform: .iOS,                  // 제공하는 플랫폼 (iOS, iPad 등)
         product: .app,                   // product 용도 (app, bundle, frmaework 등)
         bundleId: "",                    // 번들 ID
         infoPlist: .default,             // infoPlist 경로
         sources: ["TuistStudy/Source/**"], // source 디렉터리에 있는 모든 source 파일을 지정 (** = 와일드 카드 패턴 → 하위 모든 경로의 파일들 포함)
         resources: "TuistStudy/Resources/**",
         dependencies: [],                // 외부 프레임워크의 종속성을 여기에 추가
         settings: nil                    // 다른 설정을 지정하는데 사용
      )
    ]
)

저는 아래와 같이 작성했어요

import ProjectDescription

let appName: String = "TuistStudy"
let bundleId: String = "com.peppo.tuistStudy"
let infoPlist: [String: Plist.Value] = [
    "UILaunchScreen": [
        "UIColorName": "",
        "UIImageName": "",
    ],
]

let project = Project(
    name: appName,
    targets: [
        .target(
            name: appName,
            destinations: .iOS,
            product: .app,
            bundleId: bundleId,
            infoPlist: .extendingDefault(with: infoPlist),
            sources: ["TuistStudy/Sources/**"],
            resources: ["TuistStudy/Resources/**"],
            dependencies: [
                // 추후 라이브러리 아래와 같이 추가 (Package.swift 에도 수정필요)
//                .external(name: "Alamofire")
            ]
        ),
        .target(
            name: "TuistStudyTests",
            destinations: .iOS,
            product: .unitTests,
            bundleId: "io.tuist.TuistStudyTests",
            infoPlist: .default,
            sources: ["TuistStudy/Tests/**"],
            resources: [],
            dependencies: [.target(name: "TuistStudy")]
        ),
    ]
)

Tuist는 Swift로 작성할 수 있기 때문에 상수, 함수 등으로 처리할 수 있습니다.

Project.swift는 이정도로 작성해두고 이제 적용을 해봅시다

적용 명령어는

tuist generate

잘 적용이 됐다면 Tuist 관리하에 프로젝트 파일들이 다시 생성됩니다.

실패시에는 문제되는 부분을 아래와 같이 잘 알려주기 때문에 해당 부분을 수정한다음 tuist generate 해주면 됩니다.

(아래 원인은 organizationName, settings의 값이 비어있었고, product에 불필요한 ' , ' 가 있었습니다.)

실패시 뜨는 로그

프로젝트 진행도중 Tuist 적용할 때 폴더세팅

저는 프로젝트 진행중 Tuist 적용하고 있었는데

View, ViewModel, Model 등 여러가지 폴더들을 Sources 경로에 다 넣어줬습니다. (드래그앤드롭)

폴더구조들을 아래와 같이 세팅해줬고

Sources 폴더구조

적용을 해줍니다.

tuist generate

그럼 아래와 같이 Sources 폴더 안에 싹 정리가 됩니다.

나중에 역할별로 더 모듈화도 해볼 예정이에요. (그건 추후 블로깅!)

Project 파일 세팅했을때 Sources/** 로 했기때문에 Sources 폴더내부에 알아서 정리가 되는 모습입니다~!

Tuist는 계속 버전이 업데이트 되는만큼 변화도 많습니다.

처음엔 레퍼자료들을 찾는데 버전이 달라서 없는 프로퍼티들도 꽤많아 고생을 했던 기억이있네요.

다시 한번 느낍니다 공식문서의 중요성을..

그만큼 공식문서에 참고할만한 example 깃헙들도 제공해주고 있으니 잘 찾아보면서 스터디하면 좋을것 같습니다.

협업간 충돌을 피하기위해 스터디하고 있지만

생각보다 제공해주는 매력적인 기능들이 많은것 같은데

하나씩 정리해보면서 추가적으로 블로깅 해보도록 하겠습니다 :)

참고

1. https://docs.tuist.io/

What is Tuist? | Tuist

docs.tuist.io

2. https://www.kodeco.com/24508362-tuist-tutorial-for-xcode (요건 참고만 하세요 버전이 다릅니다.)

Tuist Tutorial for Xcode

Learn how to use Tuist to create and manage complex Xcode projects and workspaces on-the-fly.