BEGIN:VCALENDAR VERSION:2.0 PRODID:-//https://techplay.jp//JP CALSCALE:GREGORIAN METHOD:PUBLISH X-WR-CALDESC:Astroで学ぶモダンWeb制作入門（全4回）コンポ ーネント・静的サイト生成の基礎 X-WR-CALNAME:Astroで学ぶモダンWeb制作入門（全4回）コンポ ーネント・静的サイト生成の基礎 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:1000128@techplay.jp SUMMARY:Astroで学ぶモダンWeb制作入門（全4回）コンポーネ ント・静的サイト生成の基礎 DTSTART;TZID=Asia/Tokyo:20261006T190000 DTEND;TZID=Asia/Tokyo:20261006T210000 DTSTAMP:20260914T170120Z CREATED:20260902T063649Z DESCRIPTION:イベント詳細はこちら\nhttps://techplay.jp/event/10001 28?utm_medium=referral&utm_source=ics&utm_campaign=ics\n\nAstroで学ぶ モダンWeb制作入門（全4回）コンポーネント・静的サイ ト生成の基礎\n＞＞詳細およびお申込は、当社Webサイ トからご確認ください。\nリーク･アンド･リバー社 （C&R社）では、2026年10月6日（火）から全4回で「Astroで 学ぶモダンWeb制作入門 コンポーネント・静的サイト生 成の基礎」を実施します。\nWeb制作の現場では、表示 速度、保守性、SEO対策を意識したサイト構築がますま す重要になっています。\n本ウェビナーでは、近年注 目を集めているフロントエンドフレームワーク Astro を 使いながら、モダンなWebサイト制作の基礎を全4回で学 びます。\nAstroは、HTML・CSS・JavaScriptの知識を活かしな がら、コンポーネント化による効率的な開発やMarkdown によるコンテンツ管理を実現できるフレームワークで す。また、静的サイト生成（SSG）により、高速で軽量 なWebサイトを構築できることから、企業サイト、ブロ グ、ポートフォリオ、お知らせサイトなど幅広い用途 で活用されています。\n本講座では、Astroプロジェクト の立ち上げから始まり、コンポーネント設計、Markdown によるコンテンツ管理、JavaScriptを活用したインタラク ティブな表現、サイトのビルドと公開までを段階的に 学習します。\n4回の講座を通して、小規模なWebサイト を実際に構築しながら、Astroを活用したモダンなWeb制 作の流れを体系的に習得できます。\n\n▼予定している カリキュラム\n第1回：Astroの基本とページ作成(10月6日 （火）19:00-21:00)～Astroの基本的な仕組みを理解し、シ ンプルなWebページを作成する～\n\nAstroとは何か、どの ようなWebサイト制作に向いているかを学ぶ\n静的サイ ト生成（SSG）の基本的な考え方を理解する\nAstroプロジ ェクトを作成し、基本的なディレクトリ構成を確認す る\n.astroファイルの役割と、HTML・CSS・JavaScriptの基本的 な書き方を学ぶ\n複数ページを作成し、Astroでのルーテ ィングの仕組みを理解する\nヘッダーやフッターなど を共通レイアウトとしてまとめる\n\n第2回：コンポー ネントとデータ表示(10月13日（火）19:00-21:00)～ページ を部品化し、再利用しやすいWebサイトの作り方を学ぶ ～\n\nAstroコンポーネントを使って、ページ内の要素を 部品として分ける\nPropsを使い、コンポーネントへタイ トルや料金などのデータを渡す\nJavaScriptの配列データ から、複数のコンテンツを繰り返し表示する\nカード やナビゲーションなど、複数ページで利用できる部品 を作成する\nコンポーネントを利用した、修正しやす く再利用しやすいサイト構成を学ぶ\n\n第3回：Markdownと コンテンツ管理(10月20日（火）19:00-21:00)～お知らせや ブログなど、追加・更新されるコンテンツを管理する 方法を学ぶ～\n\nMarkdownを使って、文章中心のコンテン ツを作成する\nfrontmatterを使い、タイトルや日付などの 記事情報を管理する\nContent Collectionsを利用し、複数の 記事をまとめて扱う\nMarkdownの記事から、お知らせ一覧 ページを作成する\n動的ルーティングを利用し、記事 ごとの詳細ページを生成する\nページタイトルやdescript ionなど、基本的なSEO設定を行う\n\n第4回：JavaScript・画 像・ビルド(10月27日（火）19:00-21:00)～Webサイトに必要 な動きを加え、公開できる状態まで仕上げる～\n\nAstro でJavaScriptを利用し、必要な部分だけに動きを加える\n アコーディオンなど、シンプルなインタラクティブUI を作成する\nAstroの画像機能を利用し、画像を効率よく 扱う\nこれまで作成したページやコンポーネントを組 み合わせ、サイト全体を仕上げる\nnpm run buildを実行し 、公開用の静的ファイルを生成する\ndistディレクトリ を確認し、Webサイトを公開する基本的な流れを理解す る\n\n※適時休憩をはさみます。※講義内容は予定です 。当日の受講者の進捗等によって変更になる場合があ ります。\n▼お申込み前にご確認ください\n※当オンラ イン講座の対象・レベル・環境などの注意点です。ご 確認の上お申し込みください。\n・HTML、CSSの基本的な 知識がある方を対象としています。・JavaScript（ES6以降 ）の基本的な文法を理解していることを前提とします 。・学習内容は2026年9月時点のAstroの仕様に基づいてい ます。今後のアップデートにより画面や機能が変更さ れる場合があります。・アーカイブの配信はございま せんので予めご了承ください。↓ハンズオン形式で実 施します。実習には以下の環境が必要となります。・V isual Studio Code（最新版推奨）・Node.js LTS版・Google Chrome ・インターネット接続環境※受講に必要な環境につい ては、事前にご案内いたします。\n▼このような方に おすすめ\n\nHTML・CSS・JavaScriptの基礎知識を活かして次 のステップに進みたい方\nWebサイト制作の効率化や保 守性向上に興味がある方\nコンポーネントベースの開 発手法を学びたい方\nAstroや静的サイト生成（SSG）に興 味がある方\nブログや企業サイト、ポートフォリオサ イトを構築したい方\nフロントエンド開発の最新動向 に触れたい方\n\n登壇者\n関口 和真（せきぐち・かずま ）氏\n株式会社コムセント取締役 CTO\nサイトデザイン 、HTMLのコーディング、JavaScript・PHP等を利用したプロ グラム開発、iOS・Android向けアプリの作成、ウェブサー バーの実装、運用などトータルでウェブサイトの作成 を行う。テクノロジーを理解し、デザインやコーディ ング、サーバー運用やサービス運用のアドバイスをト ータルで行える点が強み。\n株式会社コムセント(Web制 作会社)のCTOとしてWebサイト作成、システム開発及びプ ログラム開発に従事。ECサイトのカスタマイズ、フル スクラッチによるWebシステム開発、映像配信システム や映像配信、配信用スマートフォンアプリ作成を主に 手がける。\n大学・専門学校にて、Web制作の授業を担 当（非常勤）。イベントやセミナーの登壇経験も豊富 。 Dreamweaver等の著書も。\n\n参加費\n無料\nお申込み\nこ ちらのサイトからお申込みください。\n▼お申込締切 ：2026年10月27日（火）21:00\n\n▼C&R社で実施しているオ ンライン講座・ウェビナー　一覧ページhttps://www.c-place .ne.jp/ LOCATION: URL:https://techplay.jp/event/1000128?utm_medium=referral&utm_source=ics&ut m_campaign=ics END:VEVENT END:VCALENDAR