こんにちは！inglow開発エンジニアです。
前置きがちょっと長くなってしまったので、お急ぎの方は、「2歩目を踏み出してみる」からお読みください。

最近、まったくさわったことが無かったPythonやJavaScriptライブラリを学習してみて、基礎知識を得た後にこういうことをするといいのかなと思ったことが何点かあったので、まとめてみようと思います。
あくまでも数年プログラミングをやってきて「こうかな？」と思った事なので、この方法が必ずしも正解というわけではありませんが、現在何かのサービスを使ってプログラミングの基礎を学習している方や、新しく言語を覚えようと思っている方の参考になればと思います。
この記事で、一人でもプログラミング学習がより楽しくなればうれしいです。

プログラマーの1歩目

今ではプログラマーの1歩目を踏み出すは結構簡単だったりします。
変数や関数、if文やfor文等は解説しているブログ記事やサイトがたくさんあり、 プログラミングスクールや、解説動画等も豊富にそろっています。

ですが、これらをこなすだけでは、実際にどんな感じにプログラミングしたらいいのかイメージがつかないことも多く、「どうやって勉強しましたか」と聞かれることも多々あります。

自分の「2歩目」

自分の場合は、1歩目は通っていた工業高校での授業でした。基本的なifやforはそこで学習しました。 就職する際は若干のプログラミング知識はあったものの、ほとんどド素人の状態で、web開発会社に入社しました。
当時の先輩からギリギリ作れそうな部分を、「ざっくりこんな感じでできるから！ヨロ！」という感じで無茶ぶりに無茶ぶりを重ねられ何とかやってきたという感じで、「しっかり勉強した！」という意識は全くありません。
ですが、今となって思うと、その「ギリ作れそうな感じのところを何とか調べながら作る」ということが大事だったなと思います。
本人の学習タイプにもよるかもしれませんが、とにかく手を動かして、実行＆修正を繰り返して行くことが近道だと思っています。

プログラマーの2歩目

「とにかく手を動かす」というのは他のどのプログラミング学習サイトでもきっと書いてあったと思います。
これは、私も実際にやってきて痛感しています。
でも具体的にどんな感じで「とにかく手を動かす」をしたらいいのか…。もうちょっと具体的に紹介できればと思います。

まずは何を作るか決める

小さく最低限のアプリケーションを考えていきます。
言語や学習したい領域でどんなものを作ってみるのかは若干変わるかと思いますが、普段困っていることを考えたり、なんなら身近にある「これなら作れそう！」というもののマネでもいいです。

フロントエンド系の言語を学習したい時は、ボタンによって表示が変わったり、データを操作したりするものがいいかと思います。

• 電卓
• カウンター
• ストップウォッチ　　　など…

サーバーサイド系の言語を学習したい時は、データを登録・保存・検索・表示するものがいいかと思います。

• タスクリスト
• お買い物値段メモ
• 写真アルバム作成　　　など…

表示画面を考える

webアプリケーションで言えば、HTML・cssをコーディングしてみます。
電卓だったら、数字ボタンと各操作ボタンを配置したり、何かのリストを作るのであれば、どんな項目をどんなふうに表示するのかを考えます。
コーディングが苦手だったら、紙にどこに何を配置しようか書いたりしながら考えてからコーディングしてみます。

プログラムできそうなところを探す

どんな小さな単位でもいいので、学習した中で、「これはあれを使えばできるんじゃないか？」というところを探して、やってみます。
電卓だったら、とりあえずボタンを押したときに処理が動くようにする。処理が動いたことがわかるようにログを表示するプログラムを書いておく、
何かのリストの場合は、空でもいいのでデータが新規登録されるように処理を作ってみる、
等、一気にすべてが動かなくてもいいので、少しずつ少しずつプログラムを書いていきます。

1週間ぐらいだったらもう一度コードを見てみる

できた！と思って1週間ぐらいたってから一度自分が書いたコードを見てみましょう。
ざっくりした流れは覚えていても、他人が書いたようなコードに感じるかと思います。
コードを読む力も身に付きますし、無駄な動きをしているところを発見したり、同じような処理をしているなと感じる部分がでてくるかもしれません。
後で見直すことで見えてくることもあるので、思いついた時に見直して修正をしていくことで、より効率のいい動きをするプログラムを書く練習になります。

調べものをするときのコツ

専門用語があまりわからなかったり、エラーの言っている意味が分からなかったり…
何かを作る上で必ず「どうしたらいいかわからない」ということが発生します。
こういった時も、コツをつかめばうまく紹介している記事を探し出したりすることができるので、下記を参考にしてみてください。

エラーの内容がわからない時

