Upcoming database upgrades. to improve our reliability at 03:30 UTC on Feb. 25 / 7:30pm PT on Feb. 24. Some users may briefly experience slow load times or error messages. Learn more here

Using React frontend form to connect to airtable

Topic Labels: ImportingExporting
924 1
Showing results for 
Search instead for 
Did you mean: 

Hello I wonder if you can help

I am using a react.js form to collect customer data and would like to connect this information to Airetable. this is what I have so far:

file 1 - data file
import { useState } from “react”;
import axios from “axios”;

export default function useData() {
const [data, setData] = useState(null);

const getData = async () => {
return axios.get(“/”).then((res) => {
return {

file 2 index.js

import React from ‘react’;

import ReactDOM from ‘react-dom/client’;

import ‘./index.css’;

import App from ‘./App’;

import axios from “axios”;

const BASE_ID = ‘xxx’;

const API_KEY = ‘xxx’

axios.defaults.baseURL =${BASE_ID}/Contact__form/;[‘Content-Type’] = ‘application/json’;

axios.defaults.headers[‘Authorization’] = Bearer ${API_KEY};

const root = ReactDOM.createRoot(document.getElementById(‘root’));





I’m not sure if I am going in the right direction, or what to do next. Thank you.

1 Reply 1

@Jude - a couple of tutorials for this: