iMessagePlex

サーバーがなくても メッセージフォーム をすぐに立ち上げよう!

無料のAPIが好きなので、ポートフォリオサイト用にフォームメッセージを処理するこのウェブサイトを作成しました。

機能

簡単なAPIインテグレーション

サーバー側のコード管理を気にせず、フォームを私たちのサービスにシームレスに接続できます。ウェブサイトの構築に集中し、バックエンドの処理は私たちにお任せください。迅速で安全、そして信頼性の高いソリューションです。

どんなフレームワークにも対応

シンプルなHTML/CSSから高度なReactの設定まで、お好みの技術を使用できます。私たちのサービスはあなたの技術スタックに適応し、スムーズでストレスのない統合を実現します。

迅速かつ簡単なセットアップ

20分以内にセットアップ完了！直感的な指示と簡潔なセットアッププロセスで、サイトにコンタクトフォームを追加するのが今までになく簡単です。

インテグレーションの実演

      
        
<!-- index.html -->
<div class="contact-form">
    <form id="contact-form" onsubmit="">
      <input id="name" name="name" type="text" placeholder="Enter Your Name" required>
      <input id="email" name="email" type="email" placeholder="Enter Your Email" required>
      <textarea id="message" name="message" cols="40" rows="5" placeholder="Enter Your Message" required></textarea>
      <input  type="submit" value="Submit" class="send">
    </form>
</div>
      
    
      
        
// main.js
const form = document.getElementById('contact-form');

form.addEventListener('submit', async (event) => {
  event.preventDefault();

  const name = document.getElementById('name').value;
  const email = document.getElementById('email').value;
  const message = document.getElementById('message').value;

  const url = 'https://imessageplex.com/ja/user/message/{YOUR_USERNAME}';

  const response = await fetch(url, {
    method: 'POST',
    body: JSON.stringify({
      name,
      email,
      message,
      apiKey: {YOUR_API_KEY (Make sure to hide this with ENV)},
    }),
  });

  if (response.ok) {
    alert('Message was sent successfully!');
  }
});