전체 글 260

4. Nested Scroll View 구현

Nested Scroll View 구현 공개예정에 해당하는 UpcomingViewController이 아직 custom class로 지정되지 않았기에 이를 지정하고 기능을 구현한다. 우선 HomeViewController의 코드를 해석해보자 HomeViewController에서는 3개의 RecommandListViewController를 갖고있다. 이때 prepare을 통해 각각의 segue의 identifier로 ViewController를 구분하고 type을 지정해서 fetch하는 구조이다. RecommandListViewController에 들어가게 되면 updateUI를 하게되고 각 sectionLabel은 HomeViewController에서 updateType으로 지정한 type에 해당하는 텍..

3. Container View를 활용한 Nested ScrollView 만들기

Container View를 활용한 Nested ScrollView 만들기 공개예정 Tabbar에서 생성한 vertical stack view에 임의의 View를 삭제하고 container view 2개를 삽입하자. height는 200이다. 여기서 stack view는 안에 존재하는 content의 크기에 따라 사이즈가 지정이 되기에 stack view의 height auto layout 지정은 삭제한다. 이때 stack view의 height 600을 유지하게 되면 안에 존재하는 contents의 크기가 전부를 못채우기 때문에 에러가 발생한다. 현재 UIView라는 빈공간이 들어가있고 이 빈공간이 오른족에 존재하는 ViewController로 대체되는 구조이다. 일반 ViewController을 Em..

2. Nested Scroll View

Nested Scroll View TableView 와 CollectionView는 ScrollView의 한 형태이다. ScrollView는 화면에 보여지고 스크롤을 할 수 있는 ScrollView 자체가 있고, 그 안에 컨텐츠를 담은 왔다갔다하는 ContentsView가 존재한다. 예를들면 기차를 타고 창밖을 바라보면 배경은 엄청 넓지만 창문으로 바라보는 세상은 위의 그림처럼 제한적이다. 창문이 ScrollView와 대응되고 배경이 컨텐츠와 대응되는 개념이다. 스크롤 뷰는 “공개 예정” tabbar에서 만들어 보겠다. ScrollView를 넣고 Auto Layout으로 4방향 모두 space를 지정해 줬지만 다른 UIComponents와 달리 오류가 계속 뜨고 있다??? --> ScrollView에는 ..

1. Netfilx app extension start

기존의 넷플릭스st application에서 기능을 추가해서 확장해보겠다. 추가할 기능은 두가지다. 1. HomeViewController에서 구현한 것과 같이 Nested Scroll View를 완성한다. 2. Firebase를 연동해서 Search History data를 R/W 한다. Firebase의 경우 연동하는 방법을 정리했으니 참고하길 바란다. 내용이 길지 않으니 이론부터 익히길 바란다. https://yeongwoo-cho.tistory.com/153 1. Firebase Firebase 란? 앱을 만들다 보면 서버와의 Networking을 하는 경우가 많이 생기고, 서버를 만들어야 되는 경우가 존재한다. 이제는 서버를 서비스로 제공하는 것이 존재하고 이는 google의 Firebase이다..

11. Crash between Swift Package and Cocoapods

Crash between Swift Package and Cocoapods 간혹 Swift Package와 Cocoapods로 추가한 라이브러리가 충돌하는 경우가 발생한다. 예를들어 Kingfisher은 Swift Package로 연결하고, Firebase는 Cocoapods로 연결할 경우 Kingfisher의 연결에 문제가 생길 수 있다. 해결방법은 간단하다. Swift Packages로 연결된 라이브러리를 업데이트 시키면 된다. Kingfisher을 클릭하고 Exact로 Version 변경을 한다 —> Up to Next Major 상태이기에 그냥 Done시키면 아무 변화가 없다. 그 후, 다시 Upt to Next Major로 바꿔주면 된다. 끝이다. 성공적으로 Build 될 것이다.

6. Realtime Database 데이터 파싱하기

데이터를 가져와서 몇명의 customer이 있는지 파악할 것이다. 데이터를 가져와서 customer가 몇 명 있는지 확인하고 UI로 출력할 것이다. JSON 파일을 받아와서 데이터를 파싱하는 작업이 필요하다 —> Codable 우선 데이터를 받아왔을때 어떤 형태인지를 확인하기 위해 데이터 읽기를 해본다. 데이터를 확인해보면 Array형태로 내려왔음을 확인할 수 있다. Array로 받아온 데이터를 사용하기 편하도록 바꿔보겠다. JSON형태로 만들고 이를 우리가 원하는 struct 데이터 구조로 만들기 위해 Codable을 사용해서 parsing을 해보겠다. 데이터를 넣어서 JSON데이터 형식을 생성하고 Decoder을 통해 우리가 원하는 데이터 타입인 [Customer]형태로 decode를 했다. 물론 C..

5. Realtime Database 데이터 쓰기

