7
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

はじめに

仕事関係で某サービスの契約申込フォームを作ったのですが、フォームでTypeformを使っており、契約管理をkintoneで行っているという環境なので、Typeformから新規エントリー(申込)があったら、kintoneにレコードが登録されるように連携しました(なんだか既出感…

ざっとggr先生に聞くと意外と?記事がなかった?(もしかしたら検索スキルが皆無なだけかもしれない…

連携部分には鉄板のZapierを使ってます。
No-codeということを考えるとわりとはずせない。
サポートしているサービスも1000+。いやーすごいね。

Zapier | The easiest way to automate your work
2018-12-22 16-24-59.png

構成図

構成的にはこんな感じ。シンプル。
nocode_integration.png

TypeformもkintoneもZapierでサポートされているので、選んでぽちぽちするだけです。

シンプルな連携ならfreeプランで十分。
この画像にはないけど、これ以外にもTeamプランもある。
2018-12-22 16-42-29.png

事前準備

Zapierでアカウントを登録します。
あと当然ですが、Typeformで作成済みのフォーム、kintoneで作成済みのアプリがある前提。
なければ先に作成が必要。

kintoneアプリへはAPIトークンでアクセスするので、連携するアプリであらかじめトークンを発行しておきます。
2018-12-19 15-03-39.png

Zapier設定

Zapierでは、サービス同士の連携の設定をZapと呼びます。

トリガー→アクションの順にウィザードに沿ってぽちぽち設定をしていきます。
今回のパターンでは、

  • Typeformから新規エントリー(申込)があったら 【=トリガー】
  • kintoneに新規レコードを登録する 【=アクション】

というような設定になります。

トリガーの作成

まずはトリガーとなるTypeformの設定をしていきます。
「Make a Zap!」 をクリックしたら、ウィザードに沿って設定を進めるだけ。
2018-12-22 17-03-36.png

トリガーとなるアプリを選択する画面が出てくるので、Typeformを選択。
Zap名も忘れないうちに設定しておくことをお勧めするよ!(画像左上)
2018-12-22 13-32-23.png

トリガーのタイプは「New Entry」しかないのでそのまま次へ。
2018-12-22 13-31-47.png

Typeformのアカウントを紐づけます。
連携済みのアカウントがあればすでに出てきますが、新規の場合は「Connect an Account」をクリック。
2018-12-22 17-20-31.png

Typeformのログイン画面が出るので、Typeformのアカウントでログイン。
その後アクセス権などもにょもにょ聞かれますが、ウィザードに沿って画面を進めていくと紐づけができます。

登録が完了したので次へ。
2018-12-19 14-23-12.png

Typeformのどのフォームを連携対象にするかを選択。
2018-12-19 14-25-06.png

トリガーの作成が完了したら、次は 「Add a Step」 をクリックしてアクションの設定に進みます。
2018-12-22 17-46-34.png

アクションの設定

「Action/Search」 でアクションを登録していきます。
2018-12-22 17-47-34.png

アクションを行うアプリとしてkintoneを選択。
2018-12-22 13-49-52.png

アクションのタイプを選択します。今回は新規でレコードが追加されるようにしたいので「Create Record」を選択。
2018-12-22 13-50-43.png

Typeformと同様に、kintoneのアカウントの紐づけをします。
2018-12-22 13-51-43.png

kintoneはAPIトークンを使ってアクセスを行うので、事前準備で作成しておいたAPIトークンをここで入力。
2018-12-19 14-57-39.png

アカウントの紐づけができたら、フィールドのマッピング。
ここでkintoneのフィールドと、Typeformの項目をマッピングします。
2018-12-22 13-52-48.png

これで完成。
2018-12-19 16-05-29.png

あとは、実際にTypeformから申込のテストをしてみて、レコードの中でうまく登録されないフィールドなどがあったら適宜調整していく感じ。

おわりに

サービスをうまく組み合わせることでコードを極力書かずに連携が実現できたりするものも増えてきているので、アイデアと意欲次第でいろいろできるんじゃないかなー。
もうちょっとチラ裏的な記事にしたかったけど、仕事の延長みたいな記事になったでよ…(;∀;)

7
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
7
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?