悔しい+恥ずかしい+情けない=とにかく勉強したい!

新人研修が終わったあと、会社に立ち寄った。

1ヶ月ぶりの帰社だ。

そこでエネルギー?を蓄えたので書く。

 

☆☆

 

1ヶ月前、僕はまだMacを買っていない。

それは2週間前の出来事だ。

 

だから、会社の先輩たちと話したいことがたくさんあった。

 

具体的には、Macの初期設定、環境設定、ローカル開発環境の構築などなど。

 

 

 

 

 

 

 

 

 

でも、何よりもまず1歩成長した自分を見て欲しかった。

 要は「ねえねえ!僕がんばったでしょ!」ということだ。

 

 

そんなもんだから、得意気になってた。

 

そして、今日。

先輩のプログラマーさんたちと会話。

 

結果、何もわかってない笑

 

Vagrantって何ができるの??」

えっと、、、なんだっけ?とりあえず開発環境を整えるには必要だと思うんだけど、、、

 

Rubyはどうやって入れたの??」

えっ、そういえばRubyってどうやって入れたんだっけ?っていうか、デフォルトでMacに入ってるよね???

 

Ruby on RailsからGit-Hubにどうやって上げてるの??」

えっと、チュートリアルに従ってやっただけだから、仕組み的なことをちゃんと理解してない。。。

 

 

 

というわけで、撃沈でした。

 

もちろん、会社の人たちはいじわるで質問してるわけじゃない。

最新の技術をあまり知らない人もいて、単純な好奇心からの質問だったのだ。

 

それに対してぜんぜん答えられなかった。

 

「よく分からないけど、なんかできちゃった」

ここ2週間、そんなことの連続だったなーと気付かされた。

 

それどころか、僕がジタバタしてる間に、ある先輩は最新のJavaScriptライブラリであるReact.jsをいじっていたのだ。

「Reactもう試してみた??これすごいよ!」なんてあっさり聞いてくる。

 

もうね、僕みたいなポンコツからしたら「すごい」と思えることがすごい。

たぶん今の僕が試してみても、あまりその凄さは分からないと思う。

 

 

ホントに知らないことが多すぎる。

そして学ぶべきことの多さに対して、自分の努力の足りなさを痛感する。

 

この悔しさのような、恥ずかしさのような、情けなさのような感情。

全部おもいっきりプログラミングにぶつけたい。

 

というわけで、今夜もRuby on Rails勉強します。

そして明日こそReactやろう

有言実行Mac mini購入

どうも!chuckです。

 

前回こんな記事を書いた。

 

chuck0523.hatenadiary.jp

 

ここで僕が宣言したことは2つ。

 

  1. スペックの高い新しいノートPCを買うこと
  2. 新しいWebサービスを作ること

 

今日はさっそく1番を実行しました。そんなエントリ。

 

 

☆☆

 

えーと、宣言では新しいノートPCだったんだけど、結局Mac miniを買いました。

 

 

中古です。

アキバのじゃんぱらで購入しました。

 

お値段なんと11万円…!!!

 

ちなみに、Appleから正規購入すると一番高いのでも11万円ほど。

 

中古で買う意味がわからない。。。

 

でも買ってしまった。メモリも増設されてたし、未使用品だったので購入を決定。

 

何よりOSはYosemiteですよYosemite

なんでかわからないけど、ここは妥協できなかった。

 

たしかに、安いMacもあるんですよ。

 

Mac miniで言えば、snow leopardとか、moutain lionとか、少し前のOSなら2万円台で売っていた。

でも、2万円ってどうなんでしょうね。ちょっと怖いじゃないですか。

 

憧れのiMacでさえ3,4万円で売っていたんだけど、結局11万円のMac miniを購入。

 

あとは、アクセサリとしては3点購入。

  1. 純正USキーボード
  2. 純正Hdmiケーブル
  3. Bluetoothマウス

 

まず、キーボードね。これはUSキーボードが良かった。