エラーの内容はとにかくまず翻訳してみます。自分は英語が読めなさ過ぎてgoogleのブックマークに「google翻訳」を入れてすぐにアクセスできるようにしました。（変数名やカラム名を考える時にも役に立ちます！）
翻訳をすると何となく何をいっているのかわかってきます。
また、エラー文にはほとんどの場合、エラーが発生してる「ファイル名」と「行数」が表示されています。
たくさんのファイルが表示される場合もありますが、その中にはきっと心当たりのあるファイル名があると思うので、その場所を確認します。
また、行数は表示されていますが、その1行前（もし改行が開いていたら直近の手前の行）も確認することがポイントです。
それでもわからない場合は、エラー文をそのままコピペしてgoogle検索すると、質問サイトがヒットしたり、エラーを解消するために戦った先人たちのブログ記事が出てくるので読んでみましょう。 忘れてはいけないのは、プログラムは「超超素直」で嘘がつけません。必ずプログラム文か、入力しているデータに原因がありますので根気強く探しましょう。
ソースコードを書いた人以外が見たときに、綴り間違いを見つけてくれることもたくさんあるので、プログラムを作った人以外に見てもらうのも一つの手段です。

どうやって実装したらいいかわからない時

率直にやりたいことをgoogle検索で入力して検索してみましょう。そうすると、同じことをやっている人のブログ記事等が出てくるので参考にできると思います。
例えば、「gitでファイルを監視から外す」と検索をすると、「.gitignore」ファイルの記述にについて記載されている記事がたくさん発見できます。
「pythonで動画をプログラムで生成したい」と検索をすると、動画を生成するプログラムを紹介している記事が表示されます。
google検索は本当に進化し続けていて、とりあえず思った事やこうしたいと思っていることを打ち込むと意外と記事が見つかったりします。
見つけた記事の中に書いてある用語等がわからない時は、その単語の意味を調べながら読み進めると、専門用語の学習もできますので一石二鳥です。

プログラミングを学ぶ上で大事だと思うこと

感じるチカラ

プログラミングは論理的思考をして各ものなので、論理的な考え方が大事なのはもちろんですが、学習段階では、コードを「感じる」ことも大事です。
これは新卒当時の先輩が教えてくれたことで、当時は何言ってんのやって思っていましたが、振り返ってみると、「とりあえず」細かいことは置いといて、何をしているのか流れをざっくり把握してから、細かいことを学習することが大事だと思いました。
「とりあえず」というところも大事で、「とりあえず」にした点を片隅に置いておいて、いろんな学習を進めるごとに、つなげていくことも大事だと感じてします。

応用力と発想力

先ほどの「とりあえず」のポイントと重なる部分もありますが…。
（他の記事を読みながらコードを書く場合は特に）目の前のやりたい事を解決するためだけにコードを書くのではなく、記述の内容やどういった動きをした処理なのかを把握しながら書くことでコードの書き方の引き出しを増やすことが大切です。
具体的なプログラムのコードの書き方は後で見返せば真似して書くことができるので、覚えなくても大丈夫です。 この「引き出し」は、「これをこんな感じに処理する」というざっくりとした流れをしまうことが大切です。
覚えているに越したことはないですが……。何回も使うものであれば勝手に覚えていきます。

めんどくさがること

プログラムを書くこと自体をめんどくさがるともう何も言えませんが…笑
「この処理さっきも書いたもんな～もっかい書くのめんどくせ～」とか、「ここの処理もっと簡単に書けそうじゃない？」といった部分でめんどくさがることはとても大事です。
このめんどくさがりが、効率のいいプログラムやメンテナンスのしやすいプログラムを生むことになると思います。
「この作業めんどくせーからもっと楽にできるようにしたいな～」と、”めんどくさい”を解決しようと考えられる人もプログラマーに向いていると思っています。

さいごに

参考になるかどうかわかりませんが、私がここ最近新しいライブラリ等をつかってみた時に感じた、「第2歩目」をまとめてみました。
ここまでで慣れてきたら、今度は処理の無駄をなくしたり、同じ処理は関数にまとめてみたりクラスを作ってみたり…等まだまだたくさんありますが、あくまで「2歩目」ということでまとめてみました。
学習しながら簡単なものを作りながら書いた記事もありますので記事を紹介します。
これらは、学習しながらコードを記述していったものになります。基礎的な動きしか使っていないので、簡単につくることができます。参考になれば…。

▼python3.8でランダム配色ツール作成
https://inglow.jp/techblog/python-colormaker/

▼Angular.jsで「なんでもカウンター」作ってみた
https://inglow.jp/techblog/anguler-nandemo-counter/