目指せ年収1000万PGタイトルロゴ
IT業界の底辺職であるプログラマーが年収1000万円を目指す生き様を各年収事に綴った自分史型ブログ



【STEP1】簡単なTODOWebアプリの土台作成


twitterエンジニア育成プロジェクトスタート

さっそく学習フェーズに入っていこうと思います。今回のテーマはHTMLで画面を作るです。 比較的簡単な内容になりますが、プログラミング学習サイトによくある穴埋め形式ではなく 検索して調べて実施する形式で進行していきます。




1.ググるスキルを身につけながらの作成

noimage

本プログラムでは開発すると同時に「検索スキル」を身につけていく流れで進めていきたいと思います。


なぜなら本職のプログラマーさんは仕事中にかなりググります。昨今のIT業界は新しい技術が大量に溢れかえり、常に情報がうごいているからです。


その動いている情報を随時掴みながら仕事をする必要があるため、情報検索スキルはかなり重要です。


筆者は古い(おっさん)エンジニアなのですが、20年前にまず最初に身に着けたスキルは検索エンジンから情報を引き出すスキルです。(当時、Googleはあまり有名ではなかったのでGooという検索エンジン使ってました)


(検索スキルをみにつけるまでは大量に本を持ち歩いてましたw)




2.与えられる【課題】に慣れてはいけない


noimage

ネット上にある学習サイトやスクールで学習したことのある人なら分かると思うのですが、与えられたお題に対して答えを埋めるといった形式の学習が良く見られます。


学生時代のドリル形式に近く、多くの人がすんなりと学習に着手でき、勉強してたらいつの間にか動くプログラムがそれなりに作れてしまうといった感覚におちいりますよね。


でも学習が終わった後次は何をすれば良いのだろう?と手が止まってしまいます。


仕方なく、同じ課題をもう一周してみようという行動に出てしまった事はないでしょうか?1回目より理解度が上がっているので2回、3回と進めていく事でレベルアップしている自分に満足して安心感という「よりどころ」を見つけそこで満足してしまいます。


その状態になったという事は与えられる事になれてしまったと、いう事です。


筆者は開発スキルには自信があったため、20代から教育担当等をよくしていたのですが、良かれと思い虫食い式の課題を新人に次々と与えてしまい、新人さんを「次は何をすれば良いのでしょうか?」という指示待ち技術者にしてしまったという苦い思い出があります…


なので本プログラムでは自分で考えるといった部分に重点を置いて進めていこうと思います。




3.作るものはポートフォリオ用TODO


noimage

「自分で考える」と、いいましたが「じゃ、後はよろしく!全部考えてね!」というわけにはいきませんね。。。なので本筋となるお題やポイントはこちらから提案します。


本プログラムに参加していただいているメンバーはエンジニアになりたいというメンバーが多いと思うので就職活動時に使えるポートフォリオ(何んらかの実績)を作ろうかと思っております。


お題として簡単なTODOアプリをあげます。イメージは3章の画像のイメージです。まずは上記画像から「こんな機能なんだろうな?」と考えて下さい。


自分で考えるに重点を置いているので「自分は○○○が作りたい!」といった意見があれば大歓迎です。遠慮なく言って下さい。


検索エンジン等からこのサイトへたどり着いた人は「え?意見大歓迎って言っても だれに意見するんだよ?!」となると思うので。Twitterの@ebiebi_pgまでDMください




4.HTMLで入力フォーム、入力結果欄を作ってみる


noimage

さて、さっそく本題に入ります。この章は「HTMLもあまり理解していないけど…」といった人でも理解できるように基礎的な部分から手助けできるように書いております。既にHTMLの理解がある人は飛ばしてもらってかまいません。


まずは画像イメージ章の図を見て下さい。3章の画像イメージについて少しかみ砕いて説明しております。


ここでの説明ではあえてタグ名(HTMLを作る部品名)では説明していません説明文を見て自分なりに考えて検索してもらいたいからです。


4章の画像イメージっぽいHTMLを自分の力で作ってみて下さい。
ただし、HTMLの基礎知識が無いとハードルは高いので基礎知識についても自分で検索して調べてみて下さい。


ただ、分からない事があればどんどん「DM」を下さい。質問来たら答えます。
「それって結局自分で考えてもらってるんじゃなくて教えてるんじゃ?」と、思うかもしれませんが【有識者に質問する】というスキルも【自分で考える】と同じく重要スキルです。


でも、、、今の時代の技術サイトは優良サイト、ただのアフィリサイト入り混じった時代なので「ここを見てーーー」「ここの情報見たら分かるよー」ってむっちゃ言いたい! 超言いたい!!(*´Д`)ゲホッゲホッ




5.次回記事が答え合わせ

今回の記事はここで終わりです。


よくある「正解のソースはこれだ!」っていうのは無し。それ作っちゃうと皆がおんなじ正解を作る学習になります。プロの現場で一番嫌われるコピペエンジニアの育成だけはしたくないのです。なので作ったソースをUpLoadする用のサーバを準備しますのでそこへ作った作品をUpLoadしてもらう事になります。


なので、次回記事の答え合わせは「UpLoadしてみんなで見てみる」です。


「UpLoadするも何も、HTML分からない!!」「作ってみたはいいけど、これUpLoadしてもいいんだろうか?…」という人はDMでご質問お願いします!


※UploadするHTMLはスタイル等意識してなくてもOKです。後々フォローします