超初心者向け！プログラミング学習の始め方～HTML/CSS編～
世の中が機械化してきて、手に職をつけないと仕事がなくなる…と焦る声をよく聞きます。
実際、全てが機械になるわけではないと思うので、そんなことはないと思いますが、事実セルフレジが増えて店員が減る…というお店も多くなりました。
手に職をつけようと思って、IT系に進む人も多くいます。
色々調べて、プログラミングをやってみたい！と思ったとき、どのような始め方が効果的なのか。
今回は、私が実際に実施したHTML/CSSの学習方法を書きます。
ITについて調べる
まず、エンジニア・プログラマーなど様々な言葉があり、どの人が何をしているのかわからないという問題が大前提にありました。
とりあえず色々調べてみました。
一般的なWebサイトでは、サイトのデザインを考えるWebデザイナーやユーザーが目にして触る部分を作成するフロントエンドエンジニア、そのサイトが動いてサービスとして稼働するよう構築するサーバーサイドエンジニア、運用・保守を担当するインフラエンジニアなど様々な仕事があります。
上記は一例で、フロントエンドがどこまで、インフラエンジニアがどこまで、といった明確な決まりはないので、会社やプロジェクトによって変わることもあります。
その他にも開発エンジニアの中にも多数、インフラエンジニアの中にも多数の職種があります。
職種や業務内容を調べ、自分がやりたいことに近い職種や、興味のあるものを始めましょう。
私は特に決まっていなかったので、とりあえず未経験OKでお給料をもらいながらスクールに通わせてくれる会社に入社しました。
ちなみに今回書くHTML/CSSは、Webサイトを作成する際に使用する言語で、Webデザインを実際のブラウザで表示できるようにするために使います。
HTMLで文章や画像を設置し、CSSで装飾を行うことで、デザインを形にしていきます。
情報収集をする
目指す職種が決まったら、情報収集をします。
エンジニアになる方法は様々です。
どの手段が自分に相応しいか判断するためにも、情報収集を行います。
エンジニアになる第一歩としては、
・スクールに通う
・学習サイトで勉強する
・未経験OKな会社に入社する
などがあります。予算や時間との兼ね合いや自分の性格によって合う方法は様々です。
サイトでその職業を調べる他、TwitterやブログなどのSNSで、他の人がどのような方法で学習を進めてみるか調べてみましょう。
また、スクールや学習サイトもたくさんあるので、どのサービスがよく使われているかみてみるとよいと思います。
私の場合、エンジニアになりたいというざっくりした気持ちだったため、エンジニアの人材を派遣する会社に入社し、その会社で1ヶ月スクールに通わせてもらい、インフラエンジニアに必要なLinuxの資格を取得しました。
業界に慣れるうちに、Webエンジニアに興味を持ち始め、知り合いのエンジニアから助言をもらいながら、独学でHTML/CSS/JavaScriptの勉強を始めました。
HTML/CSS/JavaScriptは、就業中の学習のため、学習サイトなどを利用して独学で進めることにしました。
今回は私が行った、独学で学習を進める手順として書いていきます。
Progateで知識をつけながら手を動かす
HTML/CSSの学習方法で私がまず利用したのはProgateというサービスです。
Progateは、スライドでイラストと文字を使って概要から詳しく説明してくれます。
説明のあとには演習があり、見本を見ながらサイト内のテキストエディタに入力していきます。
開発環境を用意する必要もなく、見本があるのでとてもわかりやすいです。
また、基礎の基礎から学習することができ、自分のペースで次に進むことができるため、まず始めてみる第一歩としておすすめのサービスです。
一から知りたい、とりあえず慣れたい、そんな初心者に便利です。
中級編からは有料となるため、一旦初級編を完璧にするのもよいと思います。
私の場合、就業先にパソコンを持って行けないため、就業先の休憩中に復習ができるよう、ノートに書いて覚えたりしていました。(これが良いかはわかりませんが…)
ドットインストールで慣れる
Progateの初級編で基本的な知識をつけてコードを書くということに慣れてきたら、ドットインストールで知識を深めながら慣れていきます。
ドットインストールでの学習には、Progateと違ってテキストエディタが必要なので、開発環境を整えておく必要があります。
開発環境の構築方法は以下記事で紹介しています↓
ドットインストールは動画での学習となり、音声が流れます。
話すスピードが結構速いので、Progateで知識をつけていないとついていくことが難しいかもしれません。
ですが、テキストエディタを利用しながら便利コマンドも教えてくれるので実践的な内容となっています。
ただし、こういった学習サイトはあくまでも基本となり、実際の業務では学習したやり方でない場合もたくさんあります。
なので、あくまでも基礎として覚え、実業務では応用・臨機応変な対応が必要だということを心に置いておいた方がよいと思います。
他のエンジニアと交流する
独学で学習を進める場合、どうしても孤独な戦いになります。
一人で黙々と進めることが好きだったとしても、一人だと情報が入ってこなかったり、悩んだりつまずいた時に解決できず挫折してしまうこともあります。
スクールが無料開催しているセミナーやエンジニアが集まる交流会に参加するなど、直接顔を合わせる方法のほか、Twitterやサイトでエンジニアのコミュニティに参加するのもよいです。
人脈を作っておくと学習中も、仕事を始めても役に立ちます。
孤独ではない、みんな一生懸命取り組んでいるという強い励みになります。
アドバイスがもらえたり、自分が覚えたことをアウトプットすることで、知識を身につけることもできるので、交流は作っておきましょう。
作品やポートフォリオを作成する
ある程度知識がついてきたら、作品やポートフォリオを作成します。
まだできることが少ないうちは、サイト模写やサンプルコードを使って練習するとよいと思います。
サイト模写を課題とするサービスもありますし、調べるとサンプルコードやサンプル画像を紹介しているページもあるので、それらを利用して練習しましょう。
ポートフォリオとは、自分の実績をアピールするための成果集のことです。
実績がない人は、実績を作ればいいのです(笑)
Web上でポートフォリオを公開するWEBポートフォリオと紙で提出するポートフォリオがあります。
Webデザインに力を入れたい人は、紙版がよいと思います。
プログラミングに力を入れたい人は、WEB版で実際に動くものを見せた方がよいでしょう。
提出を求められることはあまりないかもしれませんが、自分の成果を見せるだけでなく、ポートフォリオそのものが成果物のようなものなので、評価の対象となります。
まず自分のできることで何か成果物を作成してポートフォリオを作ってみましょう。
ポートフォリオの詳細については、調べてみると作り方や他の人のポートフォリオが閲覧できるので参考にしてみてください！
仕事を探す
ある程度できるようになったら、実際に仕事を探しましょう。
まずは、自分が企業に所属してスキルアップを目指すのか、フリーランスとして働くのかを決めます。
企業に所属する場合は、エンジニアを客先へ常駐させて働く会社や、自社開発・受託開発として自社で勤務する会社があります。
自分が習得したスキルに見合った会社を選びましょう。
転職サイトを利用して転職するのもよいですが、転職エージェントに紹介してもらう方法だと相談ができ、自分でも働ける会社を紹介してくれるのでよいと思います。
フリーランスとして働く場合、すでにエンジニアとのパイプがあれば、案件を紹介してもらえるかもしれません。
そういったコミュニティが確立できていない場合は、フリーランス向けに案件を紹介してくれる会社もあります。
ただし、ほとんどの場合実務経験が必要なので、自分で何かサービスを作成できていない場合は、一度企業に就職するか、パイプを利用して案件を手伝わせてもらうところから始めた方がよいと思います。
働き方の善し悪しは、人や企業によるため一概には言えません。
そのため、情報収集や交流がとても大切になります。
自分に合った働き方や学習方法を見つけて、頑張りましょう！
