This repository was archived by the owner on Mar 18, 2026. It is now read-only.
BranchesTags

Repository files navigation

Register

This is the registration form that was used for Assemble!

Setup

  1. Clone the repository and enter it
git clone https://github.com/hackclub/www-assemble-register.git
cd www-assemble-register
  1. Install packages
yarn

or

npm install

  1. Change questions to your liking Locate lib/manifest.json and edit/add/remove questions to your liking. For more information about manifest.json, click here

  2. Add environment variables and customize Add a .env file with your AirTable API key set to the variable AIRTABLE. How do I get my API key? Locate lib/airtable.js and change the registrationsAirtable baseID to your Airtable base ID, which is found in your Airtable URL and usually starts with app.

  3. Enable submissions Locate pages/index.js and set disabled={false} for the last <Button> element on the page.

  4. Add necessary fields to Airtable Create a new table called Registrations.
    Add fields/columns with names that match up with the key value for each question in manifest.json. Make sure the column type matches up with question type in manifest.json

  5. Run

yarn dev

or

npm run dev

Manifest

Manifest is composed of an array called questions with each element inside the array representing a section of the form.
headerstring is the header that is displayed at the top of the section.
itemsArray<Question> is an array that contains the questions.

Questions

keystring REQUIRED must match the name of an Airtable column in Registrations
imagelabelstring is what is shown to the user
sublabelstring is a secondary label/description of the field
typestring REQUIRED determines what type of input field the user will see.
string input
paragraph textarea
checkbox checkbox
select select
inputTypestring specifies validation with type=VALUE
email email validation
placeholderstring is a placeholder
optionsArray<string> is used when select is specified as a input type
optionalboolean determines if the input field is optional
checkfunction(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.

About

📝 Registration form used for Assemble. Built using Next.js, Theme UI & Airtable.

register.assemble.hackclub.com

Topics

assembleassemble-hackclub

Resources

Readme

Code of conduct

Code of conduct

Contributing

Contributing

Security policy

Security policy
Activity
Custom properties

Stars

5 stars

Watchers

5 watching

Forks

3 forks
Report repository

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { // Add copy buttons to all 
 blocks
(function() {
function addCopyButtons() {
document.querySelectorAll('pre code').forEach(function(codeBlock) {
if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;
codeBlock.parentElement.setAttribute('data-copy-added', 'true');
var btn = document.createElement('button');
btn.textContent = 'Copy';
btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';
btn.onmouseover = function() { this.style.opacity = '1'; };
btn.onmouseout = function() { this.style.opacity = '0.7'; };
btn.onclick = function() {
navigator.clipboard.writeText(codeBlock.textContent).then(function() {
btn.textContent = 'Copied!';
setTimeout(function() { btn.textContent = 'Copy'; }, 1500);
});
};
codeBlock.parentElement.style.position = 'relative';
codeBlock.parentElement.appendChild(btn);
});
}
addCopyButtons();
// Re-run on dynamic content
var observer = new MutationObserver(addCopyButtons);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '

Skip to content

This repository was archived by the owner on Mar 18, 2026. It is now read-only.

BranchesTags
Repository files navigation
Register
This is the registration form that was used for Assemble!
Setup
  1. Clone the repository and enter it
git clone https://github.com/hackclub/www-assemble-register.git
cd www-assemble-register

  1. Install packages
yarn

or
npm install

  1. Change questions to your liking
Locate lib/manifest.json and edit/add/remove questions to your liking. For more information about manifest.json, click here
  2. Add environment variables and customize
Add a .env file with your AirTable API key set to the variable AIRTABLE. How do I get my API key?
Locate lib/airtable.js and change the registrationsAirtable baseID to your Airtable base ID, which is found in your Airtable URL and usually starts with app.
  3. Enable submissions
Locate pages/index.js and set disabled={false} for the last <Button> element on the page.
  4. Add necessary fields to Airtable
Create a new table called Registrations.
    
Add fields/columns with names that match up with the key value for each question in manifest.json. Make sure the column type matches up with question type in manifest.json
  5. Run
yarn dev

or
npm run dev

Manifest
Manifest is composed of an array called questions with each element inside the array representing a section of the form.
headerstring is the header that is displayed at the top of the section.
itemsArray<Question> is an array that contains the questions.
Questions
keystring REQUIRED must match the name of an Airtable column in Registrations
imagelabelstring is what is shown to the user
sublabelstring is a secondary label/description of the field
typestring REQUIRED determines what type of input field the user will see.
string input
paragraph textarea
checkbox checkbox
select select
inputTypestring specifies validation with type=VALUE
email email validation
placeholderstring is a placeholder
optionsArray<string> is used when select is specified as a input type
optionalboolean determines if the input field is optional
checkfunction(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.
About
📝 Registration form used for Assemble. Built using Next.js, Theme UI & Airtable.
register.assemble.hackclub.com
Topics
assembleassemble-hackclub
Resources
Readme
Code of conduct
Code of conduct
Contributing
Contributing
Security policy
Security policy
Activity
Custom properties
Stars
5 stars
Watchers
5 watching
Forks
3 forks
Report repository
Releases
Packages
Contributors
Languages

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Force GitHub README to respect dark mode
(function() {
var style = document.createElement('style');
style.textContent = '
.markdown-body {
color-scheme: dark light;
}
.markdown-body pre { background: #161b22 !important; }
.markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }
.markdown-body table th, .markdown-body table td { border-color: #30363d !important; }
.markdown-body img { background: #0d1117; }
.markdown-body blockquote { border-left-color: #8b949e; }
.markdown-body hr { border-color: #30363d; }
';
document.head.appendChild(style);
})();
}
} catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content

This repository was archived by the owner on Mar 18, 2026. It is now read-only.

BranchesTags
Repository files navigation
Register
This is the registration form that was used for Assemble!
Setup
  1. Clone the repository and enter it
git clone https://github.com/hackclub/www-assemble-register.git
cd www-assemble-register

  1. Install packages
yarn

or
npm install

  1. Change questions to your liking
Locate lib/manifest.json and edit/add/remove questions to your liking. For more information about manifest.json, click here
  2. Add environment variables and customize
Add a .env file with your AirTable API key set to the variable AIRTABLE. How do I get my API key?
Locate lib/airtable.js and change the registrationsAirtable baseID to your Airtable base ID, which is found in your Airtable URL and usually starts with app.
  3. Enable submissions
Locate pages/index.js and set disabled={false} for the last <Button> element on the page.
  4. Add necessary fields to Airtable
Create a new table called Registrations.
    
Add fields/columns with names that match up with the key value for each question in manifest.json. Make sure the column type matches up with question type in manifest.json
  5. Run
yarn dev

or
npm run dev

Manifest
Manifest is composed of an array called questions with each element inside the array representing a section of the form.
headerstring is the header that is displayed at the top of the section.
itemsArray<Question> is an array that contains the questions.
Questions
keystring REQUIRED must match the name of an Airtable column in Registrations
imagelabelstring is what is shown to the user
sublabelstring is a secondary label/description of the field
typestring REQUIRED determines what type of input field the user will see.
string input
paragraph textarea
checkbox checkbox
select select
inputTypestring specifies validation with type=VALUE
email email validation
placeholderstring is a placeholder
optionsArray<string> is used when select is specified as a input type
optionalboolean determines if the input field is optional
checkfunction(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.
About
📝 Registration form used for Assemble. Built using Next.js, Theme UI & Airtable.
register.assemble.hackclub.com
Topics
assembleassemble-hackclub
Resources
Readme
Code of conduct
Code of conduct
Contributing
Contributing
Security policy
Security policy
Activity
Custom properties
Stars
5 stars
Watchers
5 watching
Forks
3 forks
Report repository
Releases
Packages
Contributors
Languages

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Highlight search terms from Google/DuckDuckGo/Bing referrer
(function() {
var ref = document.referrer;
var terms = [];
if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {
var url = new URL(ref);
var q = url.searchParams.get('q') || url.searchParams.get('p');
if (q) {
terms = q.split(/\s+/).filter(function(t) { return t.length > 2; });
}
}
if (terms.length === 0) return;
var style = document.createElement('style');
style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';
document.head.appendChild(style);
function highlight(node) {
if (node.nodeType === 3) { // text node
var text = node.textContent;
var found = false;
terms.forEach(function(term) {
var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\]\\]/g, '\\') + ')', 'gi');
if (regex.test(text)) {
found = true;
var frag = document.createDocumentFragment();
var parts = text.split(regex);
parts.forEach(function(part, i) {
if (i % 2 === 0) {
frag.appendChild(document.createTextNode(part));
} else {
var span = document.createElement('span');
span.className = 'userscript-highlight';
span.textContent = part;
frag.appendChild(span);
}
});
node.parentNode.replaceChild(frag, node);
}
});
} else if (node.nodeType === 1 && node.childNodes) { // element
var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];
if (!skipTags.includes(node.tagName)) {
Array.from(node.childNodes).forEach(highlight);
}
}
}
highlight(document.body);
// Re-highlight on dynamic content
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(m) {
m.addedNodes.forEach(function(node) {
if (node.nodeType === 1 || node.nodeType === 3) highlight(node);
});
});
});
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content

This repository was archived by the owner on Mar 18, 2026. It is now read-only.

BranchesTags
Repository files navigation
Register
This is the registration form that was used for Assemble!
Setup
  1. Clone the repository and enter it
git clone https://github.com/hackclub/www-assemble-register.git
cd www-assemble-register

  1. Install packages
yarn

or
npm install

  1. Change questions to your liking
Locate lib/manifest.json and edit/add/remove questions to your liking. For more information about manifest.json, click here
  2. Add environment variables and customize
Add a .env file with your AirTable API key set to the variable AIRTABLE. How do I get my API key?
Locate lib/airtable.js and change the registrationsAirtable baseID to your Airtable base ID, which is found in your Airtable URL and usually starts with app.
  3. Enable submissions
Locate pages/index.js and set disabled={false} for the last <Button> element on the page.
  4. Add necessary fields to Airtable
Create a new table called Registrations.
    
Add fields/columns with names that match up with the key value for each question in manifest.json. Make sure the column type matches up with question type in manifest.json
  5. Run
yarn dev

or
npm run dev

Manifest
Manifest is composed of an array called questions with each element inside the array representing a section of the form.
headerstring is the header that is displayed at the top of the section.
itemsArray<Question> is an array that contains the questions.
Questions
keystring REQUIRED must match the name of an Airtable column in Registrations
imagelabelstring is what is shown to the user
sublabelstring is a secondary label/description of the field
typestring REQUIRED determines what type of input field the user will see.
string input
paragraph textarea
checkbox checkbox
select select
inputTypestring specifies validation with type=VALUE
email email validation
placeholderstring is a placeholder
optionsArray<string> is used when select is specified as a input type
optionalboolean determines if the input field is optional
checkfunction(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.
About
📝 Registration form used for Assemble. Built using Next.js, Theme UI & Airtable.
register.assemble.hackclub.com
Topics
assembleassemble-hackclub
Resources
Readme
Code of conduct
Code of conduct
Contributing
Contributing
Security policy
Security policy
Activity
Custom properties
Stars
5 stars
Watchers
5 watching
Forks
3 forks
Report repository
Releases
Packages
Contributors
Languages

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Strip utm_, fbclid, gclid, etc. from all links on page
(function() {
var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',
'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',
'ref', 'ref_src', 'source', 'medium', 'campaign'];
function cleanUrl(url) {
try {
var u = new URL(url, window.location.origin);
var changed = false;
trackingParams.forEach(function(p) {
if (u.searchParams.has(p)) {
u.searchParams.delete(p);
changed = true;
}
});
return changed ? u.toString() : url;
} catch (e) {
return url;
}
}
function cleanLinks() {
document.querySelectorAll('a[href]').forEach(function(a) {
var clean = cleanUrl(a.href);
if (clean !== a.href) a.href = clean;
});
}
cleanLinks();
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(m) {
m.addedNodes.forEach(function(node) {
if (node.nodeType === 1) {
if (node.tagName === 'A') cleanLinks();
node.querySelectorAll('a[href]').forEach(function(a) {
var clean = cleanUrl(a.href);
if (clean !== a.href) a.href = clean;
});
}
});
});
});
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); }
})();
(function(){
try {
var __m = "youtube.com";
var __re = new RegExp('^' + "youtube\\.com" + '

Skip to content

This repository was archived by the owner on Mar 18, 2026. It is now read-only.

BranchesTags
Repository files navigation
Register
This is the registration form that was used for Assemble!
Setup
  1. Clone the repository and enter it
git clone https://github.com/hackclub/www-assemble-register.git
cd www-assemble-register

  1. Install packages
yarn

or
npm install

  1. Change questions to your liking
Locate lib/manifest.json and edit/add/remove questions to your liking. For more information about manifest.json, click here
  2. Add environment variables and customize
Add a .env file with your AirTable API key set to the variable AIRTABLE. How do I get my API key?
Locate lib/airtable.js and change the registrationsAirtable baseID to your Airtable base ID, which is found in your Airtable URL and usually starts with app.
  3. Enable submissions
Locate pages/index.js and set disabled={false} for the last <Button> element on the page.
  4. Add necessary fields to Airtable
Create a new table called Registrations.
    
Add fields/columns with names that match up with the key value for each question in manifest.json. Make sure the column type matches up with question type in manifest.json
  5. Run
yarn dev

or
npm run dev

Manifest
Manifest is composed of an array called questions with each element inside the array representing a section of the form.
headerstring is the header that is displayed at the top of the section.
itemsArray<Question> is an array that contains the questions.
Questions
keystring REQUIRED must match the name of an Airtable column in Registrations
imagelabelstring is what is shown to the user
sublabelstring is a secondary label/description of the field
typestring REQUIRED determines what type of input field the user will see.
string input
paragraph textarea
checkbox checkbox
select select
inputTypestring specifies validation with type=VALUE
email email validation
placeholderstring is a placeholder
optionsArray<string> is used when select is specified as a input type
optionalboolean determines if the input field is optional
checkfunction(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.
About
📝 Registration form used for Assemble. Built using Next.js, Theme UI & Airtable.
register.assemble.hackclub.com
Topics
assembleassemble-hackclub
Resources
Readme
Code of conduct
Code of conduct
Contributing
Contributing
Security policy
Security policy
Activity
Custom properties
Stars
5 stars
Watchers
5 watching
Forks
3 forks
Report repository
Releases
Packages
Contributors
Languages

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Auto-enable theater mode on YouTube
(function() {
function tryTheater() {
var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]');
if (btn && !btn.classList.contains('activated')) {
btn.click();
}
}
// Try immediately
tryTheater();
// Try after navigation (SPA)
var lastUrl = location.href;
setInterval(function() {
if (location.href !== lastUrl) {
lastUrl = location.href;
setTimeout(tryTheater, 500);
}
}, 1000);
// Also try on player load
var observer = new MutationObserver(tryTheater);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content

This repository was archived by the owner on Mar 18, 2026. It is now read-only.

BranchesTags
Repository files navigation
Register
This is the registration form that was used for Assemble!
Setup
  1. Clone the repository and enter it
git clone https://github.com/hackclub/www-assemble-register.git
cd www-assemble-register

  1. Install packages
yarn

or
npm install

  1. Change questions to your liking
Locate lib/manifest.json and edit/add/remove questions to your liking. For more information about manifest.json, click here
  2. Add environment variables and customize
Add a .env file with your AirTable API key set to the variable AIRTABLE. How do I get my API key?
Locate lib/airtable.js and change the registrationsAirtable baseID to your Airtable base ID, which is found in your Airtable URL and usually starts with app.
  3. Enable submissions
Locate pages/index.js and set disabled={false} for the last <Button> element on the page.
  4. Add necessary fields to Airtable
Create a new table called Registrations.
    
Add fields/columns with names that match up with the key value for each question in manifest.json. Make sure the column type matches up with question type in manifest.json
  5. Run
yarn dev

or
npm run dev

Manifest
Manifest is composed of an array called questions with each element inside the array representing a section of the form.
headerstring is the header that is displayed at the top of the section.
itemsArray<Question> is an array that contains the questions.
Questions
keystring REQUIRED must match the name of an Airtable column in Registrations
imagelabelstring is what is shown to the user
sublabelstring is a secondary label/description of the field
typestring REQUIRED determines what type of input field the user will see.
string input
paragraph textarea
checkbox checkbox
select select
inputTypestring specifies validation with type=VALUE
email email validation
placeholderstring is a placeholder
optionsArray<string> is used when select is specified as a input type
optionalboolean determines if the input field is optional
checkfunction(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.
About
📝 Registration form used for Assemble. Built using Next.js, Theme UI & Airtable.
register.assemble.hackclub.com
Topics
assembleassemble-hackclub
Resources
Readme
Code of conduct
Code of conduct
Contributing
Contributing
Security policy
Security policy
Activity
Custom properties
Stars
5 stars
Watchers
5 watching
Forks
3 forks
Report repository
Releases
Packages
Contributors
Languages

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Remove or un-stick sticky/fixed headers that block content
(function() {
function unstick() {
document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) {
if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {
el.style.position = 'static';
el.style.top = 'auto';
el.style.zIndex = 'auto';
}
});
}
unstick();
var observer = new MutationObserver(unstick);
observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });
})();
}
} catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content

This repository was archived by the owner on Mar 18, 2026. It is now read-only.

BranchesTags
Repository files navigation
Register
This is the registration form that was used for Assemble!
Setup
  1. Clone the repository and enter it
git clone https://github.com/hackclub/www-assemble-register.git
cd www-assemble-register

  1. Install packages
yarn

or
npm install

  1. Change questions to your liking
Locate lib/manifest.json and edit/add/remove questions to your liking. For more information about manifest.json, click here
  2. Add environment variables and customize
Add a .env file with your AirTable API key set to the variable AIRTABLE. How do I get my API key?
Locate lib/airtable.js and change the registrationsAirtable baseID to your Airtable base ID, which is found in your Airtable URL and usually starts with app.
  3. Enable submissions
Locate pages/index.js and set disabled={false} for the last <Button> element on the page.
  4. Add necessary fields to Airtable
Create a new table called Registrations.
    
Add fields/columns with names that match up with the key value for each question in manifest.json. Make sure the column type matches up with question type in manifest.json
  5. Run
yarn dev

or
npm run dev

Manifest
Manifest is composed of an array called questions with each element inside the array representing a section of the form.
headerstring is the header that is displayed at the top of the section.
itemsArray<Question> is an array that contains the questions.
Questions
keystring REQUIRED must match the name of an Airtable column in Registrations
imagelabelstring is what is shown to the user
sublabelstring is a secondary label/description of the field
typestring REQUIRED determines what type of input field the user will see.
string input
paragraph textarea
checkbox checkbox
select select
inputTypestring specifies validation with type=VALUE
email email validation
placeholderstring is a placeholder
optionsArray<string> is used when select is specified as a input type
optionalboolean determines if the input field is optional
checkfunction(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.
About
📝 Registration form used for Assemble. Built using Next.js, Theme UI & Airtable.
register.assemble.hackclub.com
Topics
assembleassemble-hackclub
Resources
Readme
Code of conduct
Code of conduct
Contributing
Contributing
Security policy
Security policy
Activity
Custom properties
Stars
5 stars
Watchers
5 watching
Forks
3 forks
Report repository
Releases
Packages
Contributors
Languages

, 'i');
if (__m === '*' || __re.test(location.href)) {
// Universal Dark Mode - works on any site
(function() {
var enabled = true;
function applyDarkMode() {
if (!enabled) return;
// Create style element if it doesn't exist
var style = document.getElementById('universal-dark-mode-style');
if (!style) {
style = document.createElement('style');
style.id = 'universal-dark-mode-style';
document.head.appendChild(style);
}
// Dark mode CSS - inverts colors but preserves images/video
style.textContent = '
/* Invert everything except media */
html {
filter: invert(1) hue-rotate(180deg) !important;
background: #1a1a2e !important;
}
/* Restore images, videos, iframes, canvas */
img, video, iframe, canvas, svg, picture, [style*="background-image"] {
filter: invert(1) hue-rotate(180deg) !important;
}
/* Preserve specific elements that should not be inverted */
.no-dark-mode, .no-dark-mode *,
[data-theme="light"], [data-theme="light"],
.ace_editor, .ace_editor *,
.CodeMirror, .CodeMirror *,
.monaco-editor, .monaco-editor *,
.markdown-body pre, .markdown-body pre *,
.highlight, .highlight *,
pre code, pre code * {
filter: none !important;
}
/* Fix common UI elements */
.modal, .popup, .dropdown-menu, .tooltip, .popover {
filter: invert(1) hue-rotate(180deg) !important;
background: #2d2d44 !important;
border-color: #444 !important;
}
/* Scrollbars */
::-webkit-scrollbar { background: #1a1a2e !important; }
::-webkit-scrollbar-thumb { background: #444 !important; }
::-webkit-scrollbar-thumb:hover { background: #555 !important; }
/* Selection */
::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }
::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }
';
}
function removeDarkMode() {
var style = document.getElementById('universal-dark-mode-style');
if (style) style.remove();
}
// Toggle with Alt+Shift+D
document.addEventListener('keydown', function(e) {
if (e.altKey && e.shiftKey && e.key === 'D') {
e.preventDefault();
enabled = !enabled;
if (enabled) {
applyDarkMode();
console.log('[Universal Dark Mode] Enabled');
} else {
removeDarkMode();
console.log('[Universal Dark Mode] Disabled');
}
}
});
// Apply on load
applyDarkMode();
// Re-apply on dynamic content
var observer = new MutationObserver(function(mutations) {
if (enabled && !document.getElementById('universal-dark-mode-style')) {
applyDarkMode();
}
});
observer.observe(document.head, { childList: true });
console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');
})();
}
} catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); }
})();
})();

