Quantcast
Channel: Node.jsタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 8861

エンジニア向けSNSアプリを孤独にフルスクラッチした時の技術要素とか苦労話とか

$
0
0

作ったもの

エンジニア同士、デザイナ同士、エンジニアーデザイナが一緒に「なんか作ろうぜ」「なんか勉強しようぜ」というつながりを実現できるSNSアプリ

EDICPAT
https://play.google.com/store/apps/details?id=com.engineer_forum.engineer_forum

作った動機

エンジニア向けSNSアプリってもう色々あるんでしょうけど、既存の団体に自分が参加する形式とか、作ったものを見てもらうとかの形式だったりすると思います。

そうじゃなくて、未経験者とか、フリーランスエンジニアとか、そこら辺の仲間と「勉強会やろうぜ」とか「何か作ろうぜ!」ってやりたい。休日とか、ライトなノリで。自分自身がそういうのに参加したかったのもあって、アンドロイドアプリで作ってみました。

※タイトルに「孤独」って入ってますが、途中からデザインはデザイナに頼んでます(後述)。システム(プログラム)的には割と孤独にやりました。画面用のxmlファイルはデザイナがやってくれました。

※改善した方が良い所等あれば、忌憚なくご意見下さい。

記事の趣旨

結構今更な内容ではありますが、アプリ開発を一から一人でやっているとハマりどころがあったり、やる前はイメージがつかない所があったりするので、技術レベル高くない自分の経験を記事にすることでこれからアプリ開発をやる人がイメージつきやすくなればいいかなと思って投稿。あとそもそも設計とか技術要素にツッコミとか指摘もらえると嬉しいです。

アプリの仕様

  • 対象ユーザ

    最初エンジニア向けサイトにしようと思って始めたんですが、やっていくうちに成り行きで知り合いのデザイナに助けてもらうようになり(主に見た目)、エンジニアとデザイナが手を組む需要って結構あるんじゃないかと考えるようになりました。なのでエンジニア同士、デザイナ同士、エンジニア-デザイナ間の交流を想定したアプリにしました。

  • 仕様的なもの

    • 掲示板形式で投稿が出来る
      • 勉強仲間を募集する投稿
      • 開発仲間を募集する投稿
      • 既存のチームに拾われる為に参加希望(自己アピール)する投稿
    • 投稿者にチャットで話しかけられる
    • チャットはプッシュ通知を使う
    • 広告出す(バナー広告、Native広告)

クライアント側

  • Android Studio+Javaで開発

  • クロスプラットフォームな方がいいんだろうな、、、でもXamarinは知ってたけど検索した時の情報の少なさから見送りました。Webviewは、元々自分Webの人じゃないので候補にしてない。FlutterとかReact Nativeとかだんだんメジャーになってきてるからそろそろそっちに移行すべきか…

  • チャットのデータはローカルDB(SQLite)で管理

  • プッシュ通知はFirebase使用

  • 広告は当初Google Admobを採用 → 途中でFacebook Audience Networkに切り替え(後述)

サーバ側

  • サーバアプリケーションにはNode.js + Express使用

  • サーバ・クライアント通信はJSON使用

  • DBはMySQL

設計

  • クライアント側の画面仕様作る(エクセル方眼紙+お絵描き)

  • サーバ・クライントIF仕様作る(エクセル)。処理結果OK/NGとか。

  • DB仕様書作る(サーバDB、クライアントDBのデータ項目作成)

  • ユーザには意識させない形で認証の仕組み入れる(なりすまし防止とか)

実装

  • クライアント側の画面をAndroid Studioで全部作る。サーバ側との通信は全部ダミー関数呼び出しで保留しておく。画面全体はConstraintLayout, 投稿リストはRecyclerViewとか。

  • サーバ側のプログラムを作成。ひたすらSQL作り込み。IFごとに、Linux PCからcurlでJSONデータを送りつけ、動作確認。

  • クライアント側の通信用ダミー関数を本物に変える。JSONObjectとかJSONArrayとか送れるように

  • サーバ・クライアントの通信の動作確認して試作完成

そして自らの限界を知る...

  • サーバ・クライアントとも途中まで一人で全部作ってましたが、自分の絵心の無さが徐々に顕在化。試作を知り合いのエンジニアに見せると「見た目社内システムのアンケートフォームみてえだな」などと酷評される( ;∀;)

  • 知り合いのデザイナ(優秀)に頼みこんで画面綺麗にしてもらったりxmlガッツリ直してもらったり、アイコン画像頼んだり。見た目いい感じにしてもらう。本当に感謝しか無い。

AdmobのNative広告で悶絶の苦しみ

ある程度完成した段階で広告挿入を試みました。広告表示用のSDKはいくつか種類があるようですが、GoogleのAdmobは一番人気っぽくて、情報も豊富だし、リリース前段階からダミー広告を表示して動作確認出来るので普通にそれを採用。バナー広告はいい感じに動いてたので余裕だな〜とか思っていたのですが…

