JavaScriptでChrome拡張アプリを開発しよう！ハローワールドからアンチ検索アプリ作成まで

2021/12/11(土)13:00 〜 16:00 開催

ブックマーク

JavaScript, HTML, Git

イベント内容

HTML/CSS/JSの知識があればつくれるChrome拡張機能のアプリ開発に挑戦してみよう！

Hello WorldのChrome拡張機能をつくるところからGoogle検索でニガテなサイトを検索結果から除外できるアプリを作るところまでをオンラインで開催します。（顔出しなし・音声無しOK）
参加者限定でアプリを作るためのチュートリアルリポジトリをシェアしながら解説。

主催者は過去にTwitterの使う時間帯を制限するアプリや別の検索エンジンと同時に検索できるアプリなどを個人用途でつくりました。

公開中のYoutubeの便利系アプリ「Extension Youtube Player」に関しては英語圏向けにつくってみてアプリの宣伝をほぼ全くしていないのにDL300を超えていてHTML/CSS/JSだけでつくれるアプリなのに世界中の人たちに使ってもらえることが嬉しいなという気持ちになりました。

「Chrome拡張機能をつくってみたかった」
「たまには違うものをつくってみたい」
「最近JavaScriptを始めたけれどインプットばかりで気軽にアウトプットできるものが欲しい」
「個人開発すき」
な方たちは一緒にアプリ開発してみませんか。

Chrome拡張機能の開発ではJS以外にもAPIを叩いたりJSフレームワークを使ったりTypeScriptを使ったりもできるのでJSだけでは物足りない人のアウトプットにも適しています。

スケジュール

12月11日（土） Google meetingにて

時間帯	予定
~13:10	初めましての挨拶
~13:40	Chrome拡張機能の良さと作り方とHelloWorldを表示させるまで
~14:00	Google検索結果にあるDOMを取得して開発中の拡張機能で処理してみるまで
~14:30	アンチ検索アプリの作り方と概要
~15:00	ブレイクタイム(進捗や状況をみて時間変更あり）
~15:50	（質問OKもくもくタイム）各自でアンチ検索アプリの機能を実装してみよう
~16:00	終わりの挨拶と"開発の森"の紹介

※ご参加される方の進捗度合いなどを鑑みてスケジュールが前倒し及び後ろ倒しになる場合もありますのであらかじめご了承ください。

参加で期待できること

・Chrome拡張機能を作るために必要な最低限の知識とアウトプットができるようになる
・個人で使うレベルのChrome拡張機能を作れるようになる（作り方がわかるようになる）
・JavaScriptのスキルアップ

必要な準備

HTML/css/JavaScriptの基本的な知識
ブラウザChromeをインストール
コーディングするためのエディタ（ない方はVisual Studio Codeを推奨）
git cloneでリポジトリを引っ張ってこれる程度のgit操作の知識

イベントグループについて

開発の森とは

現在はNextJSでニッチなアミノ酸のサイトを制作中の主催者がアウトプットする者同士でつながれる場が欲しいと思い作成したグループです。
個人開発に興味のある人からエンジニアリングに関わらずに作品や成果物をアウトプットしている人達までを対象にしています。

今回のハンズオンで時間が足りなかった、もっと理解を深めたかった、こんなものを作りたくなったって方は隔週ペースの土曜日で個人開発もくもく会を行っているのでぜひお気軽に参加してみてください。