『JavaScriptコードレシピ集』の著者に学ぶ はじめてのJavaScript
イベント内容
noteにてアーカイブ(スライド・動画)を販売しています。
「申し込みそびれてしまった方」はご利用ください。
『JavaScriptコードレシピ集』の著者である鹿野 壮さんにJavaScriptを初めて学ぶ人や、学び始めた人を対象に、JavaScriptの基本的な使い方をお話いただきます。
『JavaScriptコードレシピ集』の著者に学ぶ
はじめてのJavaScript
JavaScriptを使えば、ユーザーの操作によって動きをつけたり、時間や状態によって表示を変更したり、モーダルウィンドウを作ったりすることができます。ウェブ制作において、HTML・CSSと並んでJavaScriptは必須といえるでしょう。
しかし、HTMLやCSSと比べて、JavaScriptの学習難易度が高いと感じている方も多いのではないでしょうか?
本セミナーでは、話し手として『JavaScriptコードレシピ集(共著、技術評論社)』の著者である鹿野 壮、聞き手としてデザイナーの松下 絵梨という構成で、JavaScriptを初めて学ぶ人や、学び始めた人を対象に、JavaScriptの基本的な使い方を取り上げます。
初心者向けとは言っても侮ることなかれ!教える内容はJavaScriptの最新の仕様(ES2022)に準拠しており、開発の現場でフロントエンドエンジニアが使うレベルのコードをお教えします。
次の方が対象です。お気軽にお申し込みくださいませ。
- 初めてJavaScriptを学ぶ人
- これまでjQueryを使っていた人
- どこからJavaScriptを学べばいいかわからない人
- 自分の書くJavaScriptに不安がある人
セッション内容
各Phaseは、基本文法を学ぶ基礎編と、実際に作例のコードを書いていく実践編に分かれているので、JavaScript初学者の方でも一つ一つ理解しながらご受講いただけます。
作例 1 時間に応じた背景切り替え
Phase 1 シンプルバージョン
- JavaScript の処理を記述する
- アラートダイアログを表示する
- コンソールに内容を出力する
- 「変数」を使ってデータを使い回す
- 「定数」を使ってデータを使い回す
- 文字列を結合する①
- 文字列を結合する②
- 条件に応じて処理を分ける( if 文)
- HTML 要素を取得する
Phase 2 関数バージョン
- 「関数」を使って処理をひとまとめにする
- 「アロー関数」って何?
作例 2 モーダルウィンドウ
Phase 1 シンプルバージョン
- 複数のHTML要素を取得する
- HTML要素をクリックしたときに処理をする
- data属性から値を取得する
Phase 2 配列バージョン
- 「配列」を使って複数の値をひとまとめにする
- 「配列」を使って複数の値をひとまとめにする①
- 「配列」を使って複数の値をひとまとめにする②
- 「オブジェクト」を使って、名前と画像パスをひとまとめにする
- JavaScript で HTML 要素を作る
- JavaScript で HTML 要素を画面上に追加する
Phase 3 前後ボタンつきバージョン
- 自分の値に別の値を足す
『JavaScriptコードレシピ集』とは
株式会社ICS 池田泰延と鹿野壮が執筆したJavaScriptの書籍。ウェブ制作の現場で使えるJavaScriptの知識を、フルカラー・600ページ超で解説している。現在第4刷。
『JavaScriptコードレシピ集』をお持ちでなくても受講いただけます。
出演
- 鹿野 壮さん:フロントエンドエンジニア
- 松下 絵梨さん:デザイナー
鹿野 壮(かの・たけし)
株式会社マネーフォワードビジネスカンパニー 経理財務プロダクト本部会計開発部副部長 兼 UIテクノロジーグループリーダー
九州大学でメディアアートを学んだ後、ウェブ制作会社にてウェブページ制作やモバイルアプリ開発に携わる。現在は株式会社マネーフォワードで、フロントエンドチームのリーダーをしている。最新のフロントエンド技術を駆使したコンテンツづくりが好きで、暇があればコードを書いている。TechFeed公認エキスパート。
松下 絵梨(まつした・えり)
ツキアカリ
大阪出身大阪在住のWeb/UIデザイナー。東京理科大学理工学部卒業。
通信機器メーカーで開発・サポート業務に従事したのち、デザイン・広報秘書業務に転身。2010年よりフリーランスとして独立し、DTP/Web/アプリデザイン、ディレクションを行なっている。
講師業や、「Adobe XD ユーザーグループ大阪」、「CSS Nite in Osaka」の運営、セミナー登壇・企業研修にも力を入れている。 2020年に『Adobe XDではじめるWebデザイン&プロトタイピング 一歩先行く現場のスキル』(翔泳社)を上梓。
イベント概要
- 開催日:2022年8月20日(土)21:00 - 23:00
- (最大24:00までアフタートーク)
- 形式:オンライン(Zoomウェビナー)
- 主催:CSS Nite
- 共催:DTP Transit
- 参加費(お一人):
- 5,000円
- 4,000円(早割:7月中)
終演時間は若干の延長の可能性があります。
- 「協賛企業枠」のチケットは、CSS Niteに年間で協賛してくださっている企業向けです。[会社名]または[その他、連絡事項など(あれば)]に、所属企業名をご記入ください。
参加資格などはありません
お仕事内容にかかわらず、興味があれば、どなたでもご参加ください!
学生や休職中、求職中の方も歓迎です。
フォローアップページ(Notion)
次の情報をまとめたフォローアップページ(Notion)を用意し、カウントダウンメールにてお送りします。
- 事前フォローアップ(スライドやリンク集)
- 当日の配信などに関する情報
ご一読ください!
当日の進行などに関して
- 20:30以降にZoomにログインしてください。Zoomアプリは最新版にしておくことをオススメします。
- 20:45から「椅子ヨガ」を予定しています。
- 質問はSlidoに記入ください。匿名で送信できます。
- ツイートされる場合には、ハッシュタグは「#はじめてのJavaScript」をお付けください。
- 終演時間は若干の延長の可能性があります。また、終了後、「アフタートーク」を予定。
視聴に関して(1)
- Zoomの視聴URLは当日に再確認をお願いします。
- 参加される方のカメラ、マイクは自動的にOFFになっています(ONにできません)。
- 画面共有でスライドやデモ画面を表示しますので、PCでの参加をおすすめします(スマホ/タブレットでも参加できます)。
- 内蔵スピーカーでは聞き取りづらい場合があります。イヤホン・ヘッドホンの利用を推奨します。
- 120分程度の接続で数百MBのデータ通信が必要です。通信制限の上限等にご注意ください。
視聴に関して(2)「音声が途切れる。画面が遅延する/カクカクする」場合
- Zoomから退出したり、PCを再起動するなどして再度接続してみてください。
- バックグラウンドで走っているアプリケーションを終了することで改善されることもあります。
- 可能であればWi-Fiでなく有線で接続してみてください。
- 改善されない場合には、後日提供する動画をご覧ください。
後日の視聴
当日見られなかった方、および、改めて見返したい方には、翌週に発行するフォローアップメールにて視聴URLをお知らせします。
お振込の方
会社から複数名にて参加される場合には、まとめてお振込いただき、振り込み後にご一報ください。
その他
- 開催前に「カウントダウンメール」、開催後に「フォローアップメール」をお送りします。こちらを必ずご一読ください。
- 本セミナーのタイトルや内容は調整されることがあります。
タイムテーブル
タイムテーブルはあくまでも目安で、状況に応じて調整しながら進めます。
時刻 | コンテンツ |
---|---|
20:30 | 配信開始 |
20:45 | 「椅子ヨガ」 |
21:00 | 番組開始、オープニング |
21:10頃 | 本編開始 |
22:00前後 | 休憩(椅子ヨガ) |
23:00 | 終了予定 |
23:10 | アフタートーク |
24:00 | 完全に終了 |
オンライン椅子ヨガ
今回のCSS Niteはコモモ先生 @komomoaichi のオンライン椅子ヨガ付きです!
- 20:45-20:58 開演まで
- 21:55-22:05 休憩時間(前後することがあります)
一緒に「ちょっとメンテ」しましょう。
https://chotto-maint.com/online-yoga
Twitter/note/YouTubeをフォローください!
セミナー前後に関連情報をお出しすることがありますので、Twitter/note/YouTube/LINEをフォローくださいますと幸いです。
CSS Nite(シーエスエス・ナイト)は、ウェブ制作に関わる方のためのセミナーイベント。2005年10月にスタートし、2021年10月で丸16年。
これまでに、800回を超える関連イベントを通して、のべ75,000名を超える方にご参加いただいています(2021年10月現在)。
協賛
CSS Niteは下記の企業に協賛、協力をいただいています。
- KDDIウェブコミュニケーションズ レンタルサーバー「CPI」、簡単ホームページ作成「ジンドゥー」など提供
- Webクリエイター能力認定試験(サーティファイ) 年間受験者数15,000人以上
- Webフォント・サービス FONTPLUS
また、多くの制作会社に協賛いただいています。
注意事項
※ 掲載タイミングや更新頻度によっては、情報提供元ページの内容と差異が発生しますので予めご了承ください。
※ 最新情報の確認や参加申込手続き、イベントに関するお問い合わせ等は情報提供元ページにてお願いします。