htmx入門 - JSが苦手な方のための、やさしいライブラリ

2024/09/13(金)21:00 〜 22:00 開催
ブックマーク
#WordPress, #HTML, #PHP

イベント内容

長谷川 喜洋さん、たにぐち まことさんをお迎えし、フロントエンド・サーバーサイドの両側からhtmxについて解説いただきます。

「当日の視聴は無料」スタイルで開催しますが、アーカイブチケット購入やサブスク登録でサポートくださいますと助かります！

htmx入門 - JSが苦手な方のための、やさしいライブラリ

「htmx」とは、HTMLに手軽に非同期通信機能を追加できるライブラリです。その特徴は、JavaScriptを全く書かずにHTMLの属性だけで、本格的なプログラムが作れるところ。
これまで、JavaScriptが苦手だったマークアップエンジニアの方や、サーバーサイドのプログラムに慣れている方などが、フロントエンド開発を手軽に始めることができます。

本イベントでは、そんなhtmxをフロントエンド・サーバーサイドの両側から、その魅力をご紹介します。

次世代のhtml！ htmxが便利なわけ

htmxは、HTMLをハイパーテキストとして完成させることを目的に開発されました。HTMLに属性を足すだけでJavaScriptを記述せずに他のHTMLを読み込んだり、データを送信することが簡単にできます。

ここでは、HTMLを更新しやすくするテンプレートパーツ化やECサイトの運営時など、すぐに使える事例をご紹介します。

主な内容

  • htmxとは
  • 便利な設定がたくさん！基本的な使い方
  • header、footerなどのテンプレートパーツとして使ってみよう
  • ECで使ってみよう

長谷川 喜洋長谷川 喜洋

フロントエンドエンジニア

株式会社How to Use CTO/株式会社ステラクリエイト CEO/総合webサービス タダフラ 代表/デジタルハリウッドSTUDIO大阪・京都芸術デザイン専門学校 講師/星のソムリエ®

大阪生まれ大阪育ち。 パチンコ店の店長からEC業界へ。そののち、知財を扱うスタートアップでシステム開発・Webサイト制作・アプリ開発を担当。フリーランスとしてWeb制作も行う。 EC時代に天体望遠鏡を販売していた経験から、星空事業を主とした法人を2020年6月に設立。

htmx+WordPressでお手軽、非同期通信

htmxは、PHPなどのサーバーサイド言語との相性が非常に良く、手軽に「非同期通信」を実装することができます。

このセッションでは、WordPressを例に、サーバーサイドとhtmxを組み合わせて、サイトを非同期化する方法について紹介していきます。

主な内容

  • WordPressサイトへのhtmxの組み込み方
  • ページ内検索をリアルタイム化しよう
  • 非同期通信で情報を反映しよう
  • WordPressにおける、htmxの使いどころ

たにぐち まことたにぐち まこと

H2O space / ともすた

富士ゼロックス、ソニーネットワークコミュニケーションズなどでウェブエンジニアとして勤務ののち、2002年に独立。株式会社エイチツーオー・スペースを設立。

メンテナンスしやすいウェブサイトを手ごろな価格で提供することで、大小問わずさまざまな業界のクライアントを応援している。

教育分野では、Udemyを通じた映像講義（12万名）と、YouTube（5万名）を通じた学習コンテンツを配信を行う。

主な著書に『6さいからつかえるパソコン』（技術評論社刊）、『よくわかるPHPの教科書』（マイナビ刊）など。

聞き手、MC（進行）

鷹野 雅弘（CeeBeeDee/CSS Nite/DTP Transit）が“聞き手”を担当し、リアルタイムでチャットでの質問などを拾っていきます。

鷹野 雅弘（たかの・まさひろ）

株式会社スイッチ

グラフィックデザイン、エディトリアルデザイン、ウェブ制作の分野で、デザイン、オペレーション、設計・ディレクションなど、25年以上、第一線で手を動かし続けている。そのノウハウをテクニカルライティングや講演に落とし込み、「制作→執筆→講演」のサイクルを回す。

2015年から大阪芸術大学 客員教授。 2017年からAdobe Community Evangelist。CSS NiteやDTP Transitのオンラインセミナーのオーガナイザーとして企画・制作・配信なども担当。

イベント概要

YouTube Liveでライブ配信します。

お申し込みと参加費

  • 当日の視聴は無料です。
  • 参加にはお申し込みが必要です。受け付けは終演時刻まで。

フォローアップ（アーカイブ）

本イベントのアーカイブは「サブスク」メンバーのみに公開します。

アーカイブについて

ぜひ、サブスクをご検討ください！50本以上のすべてのアーカイブが見放題です。

配信に関してのあれこれ

各URLは、YouTubeの概要欄にも掲載しています。

  • チャットやスタンプ、ツイートなど「参加型」でお楽しみください！
  • 「音声のバランスが悪い」など、何かお困りの場合、コメントなどで教えてください！

配信URL

YouTube Liveで配信します。

