プログラミングほぼ未経験者がSwiftUIでアプリ作りをする話

初めに

ぼく自身は、新卒のマーケター志望で、いつもボケ倒してるような人なんだけど、ひょんなことから「データベースと連携した、検索機能のついたリストアプリ」を作ることになった。その時の記録を残しておこうと思って、執筆している。

プログラミングに関して持ち合わせている知識はというと、Pythonの基本的な文法がわかる、以上！

死んだばあちゃんが最後に残した言葉と勝手にぼくが錯覚している、「売られた喧嘩は買え」精神を発揮して、オフィスにあったSwiftUIの本を持ち帰った。

結論からいうと、そのリストアプリはおおよそ2週間かけて制作した。毎日、少しずつコツコツと。途中、友達に食わされた生ササミがクリティカルヒットして死んだりしながら。

たかがリストアプリに2週間！？っておもうと思う。でもね、ぼくにとっては、これが結構むずかしかった。こういう経験をするたびに、頭の良い人を心から羨ましく思う。ああ,いいなーって。

まあそれはいいんだけれど、本題に移って、プログラミングほぼ未経験者による、アプリ制作苦悩話を書いていこうと思う。

Day1 ~ Day6

とりあえず、最初の2日間で本をザーッと読んでいった。まずインプットしないと、と思って。でも今思うと、ただ読んでいってるだけになって、この2日間の意味ってそこまで無かったかな？とも。

その後本の写経を始めた。けど、この写経がつまらなすぎてすぐにやめた。コピペできないしメンドすぎ、そもそも頭使わないじゃんとか思って。感覚的には多分あれに近いよね、学校で板書とるのメンドイから取らないってやつ。写経、ちゃんとやったほうが良かったのかな？

そんな感じで本を粗方よみ、なんとなーくの雰囲気はよいので、「アプリどうやって作っていこうかな〜」と、方針を考え始めた。

最初、似たようなアプリを作ってる人のコードをそのままパクって、細かいところを変えていって、要求されたアプリに近づけていこうかな？と思った。このやり方は「付け焼き刃作戦」とでも名付けておこう。

結論、この付け焼き刃作戦は上手くいかなかった。理由としては、細かく変えていく時に、少し変えたり付け足すだけで鬼のようにエラーが出て、どのコードを修正すればそのエラーが消えるかが、全く検討がつかなかったから。

でも、そのコピペした大方のフレームワークは見るからによく出来ていたから、なんとかそれを元に変えていってアプリを完成させようと執着してしまい、結果的に何の成果も出ない1週間を過ごすことになってしまった。

これは小さいときからのぼくの悪い癖なんだけど、一つのやり方に固執してなんとかそのやり方で解決できないかと考えてしまうところがある。今回は完全にそれで泥沼にハマっていた。

Day7 ~ Day11

元々、「1週間で作って」と言われていたので、1週間経っても全く完成の道筋が見えないことに焦りを感じていた。

この、「何をすればコトが前に進むのか分からない」って感覚、これがキツかった。

以前、なんかの本で読んだけど、ヒトって、がんばれば報われることが明示的にわかってればわかってるほど、モチベーション高くなるんだよね。

だから、がんばっても結局また何も得られないんじゃないか、とか、今やってることって全然スットンキョウなことやってるんじゃないか...?という思いがある中で作業するのが、しんどかった。

これは「実は」ベースの話にはなるんだけど、こんな調子で中々苦しかったから、1週間たったし、「すみません、頑張ったんですけどどうしてもできませんでした」と言おうと思っていた。本来、他の人がやればすぐできるタスクを、自分がずるずる引きずっても、迷惑だろうという思いもあったから。

でも、客観的に考えたら「DBと連携した検索機能のあるリストアプリ」自体は、難しいタスクではないだろう、という思いが頭を駆け巡っていたから、できれば言いたくなかった。そこで、「明日までやって何も進まなかったら言おう」と決めた。

実際のところ、少しずつ進んでいったから、この考えが毎日契約更新されて、結局継続した。

そして、本題の方にうつるんだけど、「付け焼き刃作戦では多分もう無理だ」と悟って、真面目に一から全体の構成を考えて自分のコードで書いていくやり方に方向転換した。

簡単なところから、一つ一つ部品を作っていった。そうすると、「なんだ、こんなとこでもエラーが出るのか」というエラーが沢山あった。でも幸い、小さくチャックしながら作っていってたから、一つ一つ頑張って調べたら、なんとか解決することが出来た。

この、細かく積み上げていくというのがめちゃくちゃ重要だと思った。

