プログラミング未経験から始めるための入門講座

2020年6月13日

プログラミング未経験から始めるプログラミング入門講座
プログラミング未経験から始めるプログラミング入門講座

どうも、UT(@ut_1029)です。

プログラミング未経験から始めるプログラミングの独学方法を紹介したプログラミング入門講座の記事まとめです。

✔️ この記事の権威性
自分はプログラミング歴10年以上のプログラマーです。
 →「プログラミング未経験の新卒が10年間プログラマーとして仕事して思うこと

プログラミングの始め方

プログラミングを始めるために「どうやって始めたらいいの?」「何から始めたらいいの?」と悩んでいる人が多いと思います。

✔️ これからプログラミングを始めようとしている人に向けた記事を紹介します。

プログラミング初心者におすすめ出来る1つのプログラミング言語

プログラミングの学習を始めようと思っている人で「どのプログラミング言語で始めたらいいの?」「初心者でも始められるプログラミング言語はどれ?」と迷っている人にオススメするプログラミング言語を紹介します。

✔️ プログラミング初心者にオススメのプログラミング言語とは
JavaScriptからプログラミング言語の勉強を始めることをオススメします。

✔️ プログラミング初心者にJavaScriptをオススメする理由
JavaScriptをオススメするのは「すぐにプログラミング言語の勉強を始められる」からです!

ただ、プログラミング言語の勉強を開始する前に行うハードルが高い難しい作業があります。

✔️ プログラミングの勉強で挫折してしまう落とし穴
プログラミングの勉強をすぐにやめてしまう落とし穴として「プログラミング言語を動作させるための環境構築」という工程があります。

この環境構築というのは、初心者にはハードルが高い作業です。なので、プログラミングの勉強をする前の環境構築で挫折する人が多いです。

ですが、JavaScriptは環境構築が不要なのです!

そんなJavaScriptでプログラミング勉強を始めるオススメした理由について「プログラミング初心者におすすめ出来る1つのプログラミング言語」で詳しく紹介しているので、是非ご覧ください。

JavaScriptでプログラミングを始める方法

JavaScriptでプログラミング勉強を始めたけど「JavaScriptって何?」「JavaScriptの特徴を知りたい」といった人へ解説します。

✔️ JavaScriptの特徴
JavaScriptを利用することで、Webサイトにアニメーションなどの動きを持たせることが出来ます。

✔️ JavaScriptは利用シェアが高い
現在のWebサイトでJavaScriptを利用していないサイトはないと言っても良いぐらい利用されています。

またJavaScriptでプログラミングを始める手順やサンプルコードの紹介など「JavaScriptでプログラミングを始める方法」で紹介したので、是非ご覧ください。

【初心者】JavaScriptでプログラミングを始める方法を解説【プログラミング初心者の入門講座】

プログラミングの基本知識

プログラミングのサンプルコードで基礎知識を分かりやすく解説した「プログラミングを独学で勉強中の初心者向け」の記事紹介をします。

変数とは?プログラミング初心者が悩む変数について解説

プログラミングを始めてすぐに出会う変数。

✔️変数を理解するポイント
変数は「箱」をイメージすると理解しやすくなります。

プログラミング初心者で「変数って何?」「変数名にルールってあるの?」などの悩みについて「変数とは?プログラミング初心者が悩む変数について解説」で詳しく解説しました。ぜひご覧ください。

【初心者】変数とは?JavaScriptで変数について解説【プログラミング初心者の入門講座】

ifとは?プログラミング初心者が悩むifについて解説

プログラミングを始めると演算子if文に出会います。

✔️if文を理解するポイント
日本語で「もし~ならば」と読むとイメージしやすく理解が早くなります。

プログラミング初心者が悩むif文について「ifとは?プログラミング初心者が悩むifについて解説」で詳しく解説したので、ぜひご覧ください。

【初心者】ifとは?プログラミング初心者が悩むifについて解説【プログラミング初心者の入門講座】

配列とは?プログラミング初心者が悩む配列について解説

