번역기 앱 - 1. 시작하기

안녕하세요. Skillist입니다

 

이번엔 RxSwift 학습을 위해 프로젝트를 진행해봤어요.

RxSwift를 계속 학습중인데, 프로젝트를 하고, 학습해보니 감이 왔습니다.

오랜만에 달려보니, 좀 힘들기도 하고 지치기도 하네요.

계속 달리다보니, 번아웃이 올것같아, 쉴땐 좀 쉬어야겠어요.

 

———————————————————————————————————————————————————

 

우선 프로젝트에 사용할 오픈소스를 정했습니다.

• RxSwift (https://github.com/ReactiveX/RxSwift) - MIT license
• RxCocoa (https://github.com/ReactiveX/RxSwift) - MIT license
• RxDataSources (https://github.com/RxSwiftCommunity/RxDataSources) - MIT license
• SnapKit (https://github.com/SnapKit/SnapKit) - MIT license
• SwiftLint (https://cocoapods.org/pods/SwiftLint) - MIT license
• Alamofire (https://cocoapods.org/pods/Alamofire) - MIT license

Rx관련 오픈소스들은 Rx학습을 위해,

RxDataSources는 tableview의 delete를 위해,

SnapKit은 코드를 통한 레이아웃 구성을 위해,

SwiftLint는 코드 컨벤션을 유지하고 실수를 줄이기 위해,

Alamofire는 http 네트워킹을 위해 사용했습니다.

 

프로젝트에 API를 활용하고 싶어서, Naver의 Papago API를 사용했어요.

https://developers.naver.com/products/papago/nmt/nmt.md

Neural Machine Translation - INTRO

 

또, 기획부터 개발까지의 앱 개발 싸이클을 돌고 싶어서,

화면 기획부터 시작했습니다.

상세 기획이면 좋지만, 화면은 간단하고, 기능은 직관적으로 보이기에 간략화했습니다.

앱 디자인은 구글 번역기를 많이 참고했습니다.

 

Android 개발을 시작한 학부생일때부터,

앱에 대한 아이디어를 생각하고, 프로젝트 기획, 개발을 진행했어서 그런지, 저에겐 꽤나 익숙한 작업들입니다.

요즘 iOS 앱 프로젝트를 쭉쭉 진행하다보니, 앱 개발 공장 같아요;;; Android 앱 공부할때가 생각나네요.

 

앱 화면들을 살펴볼까요??????

 

우선, 번역 화면입니다.

번역 언어를 actionSheet를 통해 선택할 수 있고,

언어 change 버튼을 통해 source 언어와 target 언어를 전환할 수 있습니다. (가장 최근까지 막혔던 부분이에요)

text입력하면 우측 상단에는 clear버튼이 보입니다.

엔터키를 입력하면, API를 통해 하단에 번역 Text를 보여줍니다.

하단의 번역 Text를 보여주는 View에는 text 복사, 보관 버튼 2개가 존재하여 버튼 터치 시

번역한 text를 복사하거나, 보관함에 보관(저장)합니다.

기능은 정말 간단하죠?????

 

이번에는 번역 기록화면입니다.

번역을 하면, 기록 화면에 데이터가 남습니다. 최대 10개까지 생성됩니다.

cell의 우측 상단에는 복사, 보관 버튼이 존재합니다.

 

보관 화면입니다.

swipe를 통해 보관중인 text를 삭제할수 있고,

우측 상단 버튼을 통해서도 삭제가 가능합니다.

이번 개발에 가장 어려웠던 부분이에요.

cell delete를 위해서, RxDatasource 라이브러리를 사용했습니다.

RxDataSource를 제대로 공부해야겠어요.

 

전반적으로 기능은 매우 심플합니다.

 

그럼 다함께 시작해볼까요??????

 

 

잘못되거나 부족한 내용 등, 피드백 감사합니다!

 

https://github.com/DeveloperSkillist/TranstorKing

GitHub - DeveloperSkillist/TranstorKing