その過程で、オブジェクト指向とかクラスとかストラクトとかインスタンスとかメソッドとか継承とか参照渡しとかイニシャライザとか色々調べていった。初めて聞く言葉ばっかりで、一つ一つむずかしかった。今でも、ぼんやりとしか分かっていないんだけど(笑)

こうして、色々調べながら小さく進めていくことで、直面するエラーが、「得体のしれないモノ」から、「なんとなくどこを修正すれば良くなりそうか見当がつくモノ」に変わったことで、少しずつだが作業が進んでいくようになった。

DB連携の方もrealmを使い、csvファイルさえ準備してくれれば、アプリの方でそれをリストとして表示してくれるように作ることができた。

このDB連携も、結構頭を悩ませた。途中realmの本も買ったりして。結局、ほとんど読まなかったけど(笑)

そんなこんながあり、色々へんてこながらも、「DBと連携した検索機能のあるリストアプリ」ができあがった。

それで、それをみせたところ「いいんじゃない？要はエクセルとかで準備しといてそれをcsvにすればリストにしてくれるアプリになってるわけでしょ？」というので、ほおほおこれでいいのかいな?と思いつつ、「エンジニアの方にチェックしてもらって」と言われたので、見せたところ、やはりユーザ視点から見た使いやすさ、UIのところで指摘を受けた。

元々、apple純正のメモアプリのUIを参考にすると良いよというふうに言われていたのだが、結局ごまかし代替案みたいなUIになっていたことは自分でもわかっていたため、「指摘されてしまったか...」と思った。

Day12 ~ Day15

と、いうことで、ここからはUIを調整していく作業になった。主に4つ。

1. 画面遷移を純正アプリと同じようなUIにすること

2. 検索した時に検索結果画面がモーダル遷移になっているが、これは一般的でないので修正すること。

3. 検索して検索結果画面から戻ってきた時に、検索フィールドからカーソルのフォーカスを外しておくこと 

4. リストから一つの項目を選んでその詳細画面に遷移した際、関連するリスト項目を詳細画面にて表示させること

④はリスト項目と詳細項目を作成する側との連携もあるので、一旦保留。まずは①を解決するため、オフィスに合ったIpod touch を自宅に持ち帰り、純正のメモアプリやメールアプリのUIを観察した。ぼくの自分用のスマホはAndroidだったから。それでわちゃわちゃやって①は解決した。

そしてこの頃から「ブレークポイント」という機能を知り、任意の地点でコードが走るのを止めて、その時点での変数の値が見れることを知った。

この機能が、なぜ上手くいかないのかの解決手段を探す際の一助になった。検索欄に文字を打ち込んだ後、エンターを押して画面遷移するというやり方から、打ち込んだ文字をその都度受け取り、リスト項目と文字一致するかを監視させることで、インクリメントサーチにすることができた。これで画面遷移すること自体がそもそも無くなり、②が解決した。

③についてはカーソルのフォーカスを外すメソッドを作っておき、詳細画面に遷移するタイミングでそれが発動するようにすることで解決した。

そうして、ようやくそれっぽいアプリになった所で、リストアプリ制作が一旦終了した。

感想

と、いうのがプログラミングほぼ未経験者による初めてのアプリ開発による苦悩話。全く進捗しないときは辛さもあったけど、あれこれと考えてる時間自体は楽しかった。じっくり考える作業自体は小さいときから好きだから、その性格が合ってたのかな？

特に、何回やっても上手くいかないところが上手くいって実際に動く瞬間。これが最高に気持ち良い。

あと、キツイときを振り返ると、やっぱ初めが一番キツイ。エラーメッセージが理解できない苦しみ。swiftUIは最近の言語だからか、エラーメッセージをコピペして調べても、英語でしか出てこないことも多かった。swiftなら似たような質問が日本語で沢山出てくるのに！！と何度も思った。

きっと同じ立場の人なら、今ごろ首ちょん切れるくらい首を縦に振って涙を流しながら、スタンディングオベーションとともに共感してくれてるんと思うんだけど、どうなんだろう？

この記事の初めにアプリのスクショを載せてるけど、見ればわかるように本当に簡単なアプリなんだよね。csvファイルの内容をDBに入れて、そこから検索機能付きのリストを作成し、リスト項目を選ぶと詳細画面に飛ぶっていう。

でも色々悩んで迂回に迂回を重ねた結果あれが出来て、それを経験した身からすると、世に出ているアプリを作ってる人はホントにすごいなと思ったのと、アプリの画面を見た時に、これどうやって書いてるんだろう？っていう好奇心が生まれるようになった。

本当はもっと色々書きたい欲もあるんだけど、もう4000字になるし終わる