Realtime Database 데이터 추가하기 write의 경우 key를 정하고 setValue 하면 된다. 그런데 우리가 보낼 데이터를 이렇게 간단하지 않다. 예를 들면 고객의 데이터를 보낸다고 가정해보자 그렇다면 데이터는 다음과 같은 구조를 가질 것이다. 데이터는 이런 형식이다. Customer을 보낼려고 하는데 Book type은 넘어갈수 없다… String, number, array, dictionary 이 4가지만 데이터로 쓸수 있다. 그렇다면 dictionary가 가장 적합하다. 이렇게 compute property를 더하면 Customer은 Book type을 dictionary type으로 데이터베이스에 쓰게 된다. 참고로 중복된 데이터는 추가되지 않는다.

4. Realtime Database 데이터 읽기

두개의 데이터 베이스가 존재한다. FireStore Database와 Realtime Database가 존재한다. 우리는 Realtime Database 를 사용해볼 것이다. https://firebase.google.com/docs/firestore/rtdb-vs-firestore?hl=ko 데이터베이스 선택: Cloud Firestore 또는 실시간 데이터베이스 | Firebase Firebase는 실시간 데이터 동기화를 지원하며 클라이언트에서 액세스할 수 있는 2가지 클라우드 기반 데이터베이스 솔루션을 제공합니다. Cloud Firestore는 모바일 앱 개발을 위한 Firebase의 최신 데이 firebase.google.com Realtime Database 생성 아무나 R/W 되도록 할 것인지..

3. Firebase 연결하기 (iOS Swift by CocoaPods)

우리는 iOS 어플과 Firebase를 연결시키기 위해서 CocoaPods 라는 것을 사용할 것이다. 우선 아래의 링크를 참고해서 CocoaPods를 설치해보자 https://cocoapods.org/ CocoaPods.org CocoaPods is built with Ruby and is installable with the default Ruby available on macOS. We recommend you use the default ruby. Using the default Ruby install can require you to use sudo when installing gems. Further installation instructions are in the g cocoapods.org ..

2. Firebase iOS SDK

Firebase IOS SDK를 프로젝트 안에 설치하면 된다. SDK ( Software Development Kit ) —> 개발도구라고 생각하면 된다. Firebase를 사용하기 위한 기능들을 구글 개발자들이 만들어놨다. 우리는 가져와서 사용만 하면 된다. UIKit은 UI를 어플에 접목하기 위한 바구니 이다. Firebase IOS SDK는 Firebase를 IOS에 접목하기 위한 소프트웨어 개발 바구니 이다. Cocoapods 우리는 외부 개발도구인 SDK를 가져와야 하는데, 여러가지 방법중 많이 사용하는 cocoapods가 있다. 루비 기반의 외부 개발도구 혹은 라이브러리 관리 모듈이다. 우리는 cocoapods를 통해 Firebase IOS SDK를 가져올 것이다.

1. Firebase

Firebase 란? 앱을 만들다 보면 서버와의 Networking을 하는 경우가 많이 생기고, 서버를 만들어야 되는 경우가 존재한다. 이제는 서버를 서비스로 제공하는 것이 존재하고 이는 google의 Firebase이다. firebase를 이용하면 따로 서버를 구축하지 않아도 다음과 같은 기능을 사용할 수 있다. 데이터저장, 실시간 데이터 동기화, 사용자 인증, 데이터 분석, A/B Testing(제품의 성장을 위한), 등등등등 좀더 깊이 들어가보자 firebase는 3가지 축으로 서비스를 도와주고 있다. 더 잘만들도록, 앱 퀄리티를 높게, 비지니스적 성장 3가지 이다. 1. 더 잘 만들도록 : 개발 속도를 높히는 서버관련 기능들을 제공한다. 사용자 인증, 호스팅, 클라우드 저장소, 머신러닝 백엔드 서..

11. 오늘의 영화 구현

오늘의 영화 구현 Search에서 collectionView cell delegate는 구현했다. 하지만 우리는 아직 홈에서 cell을 클릭할때 Play하도록 구현하지 않았다. 해보자 데이터를 갖고 있는 상태에서 바로 띄우는 것도 가능하지만, 좀 다르게 해보자 재생버튼을 누르게 되면 오늘의 영화에 해당하는 title이 있을 것이고, 이를 SearchAPI를 통해 검색을 해서 네트워킹으로 데이터를 받아오고 데이터 안에 존재하는 url을 Player에 전달해서 재생해보겠다. 그런데 토토로는 그냥 지정한 것이지 랜덤으로 지정한 것은 아니다. 핵심은 home에서 header에 있는 데이터를 재생시키는 것이다. interstella에서 Totoro로 변수명을 변경했다. Header item의 title을 sear..

10. PlayerView

