This app is a phone book that connects to Airtable for data and deploys on Netlify. No code needed to make this work. Just configure the site and the manage your phone list via Airtable.
Follow the steps below to get set up:
Create a base with the following fields:
- First Name
- Last Name
- Mobile Phone
- Home Phone
- Verified (checkbox)
- Over 18 (Yes/No)
The phonelist will only include entries that are marked as Verified and are Over 18 years of age.
If you want people to be able to submit their own info, you can create a form from your base. But you are encouraged to keep Verified
off the form for admins to control.
Set up the following environment variables in Netlify:
AIRTABLE_API_KEY
-- API key for accessing your Airtable, looks likekeyAb4CdefGhijklm
. You can find that here: https://airtable.com/apiAIRTABLE_API_KEY=keyMMMMMMMMM
AIRTABLE_BASE_ID
-- ID for your base, e.g.,app9abcO3deFghiJK
.AIRTABLE_BASE_ID=appNNNNNNNNN
AIRTABLE_TABLE_NAME
-- Name of your table within your base, e.g.,"Table 1"
AIRTABLE_TABLE_NAME="Table 1"
PINS
-- secret PINs used to access your phonelist. Must be 4 digits long. You can specify as many PINs as you want.PINS=1234,4321
REACT_APP_AIRTABLE_ADD_USER_URL
-- link to the form for adding a contact to your phonelist (optional)REACT_APP_AIRTABLE_ADD_USER_URL=https://airtable.com/add_contact_form_url
REACT_APP_BUILD_HOOK
-- URL to kick off the build process, so admins can re-deploy without writing code. (see Update the site)REACT_APP_BUILD_HOOK=https://api.netlify.com/build_hooks/343j34jk34j3k4j3k4343
Once your environment variables are finished, re-deploy the site and all those marked as Verified and Over 18 will show up on your site.
Whenever you make changes to the Airtable and want them to show up on your site, simply visit /deploy
on your site, e.g., https://phone.netlify.app/deploy
, and press the Deploy button.