Build a Splash Page with Next.js, Airtable and SyncInc

• next-airtable-splash

  2 1 0.0 JavaScript

Starter Branch - You can use this branch to clone the starter for this project and follow along.

• PostgreSQL

  57 11,907 8.0 JavaScript

  PostgreSQL client for node.js.

📒 More about pg

• SurveyJS

  surveyjs.io sponsored

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

• node

  927 103,799 9.9 JavaScript

  Node.js JavaScript runtime ✨🐢🚀✨

  

Node.js 10.13 or later

• Next.js

  2,042 120,572 10.0 JavaScript

  The React Framework

  

// pages/index.js import Head from "next/head"; import { removeNullValues } from "../utils/data-helpers"; import styles from "../styles/Home.module.css"; export default function Home({rows}) { return (

Create Next Apptitle> <link rel='icon' href='/favicon.ico' /> Head> <main className={styles.main}> <h1 className={styles.title}> Welcome to <a href='https://nextjs.org'>Next.js!a> h1> <div style={{ maxWidth: "80%", margin: "0 auto" }}> {JSON.stringify(rows, null, 2)} div> main> div> ); } export async function getStaticProps() { // asynchronously import getSections to avoid any client side evaluation. const { getSections } = await import("../lib/pg"); const response = await getSections(); // removes any fields with empty or undefined values to avoid any serialization errors const rows = removeNullValues(response?.rows); return { props: { rows, // return data as props. }, }; }

Suggest a related project