Treat Myself

海外生活中アラサー女子の英語・プログラミング学習備忘録

【30DAYSトライアル1st】環境設定編の感想(Day8からDay10)

スポンサーリンク

coding

 

30DAYSトライアル1stのDay8からDay10ではローカル環境でHTML&CSSを始めプログラミング学習を進められるように環境を整えていく課題構成になっていて、Day8からDay10の課題と実際にやった感想をまとめました。

 

 

Day8: エディタをインストールする、Emmetを理解する

 <課題> 

 

<感想>

30DaysトライアルではMicrosoft社が開発した「Visual Studio Code (VS Code)」

がオススメエディタとして紹介されてて、インストール手順も詳しく解説されているのですが、

 

ですが、

 

私のパソコン(Macbook Air 2012)のOSが古すぎて「Visual Studio Code」に対応してないんです😭

 

仕方がないので、もとから持っていた「Brackets」を使うことに。

 

Visual Studio Code」はEmmet標準装備のようですが、「Brackets」はEmmetを拡張プラグインで入れる必要がありました。

 

Brackets」を持ってはいたもののあまり使ったことがなかったので、拡張プラグインをいくつか追加し、追加して良かった拡張プラグインをまとめて記事にしました↓ 

treatmyself.hatenablog.jp

 

パソコン新しいのを買った方がいいのかも。。

 

Day9: ショートカットを覚えて、ファイルパスを理解する

 <課題> 

 

<感想>

Brackets」のショートカットのチートシートBrackets Cheat Sheet–Mac)を見つけたので 、こちらでショートカットをのやり方をみて→実際に試してみるを繰り返し行いました。

※コーディングに関しての調べ物はできるだけ英語でやると決めているので、英語のページになります。

 

私の場合ファイルパスの理解に関しては、ProgateのCommand Line基礎編をやったらスッキリ理解することができました。

コマンドを勉強するのでパソコンアレルギーぎみの私は始めとてもドキドキしながら学習を進めましたが、コマンドを使ってファイルを作成したりすることで、フォルダ構成が理解できました。

 

prog-8.com

 

Day10: Chormeの検証機能を使ってみる、LiveServerをインストールする

  <課題>

 

<感想>

Live Serverは「Brackets」に標準装備されていたので特に何もしてません。

 

また、Chromeの検証ツールはYouTubeで動画を観ながら実際にツールを使ってみました。

YouTube内を検索するとたくさんの動画が出てくるので試してみてください。

 

私が参考にした動画はこちら↓(英語です)

 

余裕があったら(おまけ課題): Progate jQuery 中級まで

<課題>

 

<感想> 

 jQueryで動きをつけるとサイトがさらに素敵に見えます。

 

でも、JavaScript難しい!

 

Progateはいつも通り2週してメモを取りましたが、ただ理解せずにコードを打ち込む感じになっていたのでjQuery攻略は少し時間がかかりそうです。

 

最後に

Day8からDay10の課題は始めの7日間と比べると時間がかからず完了する印象でした。

だからおまけ課題があったのかな?

 

このDay8からDay10の3日間で、環境を整えながらローカル環境でいろいろ試してみると楽しいです。

ちなみに私は、Progateで作ったコードをダウンロードして「Brackets」で開いて、コードを少しいじってみたりしてました。

 

30Daysトライアルは課題をこなしていくと、すこしずつできることが増えていくので、楽しみながら続けることができます。残りの3分の2も頑張ります!

 

 

*30DAYSトライアル1stの課題と感想のまとめを記事にしてありますのでご興味のある方は以下の記事もご覧ください。

 

treatmyself.hatenablog.jp