시작 전 PlayerViewController에 몇가지만 추가하자. player을 추가하고 AVPlayer객체로 생성한다. AVPlayer에 extension으로 compute property를 추가하는데 재생하고 있는지 여부를 판단하는 변수이다. 이제 실제 Player를 만들어 보자 우선 위의 코드를 살펴보면 변수 playerView의 경우 PlayerView!로 선언되어 있는데, 이는 Custom Class가 PlayerView로 지정되어 있어서 이다. PlayerView의 경우 개발자 공식 홈페이지에서 가져온 코드이다. 우리는 AVPlayerLayer를 이용하기 위해 Custom Class를 지정한 것이었다. developer.apple.com/documentation/avfoundation/avp..

9. PlayerViewController

Player storyboard에서 PlayerView를 만들것이다. View를 넣고 superView과 top, bottom, leading, trailing을 모두 0으로 맞춘다. 여기서 top, bottom의 경우는 safeArea가 아닌 superView에 맞춘다. 이제 이 흰색화면에서 영상이 재생되는 것이다. AVPlayer 이를 구현하기 위해서는 AppleMusic Application에서 사용한 것과 같이 AVPlayer를 사용한다. 음악, 동영상을 재생할 때 사용하는 API이다. AVPlayerView https://developer.apple.com/documentation/avkit/avplayerview AVPlayerLayer https://developer.apple.com/doc..

8. Player View 가로모드 구현

swift 11.4 버전 부터 simulator에서 Rotate 기능이 생겼다. Cmd + 방향키 로도 방향을 바꿀 수 있다. Netflix의 경우 동영상을 재생할때 알아서 가로모드로 바꾼다. 가로 Landscape, Horizontally 세로 portrait, vertical 실제 보여지는 화면은 이렇기에 Landscape(가로)로 미리 지정한다. Delegate 이제 CollectionView에서 cell을 클릭했을 때 영상이 재생되도록 하는 것이다. collectionView의 Delegate를 구현하면 된다. storyboard의 customClass와 identity를 PlayerViewController로 지정한다. 그럼 이제 SearchViewControllerDelegate에서 Playe..

2. 블록체인 원리 가장 중요한 개념만 쉽게 설명

블록체인 원리 가장 중요한 개념만 쉽게 설명 https://www.youtube.com/watch?v=ybJW3LF7pkU 이전 글에서 간단한 블록체인의 원리는 이해 했을 것이다. 우리는 거래내역을 갖고있는 블록을 갖고있고, 이 블록들은 체인처럼 강력하게 엮여있다. 여기서 체인을 거는데 있어서 가장 중요한 개념은 문서 압축이다. 이때 문서에서 점 하나만 달라져도 압축된 문자열은 완전히 바뀌게된다. 문서를 문자열로 바꾸는 것은 가능하지만, 문자열을 문서로 바꾸는 것은 불가능하다. 현재 비밀번호를 관리하는 것이 이러한 해시함수에 해당한다. 블록체인에서 강력한 체인을 형성하기 위해 이러한 기술을 사용한다. 블록이 갖고 있는 데이터를 해시함수를 통해 되돌릴수 없게 만들고 이를 다른 블록에서 저장하는 구조이다. ..

ETC/블록체인 2021.04.28

1. 블록체인 5분 만에 이해하기

블록체인 https://www.youtube.com/watch?v=BKLfMx5hscI 비트코인을 위해 블록체인이 생겨났다 처음에는 현재의 현금거래 제도에 대항한다 라는 취지를 가졌다. 예시를 들어보자 쉽게 예로 들면 외국에서 돈을 탕진한 친구가 100만원을 나에게 빌린다고 가정해보자 그럼 내 돈이 친구에게 순간이동해서 도착하는 것이 아니다. 나는 은행을 통해 송금을 요청하고 은행은 내가 그 돈을 가진지 검사한다. 검사완료가 되면 친구의 계좌에 넘어가게 된다. 이를 정리해보자 이 과정에서 은행이라는 제 3자가 개입을 하게 되었다. 나와 친구 둘만의 거래 과정에서 중개자로 자리잡고, 은행 장부에 이체 내역을 기입 함으로써 내가 친구에게 돈을 전달했다는 것을 보증한다. 여기서 문제점이 존재한다. 둘만의 거래..

ETC/블록체인 2021.04.28

7. Search 결과 구현 3 - OpenSource Kingfisher

Search 결과 구현 3- OpenSource Kingfisher UI update 우리가 데이터로 갖고 있는 것은 실제 thumbnail이 아닌 thumbnailPath이다. 즉, path(string) 정보를 갖고 image를 불러와야 update 가 가능하다. 물론 Networing로 직접 구현해서 가져와도 되지만 여기서는 외부 코드를 사용해보겠다. 오픈소스 서버에 있는 이미지를 쉽게 가져와서 캐싱하고 이미지로 만들어 주는 기능을 갖는다. 개발 시간에 한계가 있을때 오픈소스를 사용하는 것이 효율적으로 좋다. https://github.com/onevcat/Kingfisher onevcat/Kingfisher A lightweight, pure-Swift library for downloading ..