【受講記録】デイトラWeb制作コース初級編DAY1

eyechatch
目次

はじめに

2024年10月からデイトラのWeb制作コースの受講をスタートしました。

アウトプットをしてしっかり知識として定着できるよう、記事に残しながら進めています。

OneNoteにメモしながら受講したものを記事にまとめていますので、
実際の受講日と記事の公開には若干のタイムラグがあります。
なるべくリアルタイムになるように心がけますが、受講優先のためご容赦ください。

この記事はこんな人に参考になるかも?

これからデイトラWEB制作コースの受講を考えている方
 実際に受講した記録になりますので、雰囲気や大変度合いを測っていただけるかと思います!

現在進行形でWEB制作コース受講中の方
 一緒に頑張っていければうれしいです!X(旧Twitter)などで交流しませんか!

卒業生の先輩方
 懐かしんでいただければ・・・笑 
  自分なりに調べた記録も付加していますが、もし間違ってるよー!等ございましたらこっそり教えていただけますと嬉しいです。

初級編DAY1の押さえておきたいポイント

ファイル共有の仕方

デイトラの課題提出はもちろん、実際のお仕事でもコーディングしたファイルを共有することはとってもたくさんある。

ファイルの共有におけるお作法をしっかりおさえておこう。

コーディング上、ファイルのパスを指定するケースが多々あるため、
ファイルの格納先(ディレクトリ)がズレると正しく読み込めなくなる。
よって、共有するときはすべての作業ファイルをひとまとめにして共有すること。
※デイトラ関連の作業は他の受講者と被らないよう、Discord名_をつけた名称で作業すること。

Discordや他のコミュニケーションツールもアップロードできる容量が限られていることがある。
そんなときはGoogleドライブを活用しよう。
共有したいフォルダをアップロードし、共有機能から“リンクを知っている全員”を指定した上でリンクをコピーして共有すればOK。

ただし!
個人情報など重要な情報を含む場合は、“リンクを知っている全員”ではなく“制限付き”の状態でリンクをコピーし、権限申請をしてもらって承認した人だけ見れるようにする。

スクリーンショットを共有する場合は、圧縮せずに画像そのものをDiscordに添付でOK。
そうすることで、Discord上ですぐに内容が確認でき、解凍する手間が省けてスピーディーに対応できる。

フォルダを圧縮する方法

Discordにファイルを添付する場合は必ず圧縮する必要がある。
(直接フォルダをアップロードできない)

Macの場合

右クリックから「”フォルダ名”を圧縮」でOK。

Windowsの場合

右クリックから「ZIPファイルに圧縮する」でOK。

開発環境を整える

GoogleChromeをインストールする

コーディングの作業にはChromeの検証機能(Chrome開いてF12で開くor右クリックして検証を選択)が必要不可欠!
規定ブラウザもChromeに変更しておくとよい。

VS Codeをインストールする

エディタとしてVS Code利用推奨。
マーケットプレイスからJapanese Language Pack for Visual Studio Codeをインストールして日本語化する。

!+Tabキー押下でHTMLの型が自動で表示される
→エメット?というツール?機能?がVS Codeで使えるようになっており、そのためこの記法で自動表示される。
エメットは他にもたくさんある模様。少しずつ覚えていこう!

そもそもWebサイトが表示される仕組み

そもそもWebサイトって何?サイトが表示される仕組みを解説 – 図解で分かる!Webにまつわる基礎講座 vol.1

初級編DAY1の追加で調べたいことメモ

  • MacのChromeでWebページをリフレッシュする方法は?
  • パスワード付きでフォルダを圧縮したい場合はどうすればいい?

初級編DAY1の感想と記録

自分が指定した(打ち込んだ)文字がブラウザに表示されるのはちょっと感動!
VSCodeのダウンロードでコーディングっぽい!という感じがしてにやにや・・・

Chromeは会社でも使っていたけど、MacだとF5で更新できないのがちょっとびっくり。

MacとWindowsの差分についてはこれからもちょいちょい苦しみそう=作業効率に影響しそうなので、手元でしっかり調べながらMacを自分仕様にカスタマイズしていきたいな。

引き続きがんばろう!

DAY1 完了日 : 2024年10月17日(木)
DAY1 所要時間 : 1h
Web制作コース 初級編Total : 2h

eyechatch

この記事が気に入ったら
フォローしてね!

目次