変数を使ってプログラミング出来るようになると、次に配列について理解する必要があります。

✔️配列を理解するポイント
配列は、変数を収納する「タンス」をイメージすると理解しやすくなります。

また配列を理解できるとプログラミング技術が飛躍的にアップします。

【初心者】配列とは?プログラミング初心者が悩む配列について解説【プログラミング初心者の入門講座】

ループとは?プログラミング初心者が悩む繰り返し処理のループについて解説

プログラミングではループという「繰り返し同じ処理を実行する」構文があります。

✔️ループの種類
ループには「for」「each」「while」などの種類があります。

ループを使ったサンプルコードを紹介して詳しく解説しているので、是非ご覧ください。

【初心者】ループとは?プログラミング初心者が悩む繰り返し処理のループについて解説【プログラミング初心者の入門講座】

Ajaxとは?プログラミング初心者がJavaScriptで悩むAjaxについて解説

JavaScriptでプログラミングしていると出会うAjaxについて解説します。

✔️Ajaxとは
Ajaxとは、Asynchronous JavaScript + XMLの略で簡単にいうと「JavaScriptで非同期通信してサーバと通信すること」です。

Ajaxは、現在のWebサイトではよく利用される技術です。そんなAjaxについて「Ajaxとは?プログラミング初心者がJavaScriptで悩むAjaxについて解説」で紹介したので、是非ご覧ください。

【初心者】Ajaxとは?プログラミング初心者がJavaScriptで悩むAjaxについて解説【プログラミング初心者の入門講座】

Webサイトの仕組み

ホームページとは?Webサイトとホームページの違いについて解説

ホームページが表示される仕組みやWebサイトに必要な技術を解説して紹介します。今回は、ホームページとWebサイトの違いを解説します。プログラミング初心者は必見の内容です。是非ご覧ください。

ホームページとは?Webサイトが表示される仕組みについて解説

ホームページが表示される仕組みやWebサイトに必要な技術などを解説して紹介します。今回は、Webサイトが表示される仕組みやHTTP通信について解説します。プログラミング初心者は必見の内容です。是非ご覧ください。

【Web講座】ホームページやWebサイトが表示される仕組みを解説〜HTTP通信〜【プログラミング初心者の入門講座】
【Web講座】ホームページやWebサイトが表示される仕組みを解説〜プログラミング勉強〜【プログラミング初心者の入門講座】

プログラミング初心者向けのサンプルコード解説

小規模なプログラミングのサンプルコードを紹介して、実戦に近い形で解説した「プログラミング初心者向けのサンプルコード解説」の記事を紹介します。

✔️ 実際にプログラミングして勉強する
ソースコードを模写してプログラムを動かしながら1行ずつ理解して勉強できるようになっています。

✔️プログラミングの勉強について
実際にコードを書かないと実務で使える知識は、なかなか身に付きません。なので、実際にコードを書いて勉強するのがポイントです。

JavaScriptのサンプルコード解説

JavaScriptを使ったプログラミングのサンプルコードを紹介&解説した記事を紹介します。
(Webサイトの作成などでよく使う技術を中心にまとめました。)

JavaScriptでカレンダーのプログラミングを解説

プログラミング初心者の練習問題として出題される「カレンダー出力」をJavaScriptを使ってプログラミング解説しました。

✔️カレンダー出力のプログラミングについて
縦軸と横軸でforが入れ子になっているので、値の変化をイメージするのが難しいですが、2重ループはとても重要な技術でループの動きを練習するのにとても最適な練習問題です。

【初心者】JavaScriptでカレンダー出力プログラミングを解説【プログラミング初心者入門講座】

JavaScriptでtoggleを使ってアコーディオンするプログラミングを解説

Webサイトの開閉メニューなどで利用されるJavaScriptのtoggleを使ったサンプルコードを解説します。

✔️ toggleを使ったアコーディオン
アコーディオンとは、Webサイトの開閉メニューなどで使うアニメーションの動きです。コード自体は数行で実装できちゃいます。

