サマーインターンシップ 2week オンライン 2日目

2 日目の始まり

サマーインターンシップ 2week オンライン 2日目の記事を担当します、鈴鹿工業高等専門学校の谷壮真です。 jig.jp インターンシップは、今日もラジオ体操から始まりました。

Zoomを通してラジオ体操を行う参加者とメンターたち
2日目のラジオ体操



勉強会 (HTML, CSS, ちょっと JavaScript)

9:00 ~ 12:00

メンターさんにHTML, CSSを教えていただいている参加者たち
HTML, CSS, JavaScriptの勉強会

まずは HTML と CSS、クライアントで実行される JavaScript についての勉強会に参加しました。

github.com

HTML や CSS の基本的な構文から、知っていると開発が楽になる小ネタまで幅広い知識を教えていただきました。 JavaScript を用いると、画面を動的に変更できます。

さらに、 Web フロントをする上では欠かせないアクセシビリティーについて、ボタンを例にとって説明していただきました。

  • VisBug: 適用されている CSS を直感的に調べられる
  • Emmet: HTML や CSS を素早く記述できる記法


Flexbox FroggyGrid Gardenといったゲーム感覚で CSS を学べるサイトに熱中したり。

メンターさんがGrid Gardenをプレイする様子を参考にする参加者たち
Grid Gardenをプレイするメンターさん



CSS はかなり奥が深く、一朝一夕では会得できそうにないです。

CSS
完全に理解した



勉強会 (JavaScript)

13:00 ~ 14:30

メンターさんにJavaScriptを教えていただいている参加者たち
JavaScriptの勉強会

続いて、JavaScript の基礎的な構文から始まり、最近の ECMAScript 仕様に沿った実践的な記法を学びました。

github.com

JavaScript後方互換性を保つ方針のため、同じような動作をする構文がいくつか存在します。 しかし、使うべきでないものも存在するため、違いを理解し使い分けることが求められます。

JavaScript Primerでさらに詳しい内容を学習したいです。



勉強会 (Deno)

14:30 ~ 17:30

メンターさんとDenoのコードを書いている参加者たち
Denoのハンズオン

最後に、最近ホットな次世代 JavaScript ランタイムであるDenoとその周辺サービスであるDeno Deployについてのハンズオンに参加しました。

github.com

Deno

Deno は従来使われてきたNode.jsの反省を生かして再設計されたもので、以下のものが同梱されていることが特徴です。

  • フォーマッター
  • リンター
  • スクランナー
  • TypeScript の標準サポート

さらに IO 関連の API の使用をデフォルトでは許可されておらず、セキュアにスクリプトを実行することができます。

Deno Deploy

Deno で書いたサーバースクリプトは Deno Deploy を通して簡単にデプロイすることができます。 難しい設定なく自動的に更新に追従してくれるため、開発体験の非常に良いプロダクトです。


まとめ

Webは様々な技術のもとに成り立っていることを学ぶことができました。 明日はより詳細なサーバー・クライアント間の処理を学びます。

手で「2」を作る参加者とメンターさんたち
明日も頑張るぞ!

  翻译: