[swift] RxDataSources를 사용한 유저 인증 처리 방법

28 Nov 2023

swift

이 포스트에서는 RxDataSources를 사용하여 유저 인증을 처리하는 방법에 대해 알아보겠습니다. RxDataSources는 iOS 앱에서 테이블뷰와 콜렉션뷰를 구성하는 데 사용되는 ReactiveX 기반의 데이터 소스 라이브러리입니다. 이를 활용하여 유저 인증과 관련된 프로세스를 실시간으로 처리할 수 있습니다.

1. 의존성 추가

먼저, RxDataSources를 프로젝트에 추가해야 합니다. Cocoapods를 사용하는 경우, Podfile에 다음 코드를 추가하고 pod install 명령을 실행하여 의존성을 설치할 수 있습니다.

pod 'RxDataSources'

2. 인증 처리 로직 구현

유저 인증 처리 로직을 구현하기 위해 먼저, User라는 모델 객체를 정의합니다. 이 객체는 유저의 이름과 이메일 주소를 저장하는 역할을 합니다.

struct User {
    let name: String
    let email: String
}

다음으로, 유저가 인증되었을 때의 화면을 구성하는 LoggedInViewController를 만듭니다. 이 화면에는 유저의 이름과 이메일 주소가 표시되어야 합니다.

import UIKit
import RxSwift
import RxCocoa

class LoggedInViewController: UIViewController {

    @IBOutlet weak var nameLabel: UILabel!
    @IBOutlet weak var emailLabel: UILabel!
    
    var user: User!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        nameLabel.text = user.name
        emailLabel.text = user.email
    }
}

마지막으로, 로그인 화면을 구성하는 LoginViewController를 생성합니다. 이 화면에는 유저의 이름과 이메일 주소를 입력하는 텍스트필드와 로그인 버튼이 포함되어 있습니다.

import UIKit
import RxSwift
import RxCocoa

class LoginViewController: UIViewController {

    @IBOutlet weak var nameTextField: UITextField!
    @IBOutlet weak var emailTextField: UITextField!
    @IBOutlet weak var loginButton: UIButton!
    
    let disposeBag = DisposeBag()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // 로그인 버튼의 탭 이벤트를 옵저버블로 변환
        let loginTap = loginButton.rx.tap.asObservable()
        
        // nameTextField와 emailTextField의 텍스트를 옵저버블로 변환
        let nameObservable = nameTextField.rx.text.orEmpty
        let emailObservable = emailTextField.rx.text.orEmpty
        
        // 인증 처리를 위해 이름과 이메일 정보를 다음 화면으로 전달
        loginTap
            .withLatestFrom(Observable.combineLatest(nameObservable, emailObservable))
            .map { (name, email) in
                User(name: name, email: email)
            }
            .bind { [weak self] user in
                self?.showLoggedInScreen(user: user)
            }
            .disposed(by: disposeBag)
    }
    
    func showLoggedInScreen(user: User) {
        let storyboard = UIStoryboard(name: "Main", bundle: nil)
        if let loggedInViewController = storyboard.instantiateViewController(withIdentifier: "LoggedInViewController") as? LoggedInViewController {
            loggedInViewController.user = user
            navigationController?.pushViewController(loggedInViewController, animated: true)
        }
    }
}

3. 테이블뷰 데이터 소스 구성

TableView에 사용할 데이터 소스를 구성하기 위해 RxTableViewSectionedReloadDataSource를 사용합니다. 이 데이터 소스는 User 객체를 섹션으로 나타내며, name 속성을 표시합니다.

import UIKit
import RxSwift
import RxDataSources

struct SectionModel {
    var items: [User]
}

extension SectionModel: SectionModelType {
    typealias Item = User
    
    init(original: SectionModel, items: [User]) {
        self = original
        self.items = items
    }
}

class UsersTableViewController: UITableViewController {
    
    let disposeBag = DisposeBag()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        tableView.register(UITableViewCell.self, forCellReuseIdentifier: "Cell")
        
        // 목업 데이터
        let users: [User] = [
            User(name: "John Doe", email: "john@example.com"),
            User(name: "Jane Smith", email: "jane@example.com"),
            User(name: "Mike Johnson", email: "mike@example.com")
        ]
        
        // 테이블뷰 데이터 소스 생성
        let dataSource = RxTableViewSectionedReloadDataSource<SectionModel>(configureCell: { (_, tableView, indexPath, user) in
            let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
            cell.textLabel?.text = user.name
            return cell
        })
        
        // 사용자 데이터를 섹션으로 변환
        let sections = [SectionModel(items: users)]
        
        // 데이터 소스를 테이블뷰에 바인딩
        Observable.just(sections)
            .bind(to: tableView.rx.items(dataSource: dataSource))
            .disposed(by: disposeBag)
    }
}

결론

이제 RxDataSources를 사용하여 유저 인증 처리를 효율적으로 구현하는 방법을 살펴보았습니다. 이러한 방식으로 데이터 소스를 구성하면 유저 인증 정보를 테이블뷰나 콜렉션뷰와 같은 UI 요소에서 실시간으로 업데이트할 수 있습니다. 이를 통해 더 좋은 사용자 경험과 손쉬운 유지보수를 제공할 수 있습니다.

참고 자료: