主にフロントエンドでアプリケーションを書いている人向けの記事です。
また、AWS LambdaやGCP Cloud funtionsは知ってるけど敷居が高く感じていて、まだ実際にやったことのない人もこの記事の対象読者です。
任意のURLを生成して、そのURLにアクセスすると特定の処理が走るような仕組みをFaaS(Function as a Service)といいます。
何が嬉しいかというと開発者はサーバーを意識することなく特定の処理を実行する環境を手に入れることができるという点です。常にサーバーを立ち上げておく必要がないので、たいてい安く使えますし、サーバーの状態管理が必要なく気にすることも少ないです。
サーバーを意識することが少ないので、普段サーバーサイドになれていないフロントエンドな人でも始めやすいし、保守を必要としないので趣味プロダクトで使いやすいという性質も持っています。
とはいえ企業のプロダクトでも取り入れられていて、日経電子版とCookpadの例を載せておきます。
(どちらかといえば、FaaSというよりはサーバーレスアーキテクチャでlambdaが使われています。ただし趣味プロダクトと業務プロダクトではかなりの断絶があるように感じています。)
Netlify上でAWSのFaaSであるlambdaを利用できるようにしたものです。AWSのアカウントは不要でNetlifyのアカウントがあれば利用することが出来ます。
AWS LambdaやGCP Cloud funtionsは利用するのにクレジットカードの登録が必要で、始める敷居も高かったのですがNetlify functionsの場合、月120,000回の起動分は無料で使えるので非常に始めやすいという性質も持っています。
それでは、気軽に利用できるFaaSであるNetlify functionsを使ってFaaSを始めてみましょう!
前提として、Netlifyのアカウントは持っているものとします。
GitHubでリポジトリを作成しましょう。今回はhello-functions
というリポジトリにします。
$ mkdir hello-functions
$ cd hello-functions
$ git init
$ git commit -m 'Init' --allow-empty
$ git remote add origin [GitHubのリポジトリのURL]
$ git push -u origin master
今回は入門のために hello world という文字列を返すようにします。
第3引数として渡ってくるcallback関数を実行することでレスポンスの内容をいじることができます。
exports.handler = function(event, context, callback) {
console.log('Hello Netlify Functions.')
callback(null, {
statusCode: 200,
body: "Hello, World"
});
}
Netlifyの設定はGUIで操作できますが、リポジトリ上にnetlify.toml
というファイルを置くことでも変更可能です。今回はnetlify.toml
を利用します。以下の内容でリポジトリのルートディレクトリに置きましょう。
[build]
functions = "functions"
Netlifyへの会員登録を行っていない型はGitHubアカウントがあれば簡単に登録できます。
登録済みの方は「New site from Git」=> 「GitHub」とクリックしていくとリポジトリ選択画面が現れるので、今回作ったリポジトリを選択しましょう。
Basic build settingsの画面が現れますが、今回に関してはBuild command、Publish directoryは空でも大丈夫です。Deploy Site
をクリックしましょう。
これでNetlify連携は完了です。
これ以降、GitHubにpushされたタイミングでNetlifyに変更が反映されるようになります。
上部のFunctions
を押すとそのリポジトリのFunctionの一覧が現れるのでhello.js
を選択します。
遷移先のページの上部にEndpointという項目がありそのURLが、Functionsの起動URLになります。
そのURLにアクセスしてみるとHello, World
という結果が返ってくると思います。これで無事に動作していることがわかりました。
Hello Worldが表示されるだけだと何のメリットも感じられませんね。実際には、この関数の中の処理を充実させていくことになります。
多分、応用編も書いていきます。
技術書典5でNetlifyに関する本を書く予定です。Netlify Functionsを利用したSlack appの作成方法に関しても書こうと思っています。
興味のある人は僕のTwitterをフォローしていただけると嬉しいです。
ここ最近、Web技術を利用した画像生成に興味があります。本記事では、日本語における表現の一種である縦書きに焦点を当て、Web技術を使った縦書きを含む画像生成方法についての調査をまとめました。 > 現
追記(2022/12/29): 問い合わせに対応する窓口をTwitterに統一したいので、フォームページは削除しました。 当ブログは静的サイトホスティングサービスのNetlifyでホスティングされ
毎年10月に開催されるHacktoberfestに参加しました。このイベントはOSSへの貢献を行い、期間中に規定数(4つ)の貢献を行った人に特典がプレゼントされるものになっています。 自分はドキュメ