Shuntiger Tech Diary

iOS/Androidエンジニアが気になる技術やガジェットなどを気のままお届けするブログ

スラスラわかるHTML&CSSのきほん 完了

前回の記事からだいぶ空いてしまった。。。

あれから色々あって6ヶ月間職業訓練iPhoneアプリ開発を学んだり・・・。*1

ということでプログラミングはまだその世界に足をつっこんだ程度ですが、毎日ちょっとずつ新しい発見があったり、みたいな新鮮な気持ちで勉強しています。

 

ブログをまた書こうと思ったのはプロジェクト管理でBacklogを使用していて、自作アプリをリリースする際、プログラミングで迷った所とか解決した方法とかリリースする際に参考にしたサイトなどを全部Backlog上に書いててなんだかもったいないなと思ったのがきっかけです。*2

※Qiitaはまだ敷居高いので、はてブロでツラツラ書きます。

 

で、今はiOSアプリを作成している段階でバックエンドのことが全然理解していないということ気づき、まずは基本のホームページ制作から初めてサーバーサイドも経験してみようということで、ホームページを作成している最中です。

 

表題の通り「スラスラわかるHTML&CSSのきほん」を実際に試してホームページを作成することができた。

かかった時間は約18時間、1日5時間程度で4日で出来た。

使用したのはこの本。

 

スラスラわかるHTML&CSSのきほん

スラスラわかるHTML&CSSのきほん

 

 

以前、ProgateのHTML&CSSコースとドットインストールのWebサイトを作成するレッスンを受けてたので、結構自分でわかってる範囲が多くすんなり行けた感じがする。

Progate&ドットインストールと比べ書籍なので体系的に学べ、よりHTMLのタグやHTMLとCSSの関係が理解できた。

特にドットインストールではFirebaseでWebサイトを公開することはできたが、レンタルサーバーやFTPクライアントソフトを使用して公開という所までは出来てなかったので実際にサーバーを使って公開できたのはいい経験になった。

 

使ったツール

エディターはドットインストールで使ってたAtomがタグの補完機能もあり、いい感じだったが、最初から凝り固まらずにエディターも色々試してみようってことで書籍推奨のmiを使用。見出しリストとか完全日本語対応といった点が調子いい感じ。

Atomであったタグ補完が無かったので<table>←こういうタグを手打ちしていくのがやや面倒ではあった。あとcmd+/でのコメント機能が無かったのも気になる。

おそらくショートカットキーとかも組み込みではなく自分でカスタマイズしていくタイプのエディターなのではないかと思う。

 

実際に出来上がったサイトが下記URL

shunpon.web.fc2.com

HTMLのタグで箇条書きのようになっていたサイトが、CSSで装飾を施すことによって、徐々に組み上がっていくことに感動した。

最初は退屈だったが、徐々にページができるにつれハマっていた。

 

自分が読んだ本は第1版だったので、レスポンシブデザインは対応していなかったが、

第2版では対応しているみたい。*3

 

スラスラわかるHTML&CSSのきほん 第2版

スラスラわかるHTML&CSSのきほん 第2版

 

 

もっと動的なWebサイトを作りたい!って思ったので、次は以下の本を順にやっていくと思う。

 

HTML&CSSとWebデザインが 1冊できちんと身につく本

HTML&CSSとWebデザインが 1冊できちんと身につく本

 

 

詳細! PHP 7+MySQL 入門ノート

詳細! PHP 7+MySQL 入門ノート

 

 

スラスラ読める JavaScript ふりがなプログラミング (ふりがなプログラミングシリーズ)

スラスラ読める JavaScript ふりがなプログラミング (ふりがなプログラミングシリーズ)

 

 

大重美幸さんの本はSwift4を学んでいるときに

・めちゃくちゃわかりやすい

・サンプルアプリ多くて面白い*4

という背景があったのでPHPを学ぶときにも買ってみる。

iOSアプリをリリースした際にお名前ドットコムでBundleID用に購入したドメインがあるのでそれをホームページに利用できたらいいなと思ってる次第であります。 

 

 

*1:そのこともいつかはブログに書こうかな。。。

*2:たぶん自分が悩んだとこも他の人も困ってるはず!ということで記録を残すために。

*3:購入してから1年くらい寝かしてたら第2版が発売されてた

*4:その分結構内容も濃く本が分厚い