【20221019_toranoana.deno#9】閉鎖した個人開発のサービスを Deno Deployで復元する

【20221019_toranoana.deno#9】
閉鎖した個人開発のサービスを Deno Deployで復元する

約4年前開発し閉鎖したサービスを Deno Deployを中心とした サーバーレス環境で作り直すにあたっての技術的な変遷と、Freshベースで開発するにあたっての役に立ったことなど。

Transcript

1. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. 2022/10/19
 toranoana.deno #9 
 
 虎の穴ラボ
 奥谷 一陽
 閉鎖した個人開発のサービスを
 Deno Deployで復元する

2. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. 自己紹介
 奥谷 一陽
 所属：虎の穴ラボ株式会社
 担当：とらコインSHOPなど新規事業系の開発
 興味：TypeScript、Deno
 おすすめコンテンツ：
 　　『プラネテス』
 　　『暴太郎戦隊ドンブラザーズ』
 
 Twitter：@okutann88

3. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. 個人開発のWebサービスを作っている方
 どのくらいいるでしょう？

4. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. かくいう自分も
 過去にいくつか作ったものの閉鎖した

5. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. が、アイデアは悪くなかった
 けど、色々足りてなかった
 (と盲信して)
 Deno Deployで復元することにした

6. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. 復元するサービス 1h. 
 
 
 
 
 
 
 
 参考: https://www.ccbaxy.xyz/1h/

7. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. 開発中のサービス 1h.reboot 
 コンセプト：過去サービスと同じ
 　　　　　　匿名掲示板、書いて1時間で消える
 　　　　　　サービスで独自のIDを付与

8. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. 利用技術要素的な変遷
 当初(2018下期)利用技術要素
 - EC2
 - Node.js
 - Mysql(EC２内にインストール)
 - Vue.js
 - skelton.css
 - 特に認証の仕組みの導入は無し
 - 日本語のみ
 - JavaScript
 2022年10月
 - Deno Deploy(アプリ本体)
 - supabase(DB/API)
 - upstash(キャッシュ)
 - Fresh(preact)
 - tailwind.css
 - Twitter連携
 - i18n対応
 - TypeScript
 復元といいつつ、利用技術に共通性は薄く、 
 コンセプトの継承であって、「復元」ではないなと書いていて思いました。 

9. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. Deno Deploy 起点フルサーバーレス サービス インフラ 構想
 
 deno deploy ・APIサーバー ・DB管理 ・ストレージ キャッシュ呼び出し Redis qStash バッチ処理呼び出し APPサーバー
10. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. Freshに、追加導入しているモジュール
 Fresh 単独では、目的としたものは作れない
 追加で導入しているモジュール
 - std モジュール群
 - basic_auth：　開発中の一応の保護目的
 - redis：　redis接続用(deno deploy環境では、upstash-redisに差替)
 - fresh_session：　Freshにセッション管理を追加
 - deno_csrf：　CSRF対策用トークンの発行と検証
 - twitter_oath_1_0a：　Twitter連携用トークン発行と検証

11. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. Freshに、追加導入しているモジュール
 - fresh_session
 コントリビューターとして機能拡張してます。
 このくらいの規模感のOSSだと、手出ししやすいと思います。
 - deno_csrf
 - deno_twitter_oauth
 この２つは、私が公開しているモジュールです。

12. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. Fresh ベースで開発で役に立ったこと
 - DENO_ENV という環境変数
 いわゆる development / staging / production などが書いてある変数
 動作環境ごとのインフラの差異から、使用モジュールを差し替えしている
 - 開発環境 dockerで建てた redis を参照する
 - 本番/テスト環境(deno deploy) upstash redisを参照する
 　　(Rails脳で考えた結果なので、他の方法もあるかも)
 

13. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. Fresh ベースで開発で役に立ったこと
 - 環境変数 DENO_ENV の使用箇所：Redisモジュールの差し替え
 

14. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. Fresh ベースで開発で役に立ったこと
 - Fresh 標準ディレクトリ構成への追加
 utils、middlewares などディレクトリを追加
 どうしても標準のディレクトリ構成だけでやるには、
 少し厳しさを感じます。
 

15. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. Fresh ベースで開発で役に立ったこと
 - ページテンプレートコンポーネントの導入
 
 - fresh が提供している preact用のコンポーネントHead
 htmlのhead要素への要素追加ができます。
 
 import {Head} from “$fresh/runtime.ts”
16. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. まとめ
 - 約5年前に開発したサービスを復元を試みたら
 - 利用技術も
 - インフラも
 - 開発体験も
 　　変わっていた
 - OSSのコントリビューターになるのは、
 好みのフレームワークの関連モジュールくらいだと、お手軽でおすすめ

17. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. 今後の予定
 - サービスの正式公開： 独自ドメインも割当してから公開予定
 - このあたりのノウハウを...

18. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. 今後の予定
 - サービスの正式公開： 独自ドメインも割当してから公開予定
 - このあたりのノウハウを虎の穴ラボブログで、
 別のサービスとして公開していきます！

19. Copyright (C) 2021 Toranoana Inc. All Rights Reserved. ありがとうございました