投稿の合間に挟み込むNative広告がアカン。どうやってもアカン

投稿をスクロールすると、何個かに一つ広告を表示する仕組みなのですが、広告ロードの瞬間なんかスクロールがカクカクするのです。

そりゃあもう、色々試しました。自分の作り込んだバグだろうと思って。広告ロードのスレッドをバックグランドにすれば解決するんじゃね〜???等と思って色々調べました。しかし公式ドキュメントを読むとこんな事が。

★ Note: Make all calls to the Mobile Ads SDK on the main thread.

いや、★じゃねえし…
main thread縛りされたらカクカク直せないじゃんよ…

一度にロードする広告を増やしたり、ドキュメントを無視して禁断の広告のBackgroundロードを試みたり、呼び出し順序変更したり、findViewByIdを減らしたり、ローカル変数をフィールド変数に変えたりして戦いました。詳細は割愛しますが、結果は......(´・ω・`)

最終的に以下のサイトのやり取りを見て、Admob使用を断念
https://groups.google.com/forum/m/#!topic/google-admob-ads-sdk/4UxTXMQIBWQ
( → 要するにAdmobのUnifiedNativeAdには広告ロード部分に明らかな不具合があるけど、放置されているっぽい...真偽は分かりません)

ここら辺の悶絶具合はもっと詳しく別記事にしてみたいです。
それかAdmobでNative広告をリストに表示して、滑らかにスクロール出来てる人いたら教えて下さい。

広告はFacebook Audience Networkに変更

3週間くらいAdmobで悶絶したんですが、Facebook Audience NetworkのNativeAdに切り換えたら特に工夫しなくても投稿をヌルヌルスクロールできる広告になった。あの悶絶は一体なんだったんだ…バナー広告もついでにAdmobからFacebookに変更。

試験、リリース。そして審査が中々終わらない…

アプリの試験も無事に終えて、Google Play Console経由でリリースを行いました。巷の噂ではAndroidはiPhoneに比べて審査がゆるいとか言われてて、それを信じていました。最近では審査が厳格化して5時間かかったとか、一晩かかったとかいう書き込みが検索結果の上位に出ていたので、まあ半日くらいかな〜とか勝手に思っていました。

…が、翌日になってもGoogleから音沙汰は無く。翌々日も何もなく、3日後になっても何も連絡は無く…

正直Rejectを覚悟しました。なんか分からんけど、なんかが気に入らんのだろうと…しかし実際アプリで遊んでみなきゃダメなとこなんて分からんだろうよ?グーグルのテスター達よ…HogeでもFugaでも書き込んで見たのか?ん?どうなんだ???

というような疑心暗鬼に駆られました。が、リリース3日後に不意にアプリ名(EDICPAT)でGoogle Playを検索してみると検索結果に現れるようになりました。単純に審査の待ち行列に並んでる人が増えたということなのだろうか。Googleテスターによる書き込みは終にありませんでした...(そりゃそうか)

Facebookの広告レビューも中々終わらない…

広告を出すのにFacebookにアプリを審査してもらわないといけません。記事執筆段階で、レビュー依頼出してから既に2日経ちましたが、まだ回答はありません。心臓に悪いのであまり長引かせないで欲しいものですが…こればかりは待つしかありません。

思ったこととか(順不同)

  • 着手〜リリースに大体7ヶ月弱かかりました。ちょっとかかりすぎかもしれませんが、本業の組み込みとも違う作業なのである程度は仕方ないです。

  • そもそもFlutterかReact Nativeもっと検討するべきだった。知り合いiPhoneユーザばっかりだから勧められないし、宣伝しようにも片手で一生懸命攻撃してる感じになる。

  • ConstraintLayoutネットだと大体べた褒めされてるけど、そんなにいいのかな…全部のViewにid振らないといけないし、要素追加したり除去したりするのLinearLayoutの方がやりやすくない?(そもそも追加とか除去なんてあんましないのか?)。動作が早いって言われても、自分のアプリくらいの規模だと正直あんまり分からんです。

  • node.jsってプログラミングの時、想像力めっちゃ使うなー。基本が非同期だから。脳内のツボめっちゃ変な風に押される(別に気持ちよくは無い)。

  • 結局人は力を合わせた方がいいものが出来るなーとか(当たり前か)。特に興味の方向が違う人と組むと、葛藤は増えるけどアウトプットは良くなる。自分らの場合、システム部分と見た目部分とか。

  • 自分以外にも孤独になんか作って行き詰まってる人たちが、誰かと協力してブレークスルーを起こせないものか。やっぱいいアプリ作ったんじゃないか?

  • iPhone版出せるかな…2020年春くらいが目標


Viewing all articles
Browse latest Browse all 8861

Trending Articles