追記(2022/12/29): 問い合わせに対応する窓口をTwitterに統一したいので、フォームページは削除しました。
当ブログは静的サイトホスティングサービスのNetlifyでホスティングされています。
今回、ブログに問い合わせフォームを置くためにNetlify Formsを使ったのですが、静的サイトのまま簡単にフォームが設置できて最高でした。
Speeeのもくもく会(めっちゃおしゃれなオフィスでもくもくできる)で作りました。ありがたい。
静的サイトを運営しているのに、フォームを置くために裏にPHPなどのコードを動かすみたいな選択肢はイケていません。
フォームを置くだけならGoogle Formなどの選択肢もありますが、NetlifyにはNetlify Formsというフォームを簡単に作って管理画面上で簡単に確認できるような仕組みを用意してくれています。
<form name="contact" method="POST" netlify>
<!-- Your Form -->
</form>
のような形のHTMLを書くだけです。また自分でHTMLを書くのでデザインのカスタマイズも自由自在、サイトにあったイメージのフォームを置くことができます。
なお、100件のリクエストまで無料プラン(Forms Free)で使うことができます。参考: Price
Docsによると、ビルド時にHTMLをパースして、内部にformが存在しているか確かめているそうです。
GatsbyなどのStatic Site GeneratorでFormsを使用するはform-nameというhidden fieldを足す必要があります。Netlifyのブログ記事によるとNetlifyが挿入するフォームをGatsbyが消してしまうためだそうです。
おそらく前述のビルド時にHTMLをパースするときにNetlifyがform-nameというhidden formを埋め込むので、それを手動でやってくれという話だと思います。
以下のようなコードを書けば動きます。
<form name="contact" method="post" data-netlify="true">
<input type="hidden" name="form-name" value="contact" />
...
</form>
GatsbyでNetlify Formsを使うサンプルコードも用意されています。
imorente/gatsby-netlify-form-example: Example site integrating Netlify's form handing in Gatsby's starter template
毎年10月に開催されるHacktoberfestに参加しました。このイベントはOSSへの貢献を行い、期間中に規定数(4つ)の貢献を行った人に特典がプレゼントされるものになっています。 自分はドキュメ
Figmaの公式コミュニティであるFriends of Figma, TokyoのFigmaお楽しみトーク Vol.2というイベントでFigmaプラグイン開発について話してきました。 今回のイベント
GitHub Actionsでは定期実行(schedule)のイベントがサポートされておりCron形式で定期的に実行されるワークフローを定義できます。しかし、scheduleではなくpushイベントで