Skip to content

This repository was archived by the owner on Mar 18, 2026. It is now read-only.

BranchesTags
Repository files navigation
Register
This is the registration form that was used for Assemble!
Setup
  1. Clone the repository and enter it
git clone https://github.com/hackclub/www-assemble-register.git
cd www-assemble-register

  1. Install packages
yarn

or
npm install

  1. Change questions to your liking
Locate lib/manifest.json and edit/add/remove questions to your liking. For more information about manifest.json, click here
  2. Add environment variables and customize
Add a .env file with your AirTable API key set to the variable AIRTABLE. How do I get my API key?
Locate lib/airtable.js and change the registrationsAirtable baseID to your Airtable base ID, which is found in your Airtable URL and usually starts with app.
  3. Enable submissions
Locate pages/index.js and set disabled={false} for the last <Button> element on the page.
  4. Add necessary fields to Airtable
Create a new table called Registrations.
    
Add fields/columns with names that match up with the key value for each question in manifest.json. Make sure the column type matches up with question type in manifest.json
  5. Run
yarn dev

or
npm run dev

Manifest
Manifest is composed of an array called questions with each element inside the array representing a section of the form.
headerstring is the header that is displayed at the top of the section.
itemsArray<Question> is an array that contains the questions.
Questions
keystring REQUIRED must match the name of an Airtable column in Registrations
imagelabelstring is what is shown to the user
sublabelstring is a secondary label/description of the field
typestring REQUIRED determines what type of input field the user will see.
string input
paragraph textarea
checkbox checkbox
select select
inputTypestring specifies validation with type=VALUE
email email validation
placeholderstring is a placeholder
optionsArray<string> is used when select is specified as a input type
optionalboolean determines if the input field is optional
checkfunction(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.
About
📝 Registration form used for Assemble. Built using Next.js, Theme UI & Airtable.
register.assemble.hackclub.com
Topics
assembleassemble-hackclub
Resources
Readme
Code of conduct
Code of conduct
Contributing
Contributing
Security policy
Security policy
Activity
Custom properties
Stars
5 stars
Watchers
5 watching
Forks
3 forks
Report repository
Releases
Packages
Contributors
Languages