myformconnect-example-angular

Working MyFormConnect integration example for Angular with a real runnable project in app/.

• MyFormConnect: https://myformconnect.io/
• Docs: https://myformconnect.io/docs
• Getting started: https://myformconnect.io/docs/getting-started
• Create free account: https://myformconnect.io/users/sign_up
• Angular docs: https://angular.dev/

What this repo shows

• Contact Us form (basic fields)
• Lead / Inquiry form (sales-style fields)

Both forms submit via standard HTML POST to:

• https://myformconnect.io/f/YOUR_CONTACT_FORM_UUID
• https://myformconnect.io/f/YOUR_LEAD_FORM_UUID

Where to get the Form UUIDs

1. Sign up: https://myformconnect.io/users/sign_up
2. Add your domain in the dashboard (example: https://mywebsite.com)
3. Create two forms (recommended: “Only API” as a good default per docs)
4. Copy each form’s Form UUID
5. Replace the placeholders in app/src/mfc.ts:
   • YOUR_CONTACT_FORM_UUID
   • YOUR_LEAD_FORM_UUID

Official reference: https://myformconnect.io/docs/getting-started

Run locally (Angular app)

From this repo root:

• cd app
• npm install
• npm start

For localhost testing, enable Allow Local Development in your MyFormConnect Form Settings (then disable it before production).

Build for GitHub Pages

From app/:

• npm run build
• npm run publish:ghpages

This publishes app/dist/app/browser to the repository root so the gh-pages branch serves the built site directly.

GitHub Pages

This repo is intended to be hosted directly from the gh-pages default branch.

Typical flow:

• Create a GitHub repo
• Add remote: git remote add origin <your-repo-url>
• Push: git push -u origin gh-pages
• Enable GitHub Pages for branch gh-pages