BEGIN:VCALENDAR VERSION:2.0 PRODID:-//https://techplay.jp//JP CALSCALE:GREGORIAN METHOD:PUBLISH X-WR-CALDESC:React開発者が語るモダンフロントエンドの基礎 とNext.js入門 X-WR-CALNAME:React開発者が語るモダンフロントエンドの基礎 とNext.js入門 X-WR-TIMEZONE:Asia/Tokyo BEGIN:VTIMEZONE TZID:Asia/Tokyo BEGIN:STANDARD DTSTART:19700101T000000 TZOFFSETFROM:+0900 TZOFFSETTO:+0900 TZNAME:JST END:STANDARD END:VTIMEZONE BEGIN:VEVENT UID:987589@techplay.jp SUMMARY:React開発者が語るモダンフロントエンドの基礎とNe xt.js入門 DTSTART;TZID=Asia/Tokyo:20251212T140000 DTEND;TZID=Asia/Tokyo:20251212T160000 DTSTAMP:20260527T164055Z CREATED:20251013T140425Z DESCRIPTION:イベント詳細はこちら\nhttps://techplay.jp/event/98758 9?utm_medium=referral&utm_source=ics&utm_campaign=ics\n\n本イベント は終了しています。「アーカイブ動画を見たい方」「 スライドをダウンロードしたい方」はSTORESからお求め ください。個人向け（3\,300円）※領収書なし個人・フ リーランス（5\,500円）法人向け（11\,000円）本日現在（ 12月12日[金]）、149本のアーカイブが見放題になる定額 制（サブスク）も用意しています。3ヶ月ごと：35ドル1 2ヶ月ごと：130ドル動画だけでなく、スライドや補足な ども含まれます。\n\n諸事情により、開催時間を「14:00 - 16:00」に変更します。\n\n『プロフェッショナルWebプ ログラミング React』の出版を記念し、著者4名が登壇。 Reactをこれから学びたい方を対象に、ReactとNext.jsの基 礎を解説いただきます。\n\n「リアルタイム視聴は無料 」スタイルで開催しますが、アーカイブチケット購入 やサブスク登録でサポートくださいますと助かります ！\n\nReact開発者が語る ― モダンフロントエンドの基 礎とNext.js入門\n\nReactはコンポーネント指向による効率 的な開発スタイルと、大規模プロジェクトにも対応で きる拡張性、世界的に活発なコミュニティに支えられ 、現在、最も人気のあるフレームワークの一つです。\ n\nこれからReactを始めたい方を対象に、現役フロント エンドエンジニアがReactとNext.jsの基礎をわかりやすく 解説します。\n\n\nDOM操作から脱却！Reactでつくるコン ポーネント思考／長谷川広武\nReactのソフトウェア開発 における役割／飛田 心\nReactステート管理の基本原則 ／伊藤 将貴\nLeaning Next.js App Router／西畑 一馬\n\n\n『プ ロフェッショナルWebプログラミング React』の出版を記 念して開催。モダンフロントエンド開発を学びたい方 、書籍の内容に興味をお持ちの方、本を購入いただい た方にもおすすめのセミナーです。\n\nDOM操作から脱却 ！Reactでつくるコンポーネント思考\n\nフロントエンド 専門の人だとすでに馴染みのなくなったjQueryかもしれ ないですが、「jQueryなら触れるけど、Reactはまだよく 分からない…」という方に向けた入門セッションです 。\n\njQueryではDOMを直接操作して要素を書き換えるのが 基本ですが、Reactでは「状態」と「コンポーネント」 を使い、イベントをきっかけにUIを自動で切り替える 仕組みを採用しています。\n\n本セッションでは、クリ ックや入力フォームの操作といったおなじみの処理を 例に、jQueryでの書き方とReactでの書き方を比較。コン ポーネントを作る流れやイベントの記述方法を、シン プルなサンプルを通じて解説します。\n\n長谷川広武 株式会社HAMWORKS株式会社HAMWORKS代表取締役。フロントエ ンドエンジニア兼テクニカルディレクターとして、HTML /CSS/JavaScriptやWordPress等の開発を手がける。Web制作の企 画から設計、実装、運用まで一貫したサポートを提供 。2009年より札幌でWebデザイナー向け勉強会「SaCSS」を 主催・運営。\n\nReactのソフトウェア開発における役割\ n\n近年、Webアプリケーション開発においてReactは事実 上の標準となり、多くのプロジェクトで採用されてい ます。本セッションでは、単なるフロントエンドライ ブラリに留まらないReactの役割について掘り下げます 。\n\nUI構築の効率化だけでなく、状態管理、パフォー マンス最適化、保守性・拡張性の担保といった観点で どのようにReactが活用されているのかを解説します。 さらに、Next.jsとの組み合わせによるフルスタック開発 や、実務における設計判断のポイントも紹介します。\ n\n飛田 心 株式会社FLAT株式会社FLATにてフロントエンド 開発のリードエンジニアを担当。React／Next.js を用いた フロントエンド開発に加え、Node.js を用いたバックエ ンド開発を業務で行う。UI/UXの改善や保守性の高いア プリケーション設計・実装が得意。\n\nReactステート管 理の基本原則\n\nReactアプリの複雑さは多くがステート に由来します。本セッションでは、なにをステートと して持ち、持たないのか、ステートをどこに位置づけ るのか、ステートの変化をどのように扱うのかという 三つの基本軸を、実務で使えるコンパクトな原則とし て整理します。判断の軸を持つことで、読みやすく、 変更に強く、バグが生まれにくいReactコードを書ける ようになります。\n\n伊藤 将貴 株式会社FLAT業務システ ムやBtoB SaaSのフロントエンドを主軸に、React歴5年。ア プリケーションのアーキテクチャ設計を担い、フロン トエンドからクラウドインフラまでフルスタックで実 装・運用。開発チームのマネジメントを行いつつ、開 発プロセスを効率化やUI/UX 改善にも取り組んでいる。\ n\nLeaning Next.js App Router\n\n2022年にリリースされた Next.js 13には「App Router」という新しいルーティングシステム が導入されました。\n\n「App Router」はこれまでとは異 なるアプローチでWebアプリケーションの体験を向上さ せようとしています。\n\n本セッションでは「App Router 」がこれまでのReact / Next.js とどのように違うのか、ま た、どのようなメリットがあるのかを解説します。\n\n 西畑 一馬 株式会社トゥーアール1979年大阪生まれ。2002 年からWeb制作をはじめ2016年にフロントエンド専門のWeb 制作会社「株式会社トゥーアール」を設立しReactやNext. jsを利用したモダンフロントエンド開発を行っている 。「Web制作の現場で使うjQueryデザイン入門(アスキー・ メディアワークス刊)」や「JavaScriptコーディングベス トプラクティス(MdN刊)」など多数の著書を執筆してい る。\n\n『プロフェッショナルWebプログラミング React』 \n\n\n\n現在のWeb開発に欠かせないJavaScriptライブラリ／ フレームワークのなかでも、最も人気を集めているの がReact。『プロフェッショナルWebプログラミング React 』は、最新バージョンであるReact19に対応した、プロを 目指す方のためのReact入門書です。\n\n\nPART 1　Reactの基 本を学ぶ\n\n\nCHAPTER 1　Reactを始める準備\nCHAPTER 2　React の第一歩\nCHAPTER 3　ステート・副作用・メモ化\nCHAPTER 4 　グローバルステート\n\nPART 2　Reactで実際にWebページ を作る\n\n\nCHAPTER 5　TODOアプリを作ってみよう\nCHAPTER 6 　Next.js\n\n\n\nイベント概要\n\nYouTube Liveでライブ配信し ます。\n\n\n開催日：2025年12月12日（金） 14:00 - 16:00\n形 式：オンライン（YouTube Live）\nMC：鷹野 雅弘（スイッ チ）\n主催：CeeBeeDee\n共催：CSS Nite、DTP Transit\n協賛（制 作会社）：ウェブライダー、LINICA、エンタミナ、コン セント、サービシンク、ビットエー、ヘルツ、アップ ルップル、CODE54、HAMWORKS、S-FACTORY、necco、FLAT、ONiWA ほ か\n協賛：文賢（ブンケン）、デジ革（一般社団法人 デジタル経営革新協会） \n\n\nお申し込みと参加費\n\n\n リアルタイムの視聴は無料です。\n参加にはお申し込 みが必要です。受け付けは終演時刻まで。\n\n\nフォロ ーアップ（アーカイブ）\n\n有料チケットには次が含ま れます。これを「フォローアップ」と呼んでいます。\ n\n\nアーカイブ動画\nスライド\nリンク集や補足\nサン プルファイルなど（プログラムにより）\n\n\nフォロー アップ（アーカイブ）は、アーカイブ購入／サブスク の方限定のコンテンツです。\n\n\nアーカイブ動画の視 聴期限はありません。ずっと見られます。\n法人およ びフリーランスで事業決済される方は「法人向け」を お求めください。\n\n\nフォローアップ（アーカイブ） の購入\n\n次の3つの方法があります。いずれかを選択 なさってください。\n\n\n終演時刻まで：Doorkeeper\n終演 時刻以降：STORES\nサブスクを登録する\n\n\nDoorkeeperの場 合、終演時刻にメールをお送りしています。メールの 送信元は、info@doorkeeper.jp です。 メールに依存しないST ORESやサブスクであれば、メール関連のトラブルから開 放されます。\n\n購入方法種別フォローアップの受け取 り備考個人個人、フリーランス法人Doorkeeper （単品）2\ ,200円（終演時刻まで）5\,500円11\,000円終演時刻にメー ルを送信（info@doorkeeper.jpから送信されます）「当日の 視聴のみ」のチケットを申し込まれた方は、いったん 、キャンセルして「アーカイブ視聴付き」のチケット を申し込んでください。STORES（単品）3\,300円5\,500円11\, 000円購入するとダウンロードできるテキストファイル に、アーカイブ動画や特典を掲載予定のページへのリ ンクがあります（アーカイブ動画や特典の掲載はイベ ント終了後）ユーザー登録してから申し込むと、［マ イページ］の［購入履歴］から、後からダウンロード できます。サブスク3ヶ月：35ドル［メンバー限定］セ クションの［フォローアップ（アーカイブ）］から本 イベントのNotionにアクセスしてください。法人は別途 （詳細）年パス：130ドル\n\n領収書\n\n個人向けのチケ ットは領収書発行していません。\nインボイス対応の 領収書は、次のチケットのみ対応します。\n\n\n個人／ フリーランス（スライド、アーカイブ視聴付き） ※経 費として\n法人（スライド、アーカイブ視聴付き） \n\n \nNotionからPDFをダウンロードしてご利用ください。\n\n 購入方法区分参加費領収書入手方法Doorkeeper（単品）個 人2\,200円発行（インボイス非対応）Doorkeeper個人／フリ ーランス5\,500円インボイス対応の領収書を発行Notion法 人11\,000円STORES（単品）個人3\,300円非対応-個人／フリ ーランス5\,500円インボイス対応の領収書を発行Notion法 人11\,000円\n\n\n「法人（スライド、アーカイブ視聴付き ） 」のチケットを購入いただいている場合のみ、記名 入りの領収書に対応いたします。フォームからご連絡 ください。\n\n\n配信に関してのあれこれ\n\n各URLは、You Tubeの概要欄にも掲載しています。\n\n\nチャットやスタ ンプ、ツイートなど「参加型」でお楽しみください！\ n「音声のバランスが悪い」など、何かお困りの場合、 コメントなどで教えてください！\n\n\n配信URL\n\nYouTube L iveで配信します。\n\nhttps://youtube.com/live/g7PGQq2BQbU?feature= share\n\nX（Twitter）にて同時配信も行っていますが、YouTu be Liveにてコメントも含めてお楽しみください。\n\n配 信トラブルでURLが変更になることがあります。その場 合、次のようにお知らせします。\n\n\nTwitter（現「X」 ）\n配信が停止したYouTubeプログラムのコメント欄\nDoork eeper経由でのメッセージ（メール）\n\n\nYouTube関連\n\n\nY ouTubeチャットを活用ください！　スパム回避のため、Y ouTubeチャンネル登録者のみがコメント可能にしていま すので、事前にチャンネル登録をお願いします。\nス ーパーチャット（スパチャ＝投げ銭）を利用できます 。少額でも大歓迎です！　いただいた全額を講演者に お渡しします。\n質問がある場合、YouTubeチャットで冒 頭に★または【質問】を付けてコメントください。す べては拾いきれません。「〜は〜という意味です」「 自分の現場ではこうやっている」など、視聴される方 からのサポート的なコメントを歓迎します！　一緒に 場を作ってくださいますと嬉しいです!! \n\n\nリアクシ ョンや質問\n\n\nスクショ付きのツイート歓迎です。ぜ ひ、ハッシュタグ（#React入門）を付けてください。た だし、事例の部分などでNGマークがついている箇所、 講演者からNGの指示のある箇所はご遠慮ください。\n終 了後、ぜひアンケートにお答えください！　「フィー ドバックはギフト」。話してくださった方の成長の材 料になり、また、イベントの改善につながります。\n\n \nその他\n\n\n120分のプログラムでは、60分前後のキリの いいタイミングで休憩（5-10分）をはさみます。\nサン プルファイルや配布資料、アーカイブ動画のURLをSNSな どで再配布するのは禁止です。\n開演の30分前くらい前 からテスト配信をスタートします。音声などが聞こえ るかなど、チェックなさってください。\nスマホやタ ブレットで視聴される方もいると思いますが、PCでの 視聴を前提としています。なるべくPCでご覧ください ！\nご覧いただく回線状況によっては、YouTubeの動画が 止まってしまったり、音声が途切れてしまうことがあ ります。その場合には、ブラウザーを再読み込みした り、OSを再起動してみてください。同時配信しているX （Twitter）の方が安定してることがあります。\n分単位 で細かく練られたカリキュラムではなく、少し緩めに 進行します。コメントを拾って脱線することもありま す。言い換えると学習だけをされたい方には向いてい ません。\n若干の延長など、ぴったり進行しないこと があります。\n\n\n配信準備は念入りに行っていますが 、本番になると予期せぬトラブルが生じるのがライブ 配信です。それも含めて楽しんでください。\n\nサブス ク\n\nCSS Nite、DTP Transitのオンラインセミナーのアーカ イブをリーズナブルに、また、管理しやすく利用いた だけるように「サブスク」（定額サービス）をご用意 しています（Circleというサービスを利用しています） 。\n\n\n3ヶ月ごと：35ドル\n年パス：130ドル\n\n\n年間で60 回近く開催されますので、1本あたり400円を切る計算で す。\n\n\nサブスク対象イベントのリスト\n\n\nアーカイ ブ動画だけでなく、スライドのダウンロードも可能で すので、ざっと内容を把握しておきたい場合にも適し ています。また、自分のペースで手元のスライドPDFを 見ながらの視聴が可能です。\n\n\n\nサブスクの登録方 法\n\n次の手順でお申し込みください。\n\n\nCircleでユー ザー登録（自動返信メールを確認して完了です）\nStrip eで決済\n\n\n\n3ヶ月ごと：35ドル\n年パス：130ドル\n\n\n オンライン椅子ヨガ\n\n本イベントはコモモ先生 @komomoa ichi のオンライン椅子ヨガ付きです！\n\n\n開演前\n休憩 時間（適宜）\n\n\n一緒に「ちょっとメンテ」しましょ う。\nhttps://chotto-maint.com/online-yoga\n\n\n\n協力企業のご紹 介\n\n本イベントには、下記の企業の協賛、協力をいた だいています。\n\n\n文賢（ブンケン）～文章をより良 くするための推敲・校閲・校正支援ツール\nデジ革（ 一般社団法人デジタル経営革新協会） ネットとAIで経 営に貢献できる人材になる\nJILLA（日本イラストレーシ ョン協会）　文芸美術国保への加入や交流会などメリ ットいっぱい\ntr-tant 仕事を割り振っても次から次へ仕 事が舞い込む繁忙期にデザイナーの混み具合が見える デザイナー専用タスク管理ソフト \n\n\n\n\nまた、多く の制作会社に協賛いただいています。\n\n\nウェブライ ダー\nLINICA\nエンタミナ\nコンセント\nサービシンク\nビ ットエー\nトゥーアール（to-R）\nヘルツ\nアップルップ ル\nCODE54\nHAMWORKS\nS-FACTORY\nnecco\nFLAT\nましじめ\nグローバ ルデザイン\nエイチツーオー・スペース\nGear8\nマジカ ルリミックス\nONiWA\nさきがけデジタル\nr360studio\n\n\n\n\n 通年で協賛を募集しています。検討くださいますと幸 いです。\n\nお問い合わせ\n\n問い合わせはDoorkeeperのフ ォームからお送りください。 LOCATION:オンライン URL:https://techplay.jp/event/987589?utm_medium=referral&utm_source=ics&utm _campaign=ics END:VEVENT END:VCALENDAR