https://youtube.com/live/4aGuCWIQD48?feature=share

X（Twitter）にて同時配信も行っていますが、YouTube Liveにてコメントも含めてお楽しみください。

YouTube関連

  • YouTubeチャットを活用ください！　スパム回避のため、YouTubeチャンネル登録者のみがコメント可能にしていますので、事前にチャンネル登録をお願いします。
  • スーパーチャット（スパチャ＝投げ銭）を利用できます。少額でも大歓迎です！　いただいた全額を講演者にお渡しします。
  • 質問がある場合、YouTubeチャットで冒頭に★または【質問】を付けてコメントください。すべては拾いきれません。「〜は〜という意味です」「自分の現場ではこうやっている」など、視聴される方からのサポート的なコメントを歓迎します！　一緒に場を作ってくださいますと嬉しいです!!

リアクションや質問

  • CommentScreenを使って、画面上にスタンプを送信できます。スマホだけでなく、PCからも送信可能。ただし、CommentScreenのコメント機能は使っていません。
  • スクショ付きのツイート歓迎です。ぜひ、ハッシュタグ（#htmx入門）を付けてください。ただし、事例の部分などでNGマークがついている箇所、講演者からNGの指示のある箇所はご遠慮ください。
  • 終了後、ぜひアンケートにお答えください！　「フィードバックはギフト」。話してくださった方の成長の材料になり、また、イベントの改善につながります。

その他

  • 「UDトーク」にて文字情報を提供しますので、別のブラウザーなどでご覧ください。タイムラグや精度についてはご容赦ください。
  • サンプルファイルや配布資料、アーカイブ動画のURLをSNSなどで再配布するのは禁止です。
  • 開演の30分前くらい前からテスト配信をスタートします。音声などが聞こえるかチェックなさってください。
  • スマホやタブレットで視聴される方もいると思いますが、PCでの視聴を前提としています。なるべくPCでご覧ください！
  • ご覧いただく回線状況によっては、YouTubeの動画が止まってしまったり、音声が途切れてしまうことがあります。その場合には、ブラウザーを再読み込みしたり、OSを再起動してみてください。

配信準備は念入りに行っていますが、本番になると予期せぬトラブルが生じるのがライブ配信です。それも含めて楽しんでください。

領収書

インボイス対応の領収書が必要な方は、アーカイブ購入者向けのNotionからPDFをダウンロードしてご利用ください。

  • 「アーカイブ視聴（会社として申し込み、社内で共有）」のチケットを購入いただいている場合のみ、個別対応いたします。

所轄税務署、インボイス制度電話相談センターなどに相談し、次のようにすることにしました。

オンライン椅子ヨガ

本イベントはコモモ先生 @komomoaichi のオンライン椅子ヨガ付きです！

  • 開演前
  • 休憩時間（適宜）

一緒に「ちょっとメンテ」しましょう。
https://chotto-maint.com/online-yoga

方向性

「オンラインセミナー」や「ウェビナー」というより「オンラインイベント」的なニュアンスです。

  • いわゆる「セミナー」ではなく、「オンラインイベント」です。
  • あえて「教えることを生業にしていない方」を（多めに）ブッキングしています。“聞き手”を立てることによってフォローしながら進めますが、それでも説明が足りなかったり、うまく時間配分をコントロールできないことがあります。
  • また、「オンラインで画面に向かって一人で喋る」のは場数を多く踏まない限り、苦行です。そこで聞き手を立て、うなづきや相づちを入れています。「うなづきがうるさい、不要」と思う方もいると思いますが、ご容赦ください！（録画の講座ではなく、オンラインイベントなのです）
  • 「当日の視聴は無料」ということは謝礼もしかるべき金額ですし、日々の仕事の中から準備の時間を捻出されています。少し寛大なムードで受け取ってくださいますと幸いです。
  • 分単位で細かく練られたカリキュラムではなく、少し緩めに進行します。コメントを拾って脱線することもあります。言い換えると学習だけをされたい方には向いていません。
  • 若干の延長など、ぴったり進行しないことがあります。

協力企業のご紹介

本イベントには、下記の企業の協賛、協力をいただいています。

また、多くの制作会社に協賛いただいています。

通年で協賛を募集しています。検討くださいますと幸いです。

お問い合わせ

問い合わせはDoorkeeperのフォームからお送りください。

注意事項

※ こちらのイベント情報は、外部サイトから取得した情報を掲載しています。
※ 掲載タイミングや更新頻度によっては、情報提供元ページの内容と差異が発生しますので予めご了承ください。
※ 最新情報の確認や参加申込手続き、イベントに関するお問い合わせ等は情報提供元ページにてお願いします。
情報提供元ページ（Doorkeeper）へ

新規会員登録

このイベントに申し込むには会員登録が必要です。
アカウント登録済みの方はログインしてください。

※ ソーシャルアカウントで登録するとログインが簡単に行えます。

※ 連携したソーシャルアカウントは、会員登録完了後にいつでも変更できます。

関連するイベント