こんばんは、さじです。
これからのデザイナーに必要なhtmlを学び
web案件にも自信を持とう！をテーマに学習中です。
本を読むだけではわかった気になるだけなので
やはり、実践あるのみであることは明白。
AdobeにはDreamweaverという
webサイト作成に最強のツールがあるんですが
駆け出しが学ぶにはやや出来る事が多すぎて
htmlとCSSだけでいいんだよねというわがままで
何か良い練習媒体はないか探していました。
「無料」「わかりやすい」「信頼」の3つから
だいたい名前が出てくるのは、こちらの2つ。
どちらも、初心者レベルまでは無料で使えます。
評判もそこそこ良いのでどちらにしようかなと。
Progateはブラウザ上で学ぶタイプです。
画面が分割され、手順と作業場、プレビューが
一体となっています。
もし、初心者でちょっとやってみたいだけならば
Progateが良いのかもしれません。
アプリもあるのでiPhoneに入れてみようかな。
ドットインストールは、動画視聴です。
実際にテキストエディタを自分のパソコンに
インストールする必要もあります。
すでに他のエディタに使い慣れている人ですと
これは嫌かもしれませんね。
逆に、何にしよう？と考えていた自分は
じゃあこれ入れるか、と安直に受け入れられます。
（既に候補に挙げていたVSCodeでした）
という事で、ドットインストールを無料登録。
登録しなくても無料配信分はそのまま見れます。
気になる動画ですが、なんと、各2~3分。
ちょっと進んでは終わりなのですが、
若い人にはもどかしいかも。
特に問題が起こらなければ、サクサクと１日で
無料分は終わってしまうほどの軽い作りとなってます。
自分の場合、問題が起こったため足掛け3日時点で
15本ほど視聴しました。
ざっくりと様子を再現しますと、こんな感じです。
１.無料登録（登録はしなくても大丈夫）
２.VSCodeをインストール（これも動画あり）
３.VSCodeの設定（動画あり）
４.html実践（ポートフォリオを作っていきます）
サンプルに使用する画像などの材料も
無料でダウンロード出来るので手間いらずです。
自分が起こしたトラブルですが、
初心者にありがちなコードの書きミスでした。
動画に沿って書いていくのですが
ちょっとした手違いで消してしまったり
入れ子がうまく行ってなかったりが発生します。
有料登録すればサポートがあるのですが
無料にはありません。
なので、自己解決を目指さないといけません。
（時間の無駄だと思われる方は有料がいいかも）
完全に積んだ。。と思ったその時、
動画の下の方に無料会員にも神救済のサービスが。
お手本と自分のコードの比較が出来るんです！
違うところを教えてくれるので
これで自分のミスに気づいて修正したら
無事にお手本通りにプレビューできました。
見慣れていないと違和感に気付きにくいので
大変貴重な機能ですね。
※上記画像はサンプルです。
今回のようなちょっとしたミス程度ならば
なんとかなりそうな様子でした。
さらに複雑な疑問が発生した場合には
独学ですと誰にも聞けないので挫折しがちです。
調べる根性と手間を考えれば
1ヶ月だけ有料登録（税込1080円）するなどが
もしかしたら効率はいいかもですね。
VSCodeは愛用するプロも多いエディタなので
ドットインストール以外でも使えます。
html基礎を仕上げたらcss基礎を学んで
JavaScript基礎までを無料でなぞったら
こちらは一旦終了しようと思います。
そのあとはAmazonのKindleUnlimitedを登録して
この辺りで実践練習を積もうかな？
KindleUnlimitedが今、2ヶ月299円なんだそうで。
月150円で読み放題は大きいですね。
他の本読んじゃうかも（笑）。
さじ