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

この記事は最終更新日から1年以上が経過しています。

はじめに

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

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

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

アプリの紹介

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日:ライセンスの記述を追加

ryupaka
元iOSエンジニア。 現在はスマートフォンアプリのテクニカルディレクターを仕事にしています。 スマートフォンアプリに関するご質問やご依頼受け付けております。 Twitter:https://twitter.com/miyamotoryuta
ユーザー登録して、Qiitaをもっと便利に使ってみませんか。
  1. あなたにマッチした記事をお届けします
    ユーザーやタグをフォローすることで、あなたが興味を持つ技術分野の情報をまとめてキャッチアップできます
  2. 便利な情報をあとで効率的に読み返せます
    気に入った記事を「ストック」することで、あとからすぐに検索できます
コメント
この記事にコメントはありません。
あなたもコメントしてみませんか :)
すでにアカウントを持っている方は
ユーザーは見つかりませんでした