Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
【初学者向け】Honoを使ったREST APIを構築してみよう!
Search
Keitaro Miyano
June 25, 2024
0
270
【初学者向け】Honoを使ったREST APIを構築してみよう!
2024年6月25日に開催された「【初学者向け】Honoを使ったREST APIを構築してみよう!」の資料です!
Keitaro Miyano
June 25, 2024
Tweet
Share
More Decks by Keitaro Miyano
See All by Keitaro Miyano
React × Tailwind × v0で始める コンポーネント開発をしてみよう!
miyakei1225
0
66
全部お見せします!現役エンジニアが開発現場で実際に使っているツールと便利設定集
miyakei1225
0
32
React勉強会
miyakei1225
0
260
初学者歓迎!Go言語でWebサーバー構築ハンズオン!
miyakei1225
0
33
お手軽環境構築!はじめてのDocker講座
miyakei1225
1
380
Expo SDK 50について&早速アップデートしてみた
miyakei1225
0
100
Webエンジニアが スマホアプリを個人開発した話📱
miyakei1225
0
56
connect-webの恩恵
miyakei1225
0
110
Featured
See All Featured
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
The World Runs on Bad Software
bkeepers
PRO
69
11k
The Cult of Friendly URLs
andyhume
79
6.5k
GitHub's CSS Performance
jonrohan
1031
460k
Gamification - CAS2011
davidbonilla
81
5.4k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
A Modern Web Designer's Workflow
chriscoyier
695
190k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
50
5.5k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Art, The Web, and Tiny UX
lynnandtonic
299
21k
Transcript
【初学者向け】 Honoを使ったREST APIを 構築してみよう! 技育CAMPメンター 宮野 奎太朗
はじめに 2 学生の皆さま、 今回ご参加いただきありがとうございます!
はじめに 3 【名前】宮野 奎太朗(ミヤケイ) 【出身】青森県青森市🍎 【会社】株式会社サイバー・バズ 【作っているもの】クリエイターマッチングサービス 【趣味】ランニング、ポーカー、個人開発 (React Native) 【X】@38ke1
本日はよろしくお願いします!
はじめに 4 ・サーバーサイド言語に挑戦してみたい ・Honoに興味がある方 ・REST APIの構築に挑戦してみたい方
はじめに 5 前半のインプットタイムで Honoの概要について話します!
はじめに 6 後半はアウトプットタイムとして 実際にコードを一緒に書いてみましょう!
今回のゴール 7 ・Honoの言語特徴を知る ・簡単なAPIの構築とデプロイ
今回のアジェンダ 8 1. Honoとは? 2. プロジェクトの構成について 3. Cloudflareについて 4. Postmanについて
【インプットタイム🌞】
今回のアジェンダ 9 5. 環境構築をしてみよう! 6. サンプルファイルを見てみよう! 7. REST APIを作ってみよう 8.
Cloudflareにデプロイ 【アウトプットタイム🌝】
今回のゴール 10 ・Honoの構成、特徴を知る ・簡単なAPIサーバーを作る&デプロイ🔥
1. Honoとは? 11 Honoとは?
1. Honoとは? 12 Honoとは? →日本人(Yusuke Wadaさん)が 開発したフレームワーク
1. Honoとは? 13 Cloudflare Workers上で 動かすことを目的として開発
1. Honoとは? 14 日本語版ドキュメント
1. Honoとは? 15 Web標準APIのみ使用
1. Honoとは? 16 Web標準APIのみ使用 →柔軟な実装が可能、様々な環境で動かせる
2. プロジェクトの構成について 17 一緒に構成を見てみましょう!
2. プロジェクトの構成について 18 動かす上で重要なファイルを紹介します!
2. プロジェクトの構成について 19 今回はこちらを覚えて帰ってください! wrangler.toml
3. Cloudflare Workersについて 20 Cloudflare Workersとは? →エッジ環境で動くホスティングサービス
3. Cloudflare Workersについて 21 【メリット】 ・キャッシュが柔軟 ・コストを抑えられる ・デプロイがラク(開発体験◎)
3. Cloudflare Workersについて 22 Q. wranglerでデプロイされたコードは どこのサーバーで実行される?
3. Cloudflare Workersについて 23 A. リクエストの送信元に最も近い 地域のデータセンター(サーバー) →サーバーレス・エッジコンピューティングと呼ばれる
4. Postmanについて 24 APIを叩ける便利なツール! こちらからダウンロード
25 GitHubのリポジトリをクローンしましょう! URL 5. 環境構築をしてみよう!
26 Bunをインストールしましょう! URL 5. 環境構築をしてみよう!
27 6. サンプルファイルを見てみよう! 予め作ったプロジェクトの全体像を 一緒に見てみましょう!
28 7. REST APIを作ってみよう! 構成を頭の片隅に置きつつ、 プロジェクト作成 〜 API実装をしてみましょう!
29 7. REST APIを作ってみよう! Cloudflare Workers用のテンプレート
30 8. Cloudflare Workersにデプロイ もし動かなくなったらコメントください (OSでの環境差分もある)
31 完成! みなさん動かすことは出来ましたか?
まとめ 32 今回はHonoの概要に触れて 簡単なWebサーバーを構築 してもらいました
まとめ 33 Zoomのチャット欄に コメントを書いていただけると嬉しいです!
まとめ 34 粘った経験が必ずエンジニアとしての 糧になります!
まとめ 35 最後に僕の好きなキャッチコピーを紹介します👀
まとめ 36 ハッカソンについて
まとめ 37 最後に僕の好きなキャッチコピーを紹介します👀
まとめ 38 皆さま本日はお疲れ様でした!👋