サンプルアプリを改造して欲しい機能を追加してみよう

この前の章で、サンプルアプリの作成ができたと思います。サンプルアプリとはいえ、アプリをご自身の手で作り上げたというのは、エンジニアとしての第一歩を踏み出したということです。

では次のステップとして、作成したサンプルアプリを改造して欲しい機能を追加してみましょう。

とはいえ、

いきなり改造と言われてもアイデアやイメージが浮かばない!

といった方もいらっしゃいますよね。この章では、誰でも簡単にできるサンプルアプリの改造方法を解説していきます。

目次

どんな機能を追加するか決めよう

改造をするといっても、大前提として何を追加するかを決める必要があります。あなたが必要だと思う機能をまずは3つ以上考えてみましょう

もし、あまりアイデアが浮かんでこないときは、以下の思考法で考えてみるとあなた独自の面白いアイデアが浮かんできますよ。

好きなもの(詳しいこと)× 既存のアプリ(サイト) = 新しいアイデア

例えば、あなたが作ったサンプルアプリがツイッターのようなもので、あなたが写真を好きだったとします。その2つを組み合わせてみましょう。

すると、あなたのサンプルアプリに写真を埋め込みできるという1つの機能が浮かびます。このようにあなたの好きなことや詳しいことをベースにして、考えることであなたがイメージしやすい機能が浮かんできますよ。

機能を追加するための基本サイクル

ここからは先程考え出した機能を実際に追加していく方法を解説いたします。

機能追加には「プログラマーなら誰でも行っている基本サイクル」を活用していきます。この基本サイクルは初心者でも超一流のエンジニアでも基本は同じで、違うのはサイクルを回す回数だけです。

その基本サイクルとは、

  • 定義
  • 調査
  • 実装
  • 検証
  • 修正

以上の4工程になります。それぞれ詳しく解説していくので、ぜひ活用してください。

1.定義

定義のプロセスでは、作るもの、ここでは追加する機能を定義していきます。

本来この定義は「設計」と呼ばれる重要な工程が必要になるのですが、自分のアプリを趣味で作る段階ではこの設計は省いて考えても大丈夫です。

今の段階では「写真を投稿できるようにしよう」「地図を表示できるようにしよう」「画像スライダーを配置しよう」などさきほど思いついた機能をざっくりまとめるだけでOKです。

定義段階でのポイントは、調査の際に検索出来るよう、言葉にしる事が重要です。

2.調査

調査では、実際に先程定義した機能を実装する方法を調べていきます。調査と言っても難しいことは全く無く、Google等の検索エンジンで検索するだけです。

実は、エンジニアにとって検索力というのは非常に重要な要素です。

一流のエンジニアでも毎日ググって調べ物をしています。もちろん暗記した知識だけで作業することもありますが、細かい書き方や新しい機能の追加の仕方などはすぐにググるのがエンジニアです。

そういう意味では、分からないことがたくさんあっても、いちいち全てを暗記する必要はないので、暗記するのが苦手という方も安心してください。

調査の具体的な方法ですが、これも難しくはありません。検索バーに以下のように打ちこむだけです。

「[言語名] [バージョン番号] [①で定義した機能を言語化したもの]」

例)

「HTML 固定メニュー」(HTMLの場合はバージョンを書かなくて大丈夫です)

このように検索すると、日本語でわかりやすく解説された個人ブログなどの記事がでてきます。多少慣れが必要ですが、慣れれば教材を写す感覚で、記事の指示に従い機能を追加することが出来るようになりますよ。

逆に意図した機能が表示されないときは、定義した検索言語が間違っている可能性が高いです。その際はもう一度定義からやり直してみましょう。

3.実装

実装とは簡単に言うと「組み込むこと」をいいます。

具体的には調べた記事や文献をもとに写経していくことがメインとなります。もちろん、変更を加えなくてはならない箇所がでてくるので、ただ写すだけでなく、できるだけ記事のサンプルコードを解読して理解することを意識してみましょう。

よくわからない場合は、ひとまずわからないところも写してみて、動くかどうか検証してみましょう。

4.検証

意図した処理が実行されたかどうか確認をする工程です。

アプリ開発に限らずプログラミングでは、リリース前に必ず検証を行います。そこで追加した機能が正しく行われているか、バグなど不具合がないかを確認する必要があります。

もしもバグやエラーが発見されたら、速やかに問題の原因を特定し修正します。

5.修正

実装工程で、うまくプログラムが動作し、意図した機能が追加されればいいのですが、実際その可能性は低いでしょう。大概の場合は何かしらのエラーが表示され動作しないことが多いです。そんな時に必要なのが修正です。

上記のように「不具合」が発生した際にまずやるべきことは、どんなエラーが出ているかを確認することです。

エラーが出たときは、必ずエラーメッセージが表示されるので、そのエラーメッセージをコピーしてググってみましょう。すると、あなたと同じエラーに躓いて解決した人たちが書いた記事や、質問掲示板でのやり取りなどが出てきます。そしてその情報を元に解決策を探して実施していくわけです。

しかし、エラーとならず、エラーメッセージが表示されない場合は、先ほどの調べ方が出来ません。そんな時はもう一度実装工程で活用した情報を見直し、写し間違いはないか?変更すべきところはないか?などを精査しましょう。

それでも不具合が解消されない場合は、実装工程で活用した情報の中に理解できてない箇所があります。そういった箇所を検索で調べたり、書籍で調べていくことで理解をしていきます。すると、修正すべきコードの箇所が見えてきますよ。

この章の復習

サンプルアプリに機能を追加するためには、

  • 定義
  • 調査
  • 実装
  • 検証
  • 修正

この4サイクルを回していくことが重要となります。これらの基本サイクルはどんな開発現場でも当たり前のように行われていることなので、意識して使ってみてください。

この記事を書いた人

【プロフィール】
DX認定取得事業者に選定されている株式会社SAMURAIのマーケティング・コミュニケーション部が運営。「質の高いIT教育を、すべての人に」をミッションに、IT・プログラミングを学び始めた初学者の方に向け記事を執筆。
累計指導者数4万5,000名以上のプログラミングスクール「侍エンジニア」、累計登録者数1万8,000人以上のオンライン学習サービス「侍テラコヤ」で扱う教材開発のノウハウ、2013年の創業から運営で得た知見に基づき、記事の執筆だけでなく編集・監修も担当しています。
【専門分野】
IT/Web開発/AI・ロボット開発/インフラ開発/ゲーム開発/AI/Webデザイン

目次