何から学べば良いの？プログラマーへの道①

 

 

初心者の人は今からプログラマーになりたくて勉強を始めても、沢山の情報がありすぎて、戸惑うのも無理ありませんよね。

一体何から学べばいいのか？また、勉強の方向が定まらないので結局、高額なプログラミングスクールに通うことになるかもれません。

 

僕が、具体的にWEBエンジニアに目指すために何から学べば良いか明示します。

 

本記事を読むことで、得られるメリット

 

開発環境XAMPPとVSCode

プログラマーを目指すためには、まず、プログラミングが出来なければ、話は始まりません。

プログラムを動かすには、PC上でプログラムを実行できる環境を用意する必要があります。

 

ですので、初学者が最初に学ぶべきことは「開発環境の構築」になります。

ここでは、一番構築が手軽で簡単なものを取り上げます。「XAMPP」と呼ばれる環境です。XAMPPは訳語で、正確には、

の、頭文字がつながって「XAMPP」になります。

 

要は、

WEB開発を行うための環境を各プラットフォーム上でインストールすることで、簡単に開発環境を用意しますよ。

といったものです。

 

基本的にはインストールするだけです。詳細は本ページに任せます。

https://www.apachefriends.org/jp/index.html

 

また、プログラムを実際に書く環境も必要です。

本記事では、VSCode（VisualStudioCode）を取り上げます。

 

実は、プログラム自体は、OSに付属しているメモ帳などで書くこともできます。

ですが、なぜ、プログラムを実際に書く環境が必要なのかというと、主にプログラミングしやすい便利な機能が整っているためです。

 

使わなければ、コードを書くのに、時間が掛かったり、バグを見つけにくかったりします。

また、VSCodeは無料な上、多くのプログラマが使用しているので、働く環境を考慮すると、馴染みやすいです。

 

VSCodeも基本はインストールするだけで利用できます。

VSCodeページです。詳細は本ページに任せます。

https://azure.microsoft.com/ja-jp/products/visual-studio-code/

 

開発環境は、他にもたくさん方法がありますが、僕が一番簡単だと思う方法を紹介しています。

 

本当は、開発環境も、何を使うかは個人の自由なので好きにしてもらって良いです。

ですが、初心者の方は他の情報を見て、開発環境に時間を掛けてしまうより、手っ取り早くプログラミングを勉強するフェーズに行く方が効率的です。

 

HTML・CSS・JavaScript フロントエンド言語

HTML・CSS・JavaScriptの3つはWEBアプリケーションのフロントエンド側の処理を担当することになります。

なぜ、フロントエンドと言われるのかは、WEBブラウザ自体で実行する、または、クライアント側で実行する処理だからです。

※逆に言うとサーバー側の実行処理ではない。

 

多くの場合、フロントエンドエンジニアとバックエンドエンジニアは開発の範囲が別々です。

プログラマーとして、どちらに進むかによりますが、ここではバックエンド中心の話とします。

以下、ツイートしました。

バックエンドエンジニアを目指す方も、いきなりプログラミングの勉強はやめておいた方が良いです。
僕がオススメするのは

HTML→CSSの概要→JavaScriptの概要→PHP/Rubyとかのプログラミング言語→SQLとかDB

わからなくなったら行ったり来たりで良いです。
WEBアプリ作成の過程を知ることが大事。

— ふわふわしょうちゃん@WEBエンジニア・メンター (@FuwaFuwaShoChan) September 9, 2020

 

基本はツイートで書いている通りですが、もう少し詳細の流れをステップ形式で記載します。

step
1HTML5

step
2CSS3の概要

step
3 静的WEBサイトを作る

step
4JavaScript の概要

step
5簡単な動的サイトを作る

step
6PHPのみでプログラムを書く

step
7DBと連携

step
8PHPを静的WEBサイトに埋め込み、データ取得と表示をする

 

というのが最も効率良く、WEBアプリケーション開発の大まかな流れを把握できます。

 

ここでは、「この順番に勉強していけば良いのだな」ということが明確にわかりましたね。

あとは、勉強するのみです。

 