しかも、純正にしてしまったので8000円もしてしまった。。

 

そんなこんなで予算が尽きて、マウスはふつうのマウスにしてしまった。

 

☆☆

 

そんなわけで、さきほど起動してネットに繋げた。

PPPoEってなんだよ!と怒りつつも、なんとか無事、開通できた。

 

そして今、OS Xでブログを書いている。Mac miniとは言え、夢のMac環境だ。

 

まさか自分がMacユーザになるなんて、思ってもみなかった。

でも、いざ環境が整うと感激してしまった。なんて言うと安っぽい感じがするけど、とにかく感激した。

 

 

 

おかげで金銭的にかなりキツくなった。ゴールデンウイークは遊べそうもない。

でも、これでいいのだ。

 

ゴールデンウイークはバリバリコーディングしよう。

 

物事は順調に進んでいる。

HTMLコーダー(マークアップエンジニア)の仕事風景

僕は今、「プログラマー」というカテゴリにいます。

けれど、正社員になる以前、アルバイトだった頃はいわゆる「HTMLコーダー」あるいは「マークアップエンジニア」というやつでした。

 

では、実際の仕事風景はどんな感じなのか。僕の半年間の経験を元に語ります。

 

そもそもHTMLコーダーとは?? 

chuck0523.hatenadiary.jp

 

こちらの記事でも書きましたが、プログラミングの中でも比較的「前面」を担当します。「表側」「レイアウト」「見た目」など会社によって呼び方はまちまちですが、Web制作という言葉がしっくりきます。

 

要は、ホームページやウェブサイトの目に見える部分を作るのが、HTMLコーダーの役目です。

目に見えない部分とはつまり、データの管理だったりサーバとのやり取りだったりします。

 

 

その仕事風景

僕の会社では以下のような流れでした。

  1. 営業さんが仕事を取ってくる。
  2. デザイナーさんが見た目を決める。
  3. HTMLコーダーが作る。

 

順を追って説明します。

1.営業さんが仕事を取ってくる。

「こんなサイトを作ってほしい」というお客さんのニーズ(需要)があります。それをまず営業さんが掘り起こしてきます。

あるいは、「既に作ったサイトに機能を追加して欲しい」「既存のサイトをスマホ対応にしてほしい」といった追加の要望もあり得ます。

 

2.デザイナーさんが見た目を決める

デザイナーさんがイラストレーターなどを使って、サイトの見た目を作っていきます。これはまだ設計図であり、実際のサイトではありません。

 

3.HTMLコーダーがサイトを作る。

さあ、いよいよコーダーのお仕事です。デザイナーさんから送られた設計図に基づいてコーディングをしていきます。

主にHTML/CSSを使ってサイトを構築していきます。

ただしコーディングが一度で終わるとは限りません。実際に作ったサイトを見て、さらに変更点が加えられることもあります。社内で「ここはこうした方がいいんじゃないか」となることもあれば、お客さんから「やっぱりここはこうしてくれ」と追加の要望があることもあります。

 

実際のWeb制作では1→2→3が何度か繰り返されることがよく有ります。

 

HTMLコーダーに求められること。

一般にHTMLコーダーは楽だという認識があるかもしれません。

もちろん、技術的には難しくありません。HTML/CSSと少しのJavaScriptができれば充分役に立てるでしょう。

(難しいプログラミングは分かるけどCSSは苦手だというベテランプログラマーはたくさんいます)

 

けれども、営業さんやデザイナーさんとの連携が求められる仕事でもあると思います。

コーディングをしていると「ここは変じゃないか」「ここはこうした方がいいんじゃないか」といった疑問が出てきます。

それは放っておくと、結局後になってやり直しということがあります。

 

なので、コミュニケーション力が求められる仕事でもあると思います。

ここで言うコミュニケーション力とは、職場を盛り上げる能力でも、みんなと仲良くなる能力でもありません。

