How to get User leads in Google Sheet using NoCodeAPI and Divjoy

Disclaimer: This blog requires premium access to divjoy.com. You can buy your slot at a discounted price on https://divjoy.com/?promo=nocodeapi.

Let’s start building our app.

Requirements

• NoCodeAPI Google Sheet or Airtable Endpoint
• Divjoy Access

Step 1 : Link your data

• Go to marketplace of nocodeapi.
• Choose either airtable or google sheet to link your app data.

• Setup Airtable : Go to Google Sheet API to link your sheet data with nocodeapi's endpoint

OR

• Setup Google Sheet : Go to Airtable API to link your airtable data with nocodeapi's endpoint

Step 2 : Select Divjoy layout

• Go to the https://divjoy.com
• Scroll down to Choose your stack
• Go to More Options and under Contact Form chose Google Sheets

• Go to Layouts and chose the first layout



Step 3 : Export your Code to CodeSandBox

• After you chose your layout you will reach the Build your components page.
• On the right top, click on Export Code button

• You will need to buy divjoy's life time access bucket to extract your code. Use nocodeapi as promotion code to find discounted price. Or click here.
• Make the payment to proceed further in tutorial.

• Click on Export to </> CodeSandbox button
• Divjoy will create your code and you can export it to CodeSandbox now.
• Click on Open my CodeSandbox button to open your code in CodeSandbox.

Step 4 : Edit .env in CodeSandbox

• You will see CodeSandBox playground loaded with divjoy project.

• In the right side of your codesandbox you can see the browser in action. Go to the bottom of this browser and select Contact.

• You can see the contact form. We are going to make two changes to .env file to make contact form functional.
• On the left panel, find .env file and edit it.
• add REACT_APP_SHEETS_ENDPOINT with your NoCodeAPI Google Sheet endpoint,



• REACT_APP_SHEETS_TAB_ID with the Sheet Tab name,



• & click Save.

Step 5 : Test your Contact Form

• Fill in the details of your contact form and click submit
• You should find a success message on top of your form. And the credentials should be uploading in your connected google sheet.

• If it all worked — you have your Google Sheet integration functioning!

How ?

Divjoy has created a simple POST endpoint inside Utils folder > Contact.js file. Once you click the form submit button, a POST request is sent to NoCodeAPI’s URL containing array of submitted data. As soon as NoCodeAPI stores your message in Google Sheet it responds with Ok message. Divjoy reads the response and give you a Message submitted successfully message.



Video Tutorial

Watch this tutorial in action here. 👇

Some important links:

• Divjoy discount Offer: https://divjoy.com/?promo=nocodeapi
• Divjoy Google Sheets Guide
• Divjoy Airtable Guide

Find us on telegram

If you are facing any issues, contact us here on telegram. We will get you boarded.

Thank you for reading. Happy Coding!✌️