目次
※まずはじめに
未経験から一人前のエンジニアになる為に一番やってはいけない事は、「闇雲にプログラミング学習をしてしまう」事です。正しい前提情報を知らないままプログラミング学習を始めてしまうと、エンジニアになるまでに何倍もの時間がかかってしまいます。プログラミングを始める前に必ず知っておくべき情報を網羅的にインプットする事で、正しい手順と正しい心構えでプログラミングに臨める状態を目指します。
- 「どのようにプログラミング学習を進めればよいのだろう」
- 「エンジニアになるためにはどのような手順が必要なのか」
- 「最速でプログラミングを身につけるためのコツが知りたい」
そして何ができるようになるか?
- 最短でプログラミングを習得できるようになる
- プログラミングでどんなモノを作れるようになるのかイメージが湧く
- エラーの解決方法がわかる
- オリジナルアプリの開発工程がわかる
Ryo's Blog
〜プログラミングの前提知識を身につけよう⑥〜 | Ryo’s Blog
※まずはじめに 未経験から一人前のエンジニアになる為に一番やってはいけない事は、「闇雲にプログラミング学習をしてしまう」事です。正しい前提情報を知らないままプログ…
オリジナルWebアプリを開発する方法
- まずはサンプルアプリを開発
- サンプルアプリを改造して欲しい機能を追加
- 自分で企画したオリジナルアプリを開発
まずはサンプルアプリを開発してみよう
このように、モチベーションが上がったのではないでしょうか?
ただその前に、実際に手を動かしてサンプルアプリを開発し、感覚を掴む事をおすすめします。いきなりオリジナルアプリを開発するのも悪くはないですが、やる気がある分エラーなどで躓いてしまうと、「こんなはずじゃなかった」と感じてしまうリスクが高いです。その結果、挫折してしまったら本末転倒です。
そこで、まずは以下の2点について解説します。
- サンプルアプリを開発する重要性
- サンプルアプリの開発方法
なぜサンプルアプリを開発するのか?なぜサンプルアプリを開発するのか?
先ほども述べましたが、サンプルアプリを開発する目的は「オリジナルアプリ開発の感覚をつかむ」事です。サンプルアプリは、参考にするアプリがあってそれを真似して作ります。よって、エラーによる挫折率を大幅に下げつつ、オリジナルアプリ開発の感覚をつかむ事が出来ます。
いきなり自分が思い描くオリジナルアプリを開発するのも悪くはないですが、開発手順や方法などを間違えると、そこから修正するのはとても大変です。
その為、まずはサンプルアプリを完成させ、アプリがどんな手順で開発されているのかをしっかり確認したうえで、自分のオリジナルアプリを開発する準備を行ってください。
サンプルアプリを開発する方法は、主に以下の2つです。
- すでに存在するWebアプリを真似して作る
- 教材などに載っているサンプルアプリを作る
これら2つのうち効率的なのは、「教材などに載っているサンプルアプリを作る」という方法です。メルカリや食べログなど、すでに存在するWebアプリを真似してサンプルアプリを作るのもよいですが、開発手順がわかりません。
一方で、書籍や本やサイトに載っているサンプルアプリは一から開発手順が解説されていて、最後には1つのアプリが完成する内容になっています。よって、オリジナルアプリ開発の感覚をつかむには最適といえます。
サンプルアプリを改造して欲しい機能を追加してみよう
サンプルアプリが完成したら、次はそのサンプルアプリを改造して欲しい機能を追加してみましょう。とはいえ、「いきなり改造しろと言われても、アイディアやイメージが思い浮かばない!」という方もいらっしゃいますよね。そこで次は、誰にでも簡単にできるサンプルアプリの改造方法を紹介します。
どんな機能を追加するか決めよう
改造する時は、大前提としてまずどんな機能を追加するか決めなければなりません。
あなたが必要だと思う機能を、まずは3つ以上考えてみてください。
アイディアがないという方は、以下の思考法を使えば、あなた独自の面白いアイディアが思い浮かぶはずです。『好きなもの(詳しいこと)× 既存のアプリやWebサイト = 新しいアイディア』例えば、あなたが作ったサンプルアプリがTwitterのようなアプリで、あなたが写真好きだったとします。それら2つを組み合わせてみてください。
すると、「写真を埋め込みできる機能」という1つのアイディアが思い浮かびます。このように、あなたが好きなことや詳しい事をベースにして考える事で、あなた独自の面白い機能が思い浮かぶはずです。
機能を追加するための基本サイクル
続いて、先ほど決めた機能を実際に追加していく方法を紹介します。機能を追加するときは、エンジニアであれば誰でも実践している基本サイクルを利用します。
この基本サイクルは、初心者でも超一流のエンジニアでもほぼ同じで、異なるのはサイクルを回す「回数」だけです。
その基本サイクルとは、以下の5つの工程の事です。
1. 定義
2. 調査
3. 実装
4. 検証
5. 修正
それぞれ詳しく解説していくので、ぜひ活用してみてください。
1. 定義
この工程では、「作るもの」、つまり今回は「追加する機能」を定義していきます。本来この定義には、「設計」という重要な工程が必要になるのですが、趣味でアプリを作るような場合は省いてしまって問題ありません。現時点では、「写真を投稿できるようにしよう」「地図を表示できるようにしよう」「画像スライダーを配置しよう」など、先ほど思い浮かんだ機能を大まかにまとめるだけでOKです。この定義の工程でのポイントは、次の調査の工程で実装方法を調べられるように、しっかりと言葉にする事です。
2. 調査
この工程では、1つ前の工程で定義した機能を実装する方法を調査します。「調査」といっても難しい事はまったくありません。Googleなどの検索エンジンを利用して検索するだけです。実は、エンジニアにとって「検索力」はとても重要なスキルです。一流のエンジニアでさえも毎日のように検索して、わからない事などを調べています。
もちろん暗記している知識のみで作業する事もありますが、細かいコードの書き方や機能の追加方法などはすぐに検索するのがエンジニアです。プログラミングはすべてを暗記する必要がないので、暗記が苦手だという方も安心してください。なお具体的な調査方法ですが、検索バーに以下のように入力するだけです。
「言語名バージョン番号前工程で定義した機能の名前
」
例:「HTML 固定メニュー」(HTMLの場合はバージョンを書く必要はありません)
上記のように検索すると、日本語でわかりやすく解説された記事などのページが表示されます。多少慣れが必要ですが、慣れれば教材のサンプルコードを写すような感覚で、記事の指示に従って機能を追加できるようになります。もし意図した機能が検索結果に表示されないときは、定義した機能の名前(検索に使ったワード)が正しくない可能性が高いです。その時は、もう一度定義からやり直してみてください。
3. 実装
実装とは簡単にいえば、「組み込むこと」です。具体的には、1つ前の工程で調べた記事や文献を元に、写経していく事がメインの工程です。もちろん、コードを変更しなければならない箇所も出てきます。その為、ただ写すだけでなく、できるだけ記事や文献に載っているコードを解読し、理解する事を意識してみて下さい。解読や理解が難しい時は、一度すべて写してみて、動くかどうか検証してみて下さい。
4. 検証
検証は、意図した処理が実行されるかどうか確認する工程です。プログラミングの世界では、リリース前に必ず検証を行います。「追加した機能が正しく動作するか」「不具合がないか」などを確認します。そして、もしバグやエラーなどの問題を発見したら、速やかに問題の発生原因を特定します。
5. 修正
実装の工程で意図した機能が追加され、検証の工程で正しくプログラムが動作すればよいのですが、現実はそう上手くいきません。大抵の場合は何らかのエラーが発生し、動作しない事が多いです。
そんな時に必要なのが、修正です。まずやるべき事は、どんなエラーが発生しているか確認する事です。エラーが発生したときは、必ずエラーメッセージが表示されるので、そのエラーメッセージをコピーして検索しください。すると、あなたと同じエラーに躓き、そのあと解決した人たちが書いた記事や、Q&Aサイトでのやり取りなどが検索結果に表示されます。そして、その情報をもとに解決策を探して実行します。
しかし、エラーが発生せずエラーメッセージが表示されない時は、このような調べ方ができません。そんな時はもう一度実装の工程で参考にした情報を見直し、「写し間違いはないか」「変更すべき箇所はないか」などを精査してください。それでも不具合が解消されない場合は、実装の工程で参考にした情報の中に、正しく理解できていない箇所があるはずです。
そのような箇所について検索して調べたり、書籍を読んだりして理解を深めて下さい。すると、コードの中の修正すべき箇所が見えてきます。
自分で企画したオリジナルアプリを開発してみよう
続いて、いよいよオリジナルアプリの開発に移っていきます。オリジナルアプリの開発では、サンプルアプリの開発と同じように、先ほど紹介したプログラミングの基本サイクルを活用します。
ただし、より多くのエラーが発生するなど、サンプルアプリと比べると難易度は大きく上がります。そこで、ここではオリジナルアプリ開発に必要なものや開発するためのコツを紹介します。このノウハウを生かせば、オリジナルアプリ開発をより効率的に進められるようになります。
オリジナルアプリ開発に必要なもの
まずは、オリジナルアプリ開発に必要なものを紹介します。
それは、以下の2つだけです。
- 作りたいWebアプリのアイディア
- 作りたいWebアプリに必要な技術的知識
作りたいWebアプリのアイディア
まず始めにWebアプリのアイディアを出して、何を作るか決めてください。アイディアを出す時に有効な方法が、「『誰の』『どんな』課題を解決するのか」を考える事です。世の中に存在するあらゆるアプリは、ユーザーにとって「便利」だからこそ利用されています。便利であるという事はつまり、「ユーザーが抱える何らかの課題を解決している」という事です。
あなたが実際に今抱えている悩み(課題)を探して、それらを解決できるアプリを作れないかどうか考えてみると、アイディアは出しやすくなります。前記事でも「『オリジナル』を生み出すアイディア思考法」について解説しているので、アイディアを出す時に詰まってしまったら読み返してみて下さい。
作りたいWebアプリに必要な技術的知識
次に、作りたいWebアプリに必要なプログラミング言語を学習してください。一般的にWebアプリを開発できる言語としては、RubyやPython、PHP、Javaなどが有名です。これらの言語を同時に使うのは難しいので、この中から1つを選んでください。
オリジナルアプリを開発するコツ
ここまでは、オリジナルアプリ開発に必要なものを紹介しました。
次は、オリジナルアプリを開発するコツを紹介します。オリジナルアプリを効率よく開発するコツは、以下の3つです。
- サンプルアプリを土台にして作る
- エンジニア向けのQ&Aサイトを利用する
- 便利なツールを使いこなす
これら3つのコツを意識するだけで、オリジナルアプリ開発にかかる時間を大幅に減らせます。
サンプルアプリを土台にして作る
サンプルアプリに機能を追加する方法を学びました。今回はその応用です。インターネット上には多くのサンプルアプリが存在します。それらの中から、「あなたが作りたいWebアプリにそっくりなサンプルアプリ」を探してみてください。あなたの理想に近いサンプルアプリを見つけられれば、自分で書くコードの量を大幅に減らし、開発を楽にできます。
オリジナルアプリと聞くと、つい「完全にオリジナルなWebアプリ」をイメージしてしまいがちですが、最初のうちはあなたのイメージに近いサンプルアプリを参考にするのが大切です。もしオリジナルに近いWebアプリを最初から開発したいのであれば、サンプルアプリをベースにして、「自分が好きなもの」を掛け算して企画を考えてみると、独創性の高いWebアプリの企画を考えられます。
エンジニア向けのQ&Aサイトを利用する
どうしても自分で作りたいものがあった時、その方法をいくら探しても見つからない事があります。そんな時は、エンジニア向けQ&Aサイトを利用する方法があります。検索ワードを知らないだけで、実は欲しい情報が存在する事も少なくありません。Q&Aサイトで実現したい事を丁寧に情熱を持って伝える事で、先輩エンジニアたちがきっと力になってくれるはずです。
また、「技術的な質問をする能力」はあらゆる場面で役に立つスキルなので、回答数が多い質問などを見て「良い質問の仕方」を学んでください。
便利なツールを使いこなす
世の中には、アプリ開発をより効率的に行うための便利なツールがたくさん存在します。ここではモックアップを作成するときに便利なツールを再掲します。これらのツールは有料、無料、一部無料など料金体系が様々です。「日本語に対応しているか」「使い勝手が良いか」など、実際に使ってみて自分に合うツールを探してください。
なぜ初心者がWebアプリ開発でつまずくのか?
- 初心者がつまずく原因は「エラー」が8割
- Webアプリ開発でよくある失敗談
初心者がつまずく原因は「エラー」が8割
初心者がWebアプリの開発中に躓く原因の8割は、「エラー」だと言われています。プログラミングにはエラーがつきもので、経験豊富なエンジニアでさえも、エラーには日々悩まされています。経験豊富なエンジニアはエラーの原因をすぐに突き止めて解決しますが、初心者にはそれが大きな壁となって立ちふさがります。
エラーはプログラミングに必要である
初心者は、エラーが発生しないのが正常で、良いことだと考えがちです。
しかし、エラーがまったく発生しなければ、以下のような不都合が生じます。
- プラグラムが正常に動いているかどうかわからない
- そもそも書いたコードが合っているかどうかすらわからない
- 間違っている箇所がわからないので、原因を特定しにくい
また、異常なコードがあるのにそのまま放置して動作させておくと、セキュリティホールの原因にもなり、ハッキングの対象になってしまうおそれがあります。エラーは悪いことであると考えがちですが、エラーがまったく発生しなければ重大なことがわからず、大きなリスクが生じてしまいます。
エラーとバグの違い
エラーとバグはよく混同されがちです。ここではエラーとバグの違いを解説します。
まずエラーとは、プログラミング言語に標準搭載されている仕組みの事で、「例外」とも呼ばれます。プログラムが正常に機能しているかチェックする為に、意図的に特定のエラーを発生させる事もあります。このように意図的に特定のエラーを発生させる事も出来ますし、エラーが発生したときの挙動を変更する事も出来ます。エラーはプログラミングにおいて、必要不可欠なものです。
一方で、バグとは「意図していない動作」の事を指します。
- 「きちんとコードを書いたはずなのに……」
- 「急にアプリが動かなくなってしまった……」
このように、意図してしない動作が起こるのは日常茶飯事です。実は多くの初心者が解決できないのはエラーではなく、このバグです。バグが生じた結果、エラーが発生しただけにすぎません。
初心者がエラーにつまずく3つの理由
理由1. 解決する手順を知らない
エラーを解決する為の方法は、原因によって様々です。ただし、ある程度決まった手順があります。エンジニアはその手順や経験を元に、エラーの原因を素早く特定します。エラーと向き合った経験が豊富であればあるほど、エラーの解決は早くなります。一方で、初心者はそもそもエラーを解決する手順を知らないので、どうすればよいかわからず迷走してしまいがちです。
理由2. 慣れていない
当然ですが、初心者はエラーの解決に慣れていません。その為、一つ一つ考えながら時間をかけて解決します。エラーを解決する経験をある程度積めば、自分がミスしやすいポイントがわかるだけでなく、エラーログを見ただけでその原因がわかるようになります。このように、エラーを解決するまでの時間は「慣れ」によって短くなります。つまり、エラーでつまずかないようにするには、数をこなさなくてはなりません。
理由3. 相談相手がいない
初心者にとって、プログラミングはわからない事だらけで、できないのが当たり前です。解けない問題について何時間、何日も考え続けていると、嫌気がさしてモチベーションが下がってしまいがちです。そんな時、知識がある人に相談すれば、それらの問題を解決できるだけでなく、質問する時に問題が頭の中で整理されます。
一人だと解決に何時間、何日もかかるようなエラーが、知識がある人に相談するだけで、ほんの数分で解決する事はよくある話です。このように、相談できる相手がいるかどうかで学習効率は大きく変わります。
Webアプリ開発でよくある失敗談
続いて、Webアプリ開発でよくある失敗談を紹介します。これからWebアプリを開発しようと考えている人にとって、あらかじめどんな失敗が起きやすいかを把握しておくだけで、失敗する確率を大幅に減らす事が出来ます。これらの失敗談を頭に入れておき、これからWebアプリを開発する時の参考にして下さい。
Webアプリの開発期間を決めずに失敗するパターン
学習計画を立てないまま学習を始めてしまう初心者は多いです。学習計画を立てずに学習を進めても、「何のために学習しているのか」がわからなくなり、学習が長続きしません。
また、作りたいWebアプリのイメージもない為、学習すること自体が目的になってしまい、挫折してしまう人が多いです。途中で挫折してしまわないように、「いつまでにどんなWebアプリを作るか」を明確にイメージしておく事が大切です。
この「いつまでに」という期間が決まっていれば、学習をどれくらいのペースで進めていけばよいかイメージしやすくなります。また、「どんな」Webアプリを作るか決まっていれば、学習する順番や内容も考えやすくなります。
Webアプリをすぐ形にしたくなって失敗するパターン
作りたいWebアプリが決まるとワクワクしますよね。そのとき初心者にありがちなのが、それを「すぐ形にしたくなってしまう」事です。ある程度プログラミングの基礎が身につくと、「もうWebアプリを作り始めてもよいのではないか」という考えが生まれます。
しかしその状態のままWebアプリを作り始めても、開発手順などをしっかり考えて開発しなければ、思わぬエラーなどで躓き、そのまま挫折してしまうパターンもあります。そうならないように、サンプルアプリなどを作りながら開発の経験を積み、開発手順などを自分で考えられるように学習して下さい。その後でWebアプリの開発を始めれば、失敗する確率を大幅に減らせます。
同じファイルを作成して失敗するパターン
過去に一度作成したファイルをしばらくしてから再び作成してしまう事があります。コードを書いている途中で既視感を覚え、確認してみるとすでにそのファイルが完成していたりします。このような無駄な作業を防ぐ為にも、どの作業まで完了しているか進捗を把握してください。
間違った箇所を修正して失敗するパターン
エラーが発生し、コードを修正してもエラーが解決しない場合によくあるのがこのパターンです。初心者はエラーの原因を特定するのに慣れていない為、コードを修正する箇所が間違っているケースが多々あります。コードを修正する時は、「どこをどう修正したのか」がわかるように管理してください。
それぞれのファイルの役割を把握できずに失敗するパターン
Webアプリ開発を進めていくと、ファイルの数がどんどん増えていきます。不慣れな初心者は、どのファイルがどんな役割を持つのか、徐々に把握できなくなってしまう事があります。ファイルの役割を把握する事は、開発の効率を上げたり、エラーの発生時にすばやく解決したりする為に重要です。始めのうちはリストを作り、それぞれのファイルの役割を整理して下さい。
ファイル名の付け方を失敗するパターン
仕事でWebアプリを開発する場合、命名規則に従ってファイル名やメソッド(関数)名などを付けなければなりません。一方で、個人でオリジナルアプリを開発する場合は、このような命名規則に従う必要はなく、自由に名前を付けられます。
その為、名前を長くしたり日本語にしたり、適当に付けたりする事があります。そうすると、あとから見直した時に、それぞれのファイルがどんな役割を持つのかひと目でわかりにくくなり、ファイル名を変更する必要が出てきます。
しかしその際、そのファイルが他のファイルから呼び出されている可能性がある為、ファイル名を変更するときは十分に注意が必要です。
選択する言語を間違えて失敗するパターン
初心者はプログラミング言語の違いがよくわからない為、学習を始める時におすすめされた言語や今話題になっている言語を選ぶパターンが多いです。しかし学習を進めていくうちに、「この言語では自分が作りたいWebアプリが作れない!」と後から気づく人が多いです。
その他にも「就職したい企業が別の言語で募集していた」など、選択する言語を間違えた事に後から気づく事が多いです。そうならないように、「作りたいWebアプリにはどの言語が適切か」「就職したい企業がどの言語で募集しているか」などをあらかじめ確認してから言語を選んでください。そうはいっても、自分で言語について調べるのはなかなか面倒ですよね。
書籍・本
出典:エラーで学ぶScratch まちがいを見つけてプログラミング初心者から抜け出そう
本書では、よくある典型的なエラーをあらかじめ含むプログラムを示して、その原因を考え、エラーを修正することを通して、より深くプログラミングを学ぶことを目的としています。エラーが発生する原因は複数あり、その原因を学ぶことはプログラミングを学ぶ上でとても役に立ちます。
プログラムには「エラー」がつきものです。エラーの原因を考え、修正のための試行錯誤を繰り返すことになります。この過程で「よく考える」ことになります。そうやって鍛えられた思考力は、別のプログラムを作成する際にも転移し、応用されます。それがプログラミング的思考です。
そのためには、良質な問題による適切な試行錯誤の体験が重要です。既存の教科に良質な参考書や問題集が存在するように、プログラミングにも良質な試行錯誤を提供する書籍が存在するといい――それが本書の存在価値です。エラーを修正していく過程でプログラミング的思考を鍛え、組み合わせ、自分の考えにつなて、さらに改良を加えて、プログラミングの世界の楽しさを味わってください。
以上が私のオススメ本になります。気になる方や読んでみたいと思っている方は、参考になりますので、ぜひ読んでみて下さい。
まとめ
- まずはサンプルアプリを作ってみることが、オリジナルアプリの開発につながる
- プログラミングには、「定義・調査・実装・検証・修正」という基本サイクルがある
- オリジナルアプリ開発には、「サンプルアプリを土台にする」「Q&Aサイトを利用する」「ツールを使いこなす」といったコツが存在する
- 初心者がつまずくほとんどの原因は「エラー」である
- エラーはプログラミングに必要である
- 初心者がエラーにつまずく原因として、「解決する手順を知らない」「慣れていない」「相談相手がいない」などが挙げられる
- よくある失敗談を頭に入れておけば、失敗する確率を大幅に減らせる
次回は、プログラミングの前提知識を身につけよう⑧を記事にしますので、お楽しみを!!