This is the registration form that was used for Assemble!
- Clone the repository and enter it
git clone https://github.com/hackclub/www-assemble-register.git
cd www-assemble-register
- Install packages
yarn
or
npm install
-
Change questions to your liking Locate
lib/manifest.json
and edit/add/remove questions to your liking. For more information aboutmanifest.json
, click here -
Add environment variables and customize Add a
.env
file with your AirTable API key set to the variableAIRTABLE
. How do I get my API key? Locatelib/airtable.js
and change theregistrationsAirtable
baseID to your Airtable base ID, which is found in your Airtable URL and usually starts withapp
. -
Enable submissions Locate
pages/index.js
and setdisabled={false}
for the last<Button>
element on the page. -
Add necessary fields to Airtable Create a new table called
Registrations
.
Add fields/columns with names that match up with thekey
value for each question inmanifest.json
. Make sure the column type matches up with question type inmanifest.json
-
Run
yarn dev
or
npm run dev
Manifest is composed of an array called questions with each element inside the array representing a section of the form.
header
string is the header that is displayed at the top of the section.
items
Array<Question> is an array that contains the questions.
key
string REQUIRED must match the name of an Airtable column in Registrations
label
string is what is shown to the user
sublabel
string is a secondary label/description of the field
type
string REQUIRED determines what type of input field the user will see.
string
input
paragraph
textarea
checkbox
checkbox
select
select
inputType
string specifies validation with type=VALUE
email
email validation
placeholder
string is a placeholder
options
Array<string> is used when select
is specified as a input type
optional
boolean determines if the input field is optional
check
function(data)
data
is an object that contains all the other question values. Ex. data["Travel Stipends"] pulls the value of the question with "Travel Stipends" as the key
.