post Image
リリース済みiOSアプリのソースコード、全部見せます!

はじめに

今回、アプリのソースコードを公開しようと考えたのには以下の理由があります。

  • 自分が作ったアプリを多くの人に見て欲しい。
  • いろんな人の意見を聞きたい。
  • コードを共有することでアプリを作る人の手助けがしたい。

この記事が皆さまのお役に立つことができれば幸いです😃

アプリの紹介

Innovy(イノービィ)。
最新のサービスや技術の情報収集にアンテナを立てている20代〜30代(主に男性)向けのニュースアプリです。
※革新者(イノベーター)をイメージした名前にしました。

AppIcon1024_1.jpg

ジャンル別の最新ニュースやユーザの反応を見ることができます。
また、ニュース読み上げ機能があるため、歩きながらニュースを確認することもできます。
アプリURL:https://itunes.apple.com/us/app/イノービィ/id1319179144

スクリーンショット

IMG_5140_4.jpg

①ニュース一覧画面

アプリのトップページでいろんなジャンルのニュースを確認できます。
ニュースをタップで詳細画面、横方向スワイプでジャンルを変更。

②ニュース一覧画面(ニュース長押し)

ニュースを長押し後、「この位置から聞く」タップでニュースを選択した箇所から読み上げ開始。

③ニュース詳細画面(記事読み込み中)

ニュースの詳細を確認できます。
この画面からニュースのクリップと、表示中ニュースに関するツイート確認ができます。

④ツイート一覧画面

一覧から選択したニュースに関するツイートを確認できます。
ツイートボタンを押すことでツイートができます。

⑤記事検索画面

過去のニュース検索ができます。

⑥設定画面

現在場所の天気予報の確認と、アプリの設定変更をすることができます。

公開ソースコードとアプリの起動

まず以下のURLにアクセスします。

https://github.com/RyutaMiyamoto/Innovy

Clone or downloadDownload ZIPの順に押してプロジェクトをダウンロード。
そしてダウンロードしたzipファイルを解凍してください。
スクリーンショット 2018-06-02 13.38.55.png

次のcocoaPodsを使用してライブラリをインストールします。
cocoaPodsインストールする方法は別の記事を参照してください。
cocoaPodsインストール後はターミナルを開いて、Innovy-masterフォルダに移動し、pod installコマンドを入力してライブラリのインストールが終わるまで待ちます。

ライブラリのインストールが終わったらInnovy-masterフォルダを開いてlikeNews.xcworkspaceを開きます。
推奨環境:XCode9.3

スクリーンショット 2018-06-02 13.40.00.png

XCodeを開いたらiOS Simulatorsで適当な端末を選択して、Runボタンを押します。

スクリーンショット 2018-06-02 13.50.29.png

シミュレータ&アプリが起動したら成功です。
もちろんProvisioning Profileを設定すれば実機での動作も可能です。

スクリーンショット 2018-06-02 14.33.22.jpg

Firebaseのplistや、回数制限のあるAPIのAPIKeyなどはマスクしてありますので一部表示されないものがあります。
別途連絡していただければマスクしてある項目もお渡しします🙃
※ただし、(Facebookなどで)身元のはっきりしている方に限らせていただきます。

アーキテクチャ紹介

InnovyではアーキテクチャパターンとしてMVVM(Model-View-ViewModel)を採用しています。

例えばニュース一覧画面でユーザが最新ニュースの再取得の操作(画面を上方向に引っ張る)をすると以下のように動きます。
※コード上のNewsListViewControllerViewNewsListViewModelViewModelNewsListModelModelとして考えます。

アーキテクチャ.jpg

①. Viewがユーザによる更新操作を検知
②. ViewViewModelに更新処理を依頼
③. ViewModelModelにニュース一覧取得を依頼
④. Modelがニュース一覧取得APIを使用し、最新ニュースを取得
⑤. ModelViewModelにニュース取得完了を通知
⑥. ViewModelModelから取得したニュース一覧を元にViewで表示するためのデータを作成
⑦. ViewModelViewにデータ作成完了を通知
⑧. ViewViewModelの情報を元に画面を更新

