参加登録について

⚠️このページはイベント紹介用ページです。

参加登録はconnpussで行なっています。

概要

この勉強会では，JavaScriptライブラリ「React」と，デザインコンポーネントライブラリ「MUI（Material UI）」を使って，

モダンなToDoリストアプリを一緒に作成します！

Reactに挑戦してみたい方，HTML＋CSSより手軽にWebページが作りたい方におすすめの内容です。

Reactとは

Reactは，Facebookが開発したUI構築のためのJavaScriptライブラリです．

HTMLに近い文法の「JSX」と「JavaScript」によって効率的かつ柔軟にWebアプリを構築できます．

HTML, CSS, JSを学んだ人の次のステップにおすすめです！

MUIとは

MUI（旧Material-UI）は，GoogleのMaterial Designに基づいたReact向けUIコンポーネントライブラリです．

すぐにキレイなボタン，レイアウトが作成できるのが魅力です！

このイベントの対象

- Web開発に興味がある方

- Webアプリを作ってみたい方

- HTML+CSS+JS からステップアップしたWeb開発が知りたい方

- Reactの使い方を学びたい方

- UIライブラリで洗練された見た目のアプリがつくりたい方

<br/>

プログラミングに少しでも触れたことがある方（Pythonなど）であれば，JavaScript未経験でも把握できるように解説します！

（JavaScriptの文法やReactの考え方は，必要に応じて丁寧に解説します）

※プログラミングが完全に初めての方には少し急に感じるかもしれませんが、大歓迎です！

完成品イメージ

この勉強会では，こんな感じのToDoリストの作成を目指します！

<img src="https://kanadesisido.github.io/React-Handson-2025/todo.webp" width="450px"/>

タイムテーブル（予定）

|時間|タイトル|

|----|----|

|14:00 ~ 14:10|オープニング・ソフトウェアの準備|

|14:10 ~ 15:00| Reactを学ぶ |

|15:00 ~ 15:10| 休憩 |

|15:10 ~ 16:30 | MUIを使ったToDoアプリ開発 |

必要なもの

- PC

ソフトウェアの事前インストールをお願いします

本イベントでは，以下のソフトウェアを利用します．

事前のインストールへのご協力をお願いします！

- テキストエディタ（Visual Studio Codeなど）

Visual Studio Code：https://code.visualstudio.com/download

Visual Stuido Codeのインストール方法（参考）：https://qiita.com/YurimyMiyu/items/5ce7821f1e3e5905c3ee

- Node.js

Node.js：https://nodejs.org/ja/download

Node.jsのインストール方法（参考）：https://note.com/smoker_lifehack/n/nbd3e9d3c8f9f

主催・協力

主催

[GDGoC TMU](https://x.com/GdscTmu)

X: https://x.com/GdscTmu

協力団体

[GDG Greater Kwansai](https://x.com/gdgkwansai)

X: https://x.com/gdgkwansai

[GDG Kobe](https://gdg.community.dev/gdg-kobe/)

GDG Site: [https://gdg.community.dev/gdg-kobe/](https://gdg.community.dev/gdg-kobe/)

[GDG Tokyo](https://x.com/gdgtokyo)

X: https://x.com/gdgtokyo

協力（敬称略，順不同）

naoki@Xoogler, GDG 関西、神戸

Naoya (ex-GDSC Osaka, GDG Tokyo)