HTML5

HTML5は、特に敷居が低いので、しっかり把握できるまで、身に付ける方が良いです。

などを意識しながら調べて、実際にVSCodeを使って、書いてみることをオススメします。

 

何か、サンプルサイトが作成できるHTML本を1冊購入し、CSSを含めて、静的WEBサイトを作成してみると、結果もついてきやすいです。

以下、評価の良いHTMLとCSSの教本です。

 

ですが、「全部」を把握、覚えようとしなくて良いです。

重要なのは、繰り返しますが、「WEBアプリケーション開発の流れ」を把握することです。

 

CSS

CSSも、掘れば奥が深いです。なので、プログラマー志望の方は概要を把握するだけで良いです。

明確に、どの辺りまで把握すれば良いかというと、

ぐらいで良いと思っています。なので、サンプル本1冊やれば十分。

※上記の記載の本1冊やれば、とりあえずOK。

 

デザインをもう少し凝りたい場合は、都度調べて定義していけば良いです。

繰り返しますが、全部を覚える必要はありません。

 

CSSの概要を把握することができれば、すぐにBootstrapを使用できるようにしてください。

Bootstrapとは、予め、デザインテンプレ－トを提供してくれる、協力なCSSフレームワークです。

 

Bootstrapがあれば、スマホ対応に必須のレスポンシブデザインも、複雑にコードを組まなくても、classを指定するだけで可能になります。

「class」などの属性の話は、HTMLを勉強すればわかります。

 

もし、今は何を言っているのかわからなくても、

「とりあえずBootstrapを覚えると何かと便利である」ということと、

「覚えるタイミング」はわかりましたね。

 

それで良いです。HTMLを勉強した後に、この記事を繰り返し読んで見てください。

 

Bootstrapのサイトは以下になります。詳細は本ページに任せます。

https://getbootstrap.jp/

 

Bootstrapを使用すると、簡単にリッチなデザインを提供してくれるので、WEB開発の勉強のモチベーションアップにもつながります。

 

また、詳細の記事を書く予定です。

ぜひ、覚えるようにしましょう。オススメです。

 

JavaScript

他のブログ記事にも一度書きましたが、JavaScriptは完全なプログラム言語です。

初心者がいきなりJavaScriptを本気で学ぼうとすると、完全に心が折れます。

 

なので、

「JavaScriptは一体どんな役目で、どんな機能を提供してくれるのか？」

といった概要を知るのみで良いです。

 

その後は、自身の興味の度合いで、自ら進んで学ぶ様な形をとると、一番付き合いやすいかなと思います。

 

僕も最初はJavaScriptで躓き、すぐに心折れました。

ですが、今後のWEB開発にとって、JavaScriptは確実になければいけない地位を築いています。

 

難癖があるプログラム言語なので、今はその癖を感じさせないような、各ライブラリが存在しています。

 

その辺りを調べ出すと、また頭が混乱してくると思うので、やはりここでも

「初学者がどこまで勉強すれば良いのか？」

ということにフォーカスし、線引きはしたいと思います。

本当に最初は、こんな位で良いです。

 

プログラムの文法などは、PHPを学んでから、JavaScriptを学ぶ方が、似ている部分もあるため、頭に入ってきやすいです。

 

その後、理想はjQueryライブラリを使えること(カレンダーライブラリを使用することが出来るなど)です。

各ライブラリはWEB上にゴロゴロ転がっているので、参考にしてもられえば良いです。

 

JavaScriptもたくさん進化を遂げていて、特に変化が激しいです。

Vue.jsとかReactとかAngularとか色々、名前を聞くことになると思いますが、業務で絶対覚えなければいけない状況なるまでは、一旦置いておいても、大丈夫です。

 

「必要になれば覚えればいいスタンス」は大切です。

 

でないと、最初の段階は覚えることが多すぎて、嫌になりますよ。

好きでたまらない、全く覚えるのが苦でないなら、どうぞお好きにしてください。

 

長編になるので、今回はここまでにしたいと思います。次回、続きをお話します。

 

まとめ

 

続きの話はコチラ