こうして最新のニュース情報がアプリに反映されるわけです😉

アプリで使用しているライブラリ紹介

R.swift

画像ファイル名やStoryboard名をプロパティとして取得できるようになるため、タイプミスによるエラーを防いでくれる。
画像ファイル名、アラート用メッセージ、xib名など至る所で使用。

Alamofire

HTTP通信を楽に行うためのライブラリ。
通信を行うiOSアプリ開発において誰もが使用しているのではないでしょうか。
API通信部分で使用。

SDWebImage

UIImageViewに対してURLを指定するだけで画像の読み込み、読み込み中表示、キャッシュまでしてくれるライブラリ。
記事画像の表示部分で使用。

Unbox

Jsonをパースしてくれるライブラリ。
APIで取得したJsonをアプリ内部で使用するために取り出す箇所で使用。

Realm

アプリ版データベース。
データのアクセス構文がとてもわかりやすい。
記事情報の保存で使用。

CTFeedback

お問い合わせ画面を簡単に作成できるライブラリ。
お問い合わせ画面で使用。

SVProgressHUD

画面最前面に処理中を表すインジケーターを表示するためのライブラリ。
記事情報取得中に使用。

HockeySDK

アプリクラッシュ時のクラッシュレポートを収集してくれるライブラリ。
起動時に設定。

Firebase

アプリの利用状況調査、クラッシュレポート閲覧、プッシュ通知使用などのアプリ総合サーポートライブラリ。
起動時に設定。

NendSDK_iOS

広告を表示するためのライブラリ。
記事表示時に使用。

API紹介

記事情報取得API(自作)(likeNews/getNews.php)

記事情報を取得するためのAPI。
一覧表示時に使用。

ジャンル情報取得API(自作)(likeNews/getGenre.php)

ジャンル情報を取得するためのAPI。
ジャンルには「スタートアップ」、「サービス」、「デザイン」などがある。
起動時に使用。

記事スコア加算API(自作)(likeNews/updateNewsScore.php)

記事詳細を見た回数を加算するためのAPI。
記事一覧から任意の記事をタップし、記事詳細を開いたタイミングで使用。
これにより記事を表示した時に「他に○人の方がこの記事を注目しています!」を表示させることができる。

ツイート情報取得API

Twitterからツイート情報を取得する取得するためのAPI
記事詳細画面下部のツイートボタンをタップするとツイート一覧が表示されるが、その一覧取得時に使用する。

天気情報取得API

天気情報を取得するためのAPI。
緯度経度を指定すると、その場所の天気情報が取得できる。
設定画面で表示している天気情報表示時に使用。

位置情報取得API

位置情報を取得するためのAPI。
緯度経度を指定すると、その場所の住所が日本語で取得できる。
天気情報APIでは住所が英語でしか取得できないため、別途このAPIで住所を取得する。
天気情報APIと一緒に使用。

終わりに

いかがだったでしょうか。

この記事を読んで皆さんのiOSアプリ開発のヒントになっていれば、これほど嬉しいことはありません😀
公開しているソースコードはMITライセンスです。(改変、再配布、商用利用など、どんなことにでも自由お使いください)

また「いいね」ボタンや、GitHubのスターを押してくれるととても励みになります😆

いいねボタン

スクリーンショット 2018-06-02 15.00.57.png

GitHubのスター

https://github.com/RyutaMiyamoto/Innovy
スクリーンショット 2018-06-06 23.41.09.png

質問や、GitHubへのプルリクも大歓迎です🙂

※6月6日:ライセンスの記述を追加


『 Swift 』Article List
Category List

Eye Catch Image
Read More

Androidに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

AWSに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Bitcoinに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

CentOSに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

dockerに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

GitHubに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Goに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Javaに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

JavaScriptに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Laravelに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Pythonに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Rubyに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Scalaに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Swiftに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Unityに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Vue.jsに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Wordpressに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

機械学習に関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。