プログラム初心者に教えたときの内容をまとめ

現役WEBエンジニアの私が、実際に初心者の方にWEBプログラムを教えた内容をまとめました。仕事では後輩などには教えたことはあるが、実際は、伝えるのは本当に難しいと実感しました。これからプログラムを教える方、プログラムは知っているけど最初は何を教えればいいのか？など悩んでいる方は、是非、参考にしてください。

おすすめライフログ LIFELOG(@osusume_life)の
かずのりです。

フリーランス15年以上の現役エンジニアです。

現在、コロナの影響で自宅で作業中の
ノマドワーカーです。

1 はじめに
2 クライアントサーバーの仕組みについて
3 サーバープログラムについて
4 フロントプログラムについて
5 Javascriptについて
6 アプリについて知ろう！
7 XAMPをインストールして動かしてみよう
8 まとめ

はじめに

WEBエンジニアの私が、自分の知っている知識を教えたいと思い、
ジモティーに「WEB教えます」というタイトルで募集しました。

その際、数名の方からお返事を頂き、是非、対面で教えて頂きたいという
熱心な生徒さんがおりましたので、早速、連絡してアポを取りました。

ちなみに、レッスン場所ですが、カフェだと席が取れるかわからなかったので、
レンタルオフィスを生徒さんに予約して頂きました。

初めてレンタルオフィスを使ったのですが料金が安く駅近だったので
次回も、そこでレッスンしたいと思いました。

現役WEBエンジニアです。宜しくお願いします。
WEBを勉強したいということですが、WEBで何かやりたいことはありますでしょうか？

ホームページとか作ってみたいです。

WEBはどのような仕組みで動いているか知っていますか？

いえ、全然わからないです。

とうことで、ホームページの表示するための
「クライアント/サーバーシステム」について説明しました。

クライアントサーバーの仕組みについて

クライアントサーバーシステムですが、情報を保存する場所(サーバー)と
通信によって閲覧できる場所(クライアント)の構成になっているシステムのことです。

略してC/Sと呼ばれています。

皆さんが作成するHTMLファイルやCSSファイルはサーバー側にファイル格納をして頂き、
クライアント側のブラウザーで閲覧してください。

サーバープログラムについて

サーバー側で実行するプログラム言語を紹介します。

皆さんが良く聞くプログラム言語は何か知っているものはありますでしょうか？

C言語やC#を聞いたことがあります。

おお、ご存じなんですね。
皆さんが良く聞くプログラム言語の殆どは、サーバー側で動くプログラム言語です。
しかもC言語の他に、Ａ言語～Ｚ言語まであるそうなんです。

その他、最近、よく聞く言語の代表例を挙げておきます

PHP
JAVA
Ruby(日本人が作成した言語、短く書けるのが特徴)
Python(AIで使用)

これらの言語は需要が多く、特に「PHP」「JAVA」のIT案件が多いんです。
ITエンジニアでも使用する言語は、この2つの言語に分かれますね。

私はスプリクト言語が好きなのでPHP派です。
※スプリクト言語とはコンパイルせずに、プログラムの行単位で実行してく言語です

フロントプログラムについて

こちらはクライアント側で直接ユーザーが確認できるプログラムになります。
WEBだとブラウザーで閲覧できる言語になります。

代表的なものはこちらになります

HTML5
CSS3
Flash
Javascript

javascirpはいろいな派閥がありますので、まずは、ピュアなjavascriptを憶えると良いでしょう。

Javascriptについて

javascriptと言ってもたくさんの書き方が存在します。

代表的なものを上げておきます

pure javascript
ECMAScript(ES2015、ES2016、ES2017、ES2018、ES2019、ES2020、ES2021)
typeScript

javascriptは毎年進化していきますので、人によって古い書き方をする人もいれば、新しい書き方で書く人もいます。

また、javasciptのフレームワークも説明しておきます。

フレームワークとはあらかじめ使う一般的な機能を事前に用意したものです。
プログラミングの補助的なもので、短く簡単に書くことができます。

代表的なものはこちらです

Jquery
AngularJS
React.js
Backbone.js
Vue.js
UnderScoreJs

javascriptのフレームワークは近年、爆発的に増えたため、どれを使うのか？は個人に委ねております。私的には一般的に使う人が多い「Jquery」がお勧めです。

アプリについて知ろう！

アプリを作成する場合、大きく分けると2種類のOSがあります。

Android
iOS

OSは2種類ありますが、プログラム言語は1つでしょうか？

いいえ、アプリ専用のプログラム言語も複数あります

Andoridのアプリを作成するプログラムについて

Androidのアプリは下記のプログラムで作成します。

Java

iOSを作成するプログラムについて

iOSのアプリは下記のプログラムで作成します。

object-C
swift

アプリを作るにはAndroidとiOSと別々のプログラムを憶える必要があるんですか？

最近は、開発コストが高いので1つの言語で両方のアプリを作成できます。

AndroidとiOSの両方が作成できる言語について

最近ではアプリを簡単に作ることができます。
しかも、1つの言語で作成することができるようになりました。

こちらも作成する方法が2通りあります。

独自の言語でアプリ作成をする方法
javascriptでアプリを作成する方法

上記2通りの方法があります。

代表的なものはこちらです

kotlin(独自言語)
cordova(javascript)
phoneGap(javascript)
VueJs(javascript)
ReactNative(javascript)

javascriptでアプリ作成したものは「ハイブリットアプリ」と呼ばれています。

ReactNativeは「facebook」でも採用されています。

XAMPをインストールして動かしてみよう

まずは、ローカル環境にXAMPを入れていつでもHTMLやCSSやPHPが書ける環境を作りましょう

手順はこちらです

XAMPPをインストールしてください（リンクはこちら)
IDEはVsCodeをインストールしてください（リンクはこちら)
VsCodeを立ち上げて、HTMLファイルを作成してください
XAMPPのhtdocsに作成したHTMLファイルを格納してくさい
ブラウザーから先ほど作成したHTMLファイルの内容を確認してください

実際に実践して一緒に確認したいと思っておりましたが、時間が来てしまい、
とりあえず、生徒さんにはXAMPのインストールをお願いして今回は終了しました。

まとめ

頭の中ではある程度の質問や回答などを用意しておきましたが、実際、教えるとなると時間配分や、どこまで教えるのか？などいろいろと考えてしまい、すぐにタイムアップしてしまいました。

人に教える事てはじめは難しいかと思っておりましたが、何回も回数を重ねていくとうまく教えられるようになります。

大切なのは、「今日のレッスンでどこまでおしえるのか？」「生徒さんの話をしっかり聞く」ということに注意してレッスンしていけばうまくいくと思います。

私的にもよい体験をさせて頂きました。

ありがとうございました。

Pocket