単純に「疑問に思ったことをしっかり言うこと」がコーダーに求められるコミュニケーション能力だと思います。

 

実際、僕もコミュニケーション能力は低いと思います笑

けど、コーディングは好きなので、仕事に関しては恐れることなく発言することができます。

その結果、「そのとおりだ!」「よく気づいたね!」なんて褒められることもありました。

 

 

まとめ

とにかくITの業界は人が足りていません。

サーバ側のプログラマーがコーダーの仕事を片手間でやってしまっている。大企業でさえ、そのようなことが起こっていると聞きます。

 

おそらく、HTMLコーダーになることは難しくありません。

僕自身、独学したのは2ヶ月ほど。自分で作ったサイトを面接で披露して採用していただけました。

コーダーの仕事は楽しいです。営業さんやデザイナーさんと連携するのも、やりがいを感じると思います。

 

さらに、人材不足ですからもっと難しいことも教えてくれるかもしれません。僕の場合、今はステップアップしてJavaを学んでいる最中です。

 

 

皆さんもぜひ、HTMLコーダーを目指してはいかがでしょうか(^O^)

HTML/CSS/JSとだいぶ仲良くなれた感がある

2月に入って3つほど並行してコーディングをしている。

趣味でもあるし、勉強でもある。

 

どれもまだ中途半端なんだけど、ここでちょっと記録しておこうと思う。

 

1,個人サイトのデザイン変更

f:id:chuck0523:20150221205508p:plain

http://chuck0523.github.io/myPage/myPage/mypage.html

 

こんな感じ。PCの枠組みはCODEPREP様のレッスンを参考にした。

そしてその中に以前作ったものを埋め込んだ。 

年末最後のひとしごと 個人サイト作成 - chuckのブログ

 

でも、スクリーン部分が四角いのに、中身もブロックデザインなのはちょっと変な気がしてきた。

もうちょっと中身はシンプルにした方がいいかもしれない。

 