【勉強】JavaScriptのtoggleでアコーディオン【プログラミング初心者の入門講座】#StudyWithMe

JavaScriptで画像スライド(カルーセル)するプログラミングを解説

画像が自動でスライドするプログラミングをJavaScriptを使って実装したサンプルコードを解説します。

✔️カルーセル(画像スライドさせる)
カルーセルをプログラミングするにあたって、無限に画像をスライドさせる制御が難しいポイントです。

✔️ポイント
画像をスライドさせた後に、移動して見えなくなった画像を最後尾へ移動させています。

【作業用】JavaScriptで画像スライダー〜カルーセル〜【プログラミング初心者の入門講座】#StudyWithMe

✔️slick.jsを使うとカルーセルの実装が簡単
プログラミングの勉強にはならないですが、こういったものを使うと開発工数を短くすることができるので、是非利用してみてください。
JavaScriptのslick.jsで画像スライド(カルーセル)するプログラミングを解説

JavaScriptでモーダル表示するプログラミングを解説

ポップアップのように自分で用意した子ウィンドウ(モーダルウィンドウ)を表示するサンプルコードをJavaScriptとCSSを使って解説しました。

✔️モーダルウィンドウ
メインの画面に被せて表示する子ウィンドウをモーダルウィンドウと呼びます。

✔️ポイント
CSSでメイン画面に子ウィンドウを被せて表示させるスタイル調整が難しいです。

【勉強】JavaScriptでモーダル表示(+CSS)【プログラミング初心者の入門講座】#StudyWithMe

JavaScriptでMatrix風の「text rain」を描画

HTML5のcanvasタグ操作の勉強として映画Matrix風のtext rainを描画するサンプルプログラムコードを解説します。

✔️text rain
上から下へテキスト文字列が流れる描写です。

✔️ポイント
時間経過で文字が少しずつ薄くなるようになっているのですが、これは透過のレイヤーを描画毎に被せることで表現しています。

【勉強】JavaScriptでプログラミング〜Matrix風の「text rain」〜【プログラミング初心者の入門講座】#StudyWithMe

PHPのサンプルコード解説

PHPを使ったプログラミングのサンプルコードを紹介&解説した記事を紹介します。

PHPでカレンダー出力のプログラミングを解説

プログラミング初心者の練習問題として出題される「カレンダー出力」をPHPを使ってプログラミング解説しました。

✔️カレンダー出力のプログラミングについて
縦軸と横軸でforが入れ子になっているので、値の変化をイメージするのが難しいですが、2重ループはとても重要な技術でループの動きを練習するのにとても最適な練習問題です。

【初心者】PHPでカレンダー出力のプログラミングを解説【プログラミング初心者の入門講座】

おわり

プログラミングは、実際にコードを書かないと実務で使える知識が身に付かず上達しません。なので、プログラマーを目指す1番の近道は、実際にコードを書いてシステムを実装することです。

小さくても何か1つシステムを実装すると、達成感や成功体験を積むことができます。また就職活動でポートフォリオとして提出することができます。

みなさんもぜひ実際にプログラミングしてスキルアップを目指しましょう!

あとここで紹介した記事以外にもたくさん記事を書いていますので、ぜひご覧ください。
UTの日常 システム記事

UT
UTの日常

当ブログ(UTの日常)を運営しているUTは「プログラミング関係の仕事をしている30代1児の父親」です。詳しくは「UTのプロフィール」をご覧ください。

UTの日常では、システム開発における LinuxPHPJavaScriptJQueryMySQLなどの知識やプログラミング技術、サーバ構築や運用などAWSをメインに知識を紹介しています。

内容としては、Webシステムの開発中や運用中に発生したトラブルやエラーの対応や解決方法をまとめた備忘録やWebシステム開発の方法を未経験者の人を対象に説明したプログラム教科書を記事にしています。
Webシステム開発の知識やプログラム技術の備忘録

2020年6月13日

Posted by UT