네카라쿠배 5개 앱으로 완성하는 iOS 앱개발 : 패스트캠퍼스
이제는 코딩 교육 관련 알고리즘으로 도배가 된 내 인스타그램 릴스가 계속 패스트캠퍼스 광고를 떠먹여줬다. 마침 새해 기념 대규모 할인 행사도 있었고, 추가로 들어보고 싶은 강의도 있어서 같이 구매했다.
지금은 게임 엔진과 데이터 사이언스와 관련된 분야로 공부하고 있지만, 저 강의 광고를 보고 문득 떠오른 사실이 있다. 처음 개발자라는 꿈을 가지게 된 이유가 아이폰 앱을 만들어보고 싶어서였고, 처음으로 코딩을 하면서 접한 프로그래밍 언어가 Objective-C였다.
당시에는 자료구조, 알고리즘이 뭔지도 모르는 초등학생 코흘리개가 겁도 없이 덤벼들었지만, 프로그래밍의 매운 맛을 보고 금방 깔끔하게 접었다. Objective-C가 배우기 어려운 언어라는 사실을 알게 된 건 내가 대학교를 입학하고 난 이후였다.
지금은 그래도 대부분의 애플 디바이스들의 앱을 Swift로 개발할 수 있도록 바뀌었다. 교육에도 용이하게 개발해서 간단하게 코딩할 수 있도록 만들었다고 한다. 전공 지식도 쌓였고, 이제는 해 볼만 하지 않을까 싶어서 다음 학기가 시작하기 전에 후딱 끝내보려고 한다.
이래놓고 정작 학과 수업으로 개설된 임베디드, 모바일 프로그래밍 관련 수업들은 한 번도 들어본 적이 없다.
애플에서 출시한 모든 기기는 앱 개발을 위해 Xcode를 사용한다. Windows나 Linux에서는 제공하지 않으며, 오로지 Mac에서만 이를 이용한 앱 개발이 가능하다.
Xcode에서는 작성한 코드를 바탕으로 앱에 구현되는 화면을 실시간으로 보여주기까지 한다. Visual Studio나 IntelliJ 같은 일반적인 코드 작성 프로그램과는 목적이 다르다는 느낌이 들었다.
Swift에 대한 첫 인상은 모바일 UI 구현에 최적화된 HTML/CSS 였다. 굉장히 단순한 문법에 이게 되나 싶은 표현도 꽤 있었고, 클릭으로 UI의 기능을 생성하고 코드를 자동으로 작성해주는 것이 굉장히 편리했다.
여러 면에서 웹페이지 하나를 만드는 듯한 과정이었다.
큰 틀의 구조를 잡고, 각 위치에 배치하고 싶은 요소(이미지, 텍스트, 버튼 등)의 코드를 넣고 배치하면 된다.
import SwiftUI
struct LayoutView: View {
var body: some View {
VStack {
Image(systemName: "pencil")
.resizable()
.scaledToFit()
.frame(width: 200)
MyText(textName: "Text Element 1", textFont: .headline).bold()
MyText(textName: "Text Element 2", textFont: .subheadline)
MyText(textName: "Text Element 3", textFont: .body)
HStack {
MyButton(buttonName: "Button 1", buttonColor: .blue)
MyButton(buttonName: "Button 2", buttonColor: .green)
}
Button {
// action
} label: {
VStack {
Image(systemName: "arrow.right.circle.fill")
.resizable()
.scaledToFit()
.frame(width: 50)
Text("Complex Button")
}
.foregroundStyle(.white)
.padding()
.background(.orange)
.foregroundStyle(.white)
.font(.headline)
.cornerRadius(10)
.bold()
}
}
}
}
#Preview {
LayoutView()
}
위와 같이 SwiftUI에 코드를 작성하면 프리뷰에 바로 내가 코딩한 화면이 나타난다. 마치 웹프로그래밍을 하는 것 같다. MyButton과 MyText는 설정을 미리 해둔 버튼과 텍스트를 구조체의 형태로 사용하는 것이다.

Xcode 우상단의 '+' 버튼을 누르면 내가 넣고 싶은 콘텐츠를 불러와 클릭해 삽입도 가능하다. 이를 적용하기 위한 코드가 자동으로 작성된다.

이런 식으로 아이폰 앱에서 자주 볼 수 있는 화면을 구성하는 연습을 진행한다. 이미지만을 보고 구조를 잡아보고, 원하는 화면을 만들기 위해서는 어떻게 코드를 작성해야 하는지를 꾸준히 연습한다. 새로운 개념이 필요한 경우에는 그와 관련된 설명을 짧게 진행하고, 대부분이 실습이다.