ちなみに観葉植物はフリー素材。ホントはこれもCSSで描画してみたい。。めちゃめちゃ難しそうだけど(ヽ'ω`)

 

 

スマホ対応は前回と変わらず。

f:id:chuck0523:20150104154500p:plain

これももうちょっと複雑にしたい。

せめてドロップダウンのメニューくらいにはしたい。

 

 

2,ロシア語 単語データベース作成

f:id:chuck0523:20150221210518p:plain

前々からやりたかった単語データの作成。

と言っても表に埋め込んだだけだけど

 

DataTablesというjQueryプラグインが高機能で最高だった。

 

でもさっき触ってたら描画の不具合を発見してしまった。。直さなくては。

 

 

3,好きなものデータベース作成

好きなもののデータベースを作った。

 ここまで来ると完全に自己満足の世界だ。でも、僕は変わり者だからそれでいいのだ

 

こちらが初期画面。左に大カテゴリが並んでいる。

f:id:chuck0523:20150221211137p:plain

 

カーソルを合わせると上部にサブカテゴリが出てくる。

f:id:chuck0523:20150221211147p:plain

 

さらにサブカテゴリをカーソルすると、項目が出てくる。

f:id:chuck0523:20150221211159p:plain

 

項目にカーソルすると、文章や写真や動画が表示される。

f:id:chuck0523:20150221211211p:plain

 

と言った具合。

 

HTML的には<ul />を4重構造にして、下位のドキュメントをデフォルトで非表示にしてある。

すべてのデータは配列やらオブジェクトに格納されていて、それをループで配置させた。

そして$('ul li')にhoverイベントでtoggle()して表示させている。

 

ulの領域作成に苦労したくらいで、cssはだいぶ自在に使えるようになってきた。

float,position,displayの組み合わせを理解していると、表現の幅がかなり広がる。

 

こちらはまだ装飾が足りないので未公開。

 

 

総評

まだまだ自己満足のレベルだけど、コーディングはやっぱり楽しい。

気づいたら4,5時間経ってて驚く(ヽ'ω`)

 

でもここに来て、限界を感じ始めている。つまり、扱うデータが増えてきてHTML/CSS/JSだけでは煩雑になってきた。

でも残念ながらDBのこととがぜんぜん分からないんだよね。Javaもまだ初心者だし。

サーバサイドのことを勉強し始めたいな。。

 

あと、今(クロームブック)より性能の良いパソコンが欲しい(ヽ'ω`)

年末最後のひとしごと 個人サイト作成

どーも、chuckです

個人サイトを作ったので公開します('ω`)

 

f:id:chuck0523:20141231170405p:plain

http://chuckbase.lv9.org/mypage1.html

 

こちらになります。

いやー、いい感じ( ´ー`)y-~~

 

やっぱりHTMLとCSSを書くのって楽しい。

そして手作りだから愛着がすごい(ヽ'ω`)

 

とりあえずブログとツイッターとスタディプラスを連携。リンク貼るだけだしね!

 

今日中に残りの3項目もつくりたい。

  • About Me →HTMLでつくるシンプルな自己紹介ページ
  • Contact →メール画面を起動する感じ?そしたらLINEの連携をどこに入れるか悩む、、
  • Works →この間作成したロシア語単語帳を置いとく予定。

 

自分のプラットフォームを作るってずっとやりたかったんですよね。

ブログって思いを綴るのにピッタリだけど、プラットフォームにはなりえないと僕は思うんですよね。

 

やっぱり個人サイトは偉大です(ヽ'ω`)

 

で、年末に帰省して暇だったのでコーディングしちゃいましたw

これでURLひとつで僕のことを知ってもらえますね(^O^)/ 

 

○今後の課題

 ブラウザ毎の違いをなくす

 JavaScriptでいい感じの機能をもたせる

 スマホ対応(レスポンシブデザイン化)

 

ではでは。

 

追記。

移転&デザイン変更しました。

chuck0523.github.io

プログラミング初制作。その名もロシア語単語クイズ

 

公約どおり、作成中ですよ

 

手始めに単語クイズみたいなものにトライ。

配色はこちらを参考にしました。

フラットデザインの定番トレンド配色 + お手本Webサイトまとめ - Photoshop VIP

  

楽しい

 

※クリックするとひらきます。 

Russian Vocabs
はじめる

 

HTMLコーダー(マークアップエンジニア)になって1ヶ月が経ちました。

http://brand.jquery.org/resources/jquery-dev-summit-mark-improper-usage.gif

(http://brand.jquery.org/events-conferences/)

  

HTMLコーダーになって1ヶ月が経ちました。

 

この1ヶ月で本当に成長できたと思う。

やっぱりプログラミングは働きながら学ぶのがいいですね。

 

 

ここまでの経験を書き残しておきます。

誰かの役に立ちますように。

 

続きを読む

ミートアップ初参加してきました!(英語×プログラミング)

f:id:chuck0523:20141006183419j:plain

 

こんばんは!chuckです。

ゲストハウスから更新しています。

 

昼間は暖かったのに、夜はすっかり冷え込みますね。。

皆さん風邪にお気をつけ下さい〜。

 

さて、今日の日記を更新します。

 

初!ミートアップ参加!

その記録。

 

続きを読む

HTMLコーダーの求人を見て。プログラミングの学習を軌道修正。

こんにちは!chuckです。

 

以前、こんな記事を書きました。

HTMLコーダーという選択肢について。 - chuckのゆるゆるライフ

 

 

あれからというもの、定期的に求人をチェックしています。

 

今日は「HTMLコーダー 未経験 日本橋」で検索。


HTML コーダー 未経験の求人 | Indeed.com

 

めっちゃあるんですよね〜。求人。

 

だから、焦る必要はないなと思います。

 

それでも「自分の学習計画には軌道修正が必要」だとも感じました。

そこらへんを書いていきます。

 

続きを読む