Website & Portal v1.3.2
The base template every project here starts from. I led the current version (v1.3.2).
- Liquid
- JavaScript
- HTML5
- CSS3
- GraphQL
- Stripe
Senior Front End Developer
Marikaimu Chris Ardoña
I lead the front end of client-facing web applications, from payments and identity verification to events and subscriptions, turning complex requirements into reliable, well-built interfaces.
- ~10 yrsFront-end experience
- 7Live products shipped
- Bulacan, PHBased in
About me
Senior Front End Developer with around ten years of experience building and leading the front end of client-facing web applications.
I have been the lead front-end developer on multiple live products spanning payments, identity verification, events, and subscriptions, working primarily in JavaScript, Vue, Liquid, and GraphQL with Stripe, Make.com, and SendGrid integrations, and currently expanding into React and TypeScript.
I am known as the go-to developer for complex, hard-to-reproduce issues. Beyond shipping features, I mentor colleagues, introduce reusable processes, and build internal AI tooling that the wider team now relies on every day.
Selected Work
The Insites platform template and the live products I built on it during my time at Complete Business Online.
Real Estate Institute of Australia
The company's first Stripe subscription-webhook implementation, with Make.com-driven Xero and SendGrid automation.
- Liquid
- JavaScript
- HTML5
- CSS3
- GraphQL
- Stripe
- Make.com
International Eucharistic Congress
The 54th Congress, Australia 2028. Built the engagement hub, multilingual support, volunteer signup, resources, and signup forms.
- Liquid
- JavaScript
- HTML5
- CSS3
- GraphQL
Grand Yacht Crew
Community platform for professional yacht crew. Built key pages on a heavily customised UI and began integrating AI-assisted development.
- Liquid
- JavaScript
- HTML5
- CSS3
- GraphQL
Nationally Coordinated Criminal History Checks
Criminal background-check platform with Stripe payments and a points-based ID and selfie verification flow.
- Vue
- JavaScript
- Liquid
- HTML5
- CSS3
- GraphQL
- Stripe
Australian British Chamber of Commerce
Events platform with a Make.com automation syncing Xero and SendGrid, plus real-time Slack error alerts.
- Liquid
- JavaScript
- HTML5
- CSS3
- GraphQL
- Stripe
- Make.com
The Outsource Place
Job-matching platform with separate Employer and Jobseeker portals, location-based matching, and Stripe payments.
- Liquid
- JavaScript
- GraphQL
- HTML5
- CSS3
- Stripe
Osstem Implant Australia
Catalogue architecture and a clean UI for a global dental-implant brand, with Stripe-powered course enrolment.
- Liquid
- JavaScript
- HTML5
- CSS3
- GraphQL
- Stripe
Personal Projects
Self-built, end to end. Where I work outside the client stack, from full-stack apps to AI automations.
Kindred Paws — Clinic Management
A full-stack veterinary clinic app I designed and built end to end: appointments, a vet calendar, grooming scheduling, client and pet records with medical history, and staff management. A React front end on a custom Tailwind design system, backed by Supabase with a PostgreSQL schema, authentication, and Row Level Security on every table.
- React
- Vite
- Tailwind CSS
- Supabase
- PostgreSQL
- Auth + RLS
Job-Hunt Copilot
An end-to-end AI automation built in n8n: it analyses a job posting against a candidate profile and returns a structured fit assessment, a score backed by the matched strengths and gaps, delivered to a web view, email, and a Google Sheets tracker.
- n8n
- Google Gemini
- LangChain
- Prompt engineering
- Google Sheets
- SMTP
Building With AI
A suite of internal automation tools I designed and built on Claude, now used across the team every day. They cut our PR and deployment workflow from around 30 minutes to about 5, and cluster around delivery discipline and visibility: shipping releases safely, verifying quality, and keeping everyone informed.
deployment-plan
Generates a structured deployment plan for a release: steps, rollback tag, PR, downtime, and comms.
Team impact
Gives every developer a consistent, repeatable release process, removing guesswork and reducing deployment mistakes across the team.
post-deployment
Runs the full post-release cleanup: pushes master, aligns the UAT branch, tags the release, updates the deployment calendar, posts the release note, and hands off to support.
Team impact
Closes the loop on every deployment automatically, keeping release records and project tracking accurate so anyone backtracking a release has a reliable audit trail.
spec-check-report
Checks a build against its spec and reports the gaps.
Team impact
Helps developers and QA catch missed requirements before handover, improving delivery quality and cutting rework.
generate-documentation
Turns a project's component markdown into a branded, client-ready document.
Team impact
Lets any team member produce consistent, well-formatted documentation fast, with no manual formatting.
task-summary
Reads a task and its full comment thread and produces a structured catch-up summary.
Team impact
Anyone joining a task gets up to speed in seconds instead of reading every comment, which is especially valuable for a distributed team.
eod-report
Pulls daily time logs, classifies deliverables vs meetings, captures the logs, and posts an end-of-day or midday standup.
Team impact
Standardises daily reporting across the team and gives managers visibility on billable vs non-billable time and what shipped each day.
Technical Skills
- Languages & Markup
- JavaScript · HTML5 · CSS3 · Liquid · TypeScript (working knowledge)
- Frameworks & Libraries
- Vue.js · React · Tailwind CSS · Bootstrap
- APIs
- GraphQL · REST integrations · Webhooks
- Backend & Database
- Supabase · PostgreSQL · Auth & Row Level Security
- Integrations & Services
- Stripe · SendGrid · Xero
- Automation & AI
- n8n · Make.com · AI workflow automation · Prompt engineering
- Tooling & Workflow
- Git / GitHub · Vite · Figma · Cursor AI · Claude AI · Slack · Teamwork
- Platforms
- WordPress · LimeSurvey · Insites Instance Admin
Experience
Mar 2023 – Present
Senior Front End Web Developer
Complete Business Online
Lead front-end developer on client-facing web applications built on a proprietary instance-admin platform. Promoted from Web Developer to Senior in November 2025. Built the team's AI automation toolkit and acts as the trusted point of contact for complex issues.
Aug 2018 – Mar 2023
Web Developer
Coredata Research Inc.
In-house developer focused on LimeSurvey customisation in JavaScript, and maintained the company's WordPress websites across the AU, EU, and US regions.
Aug 2016 – Apr 2018
Web Developer
QQFrance Digital Solutions Inc.
Built reusable template websites for resale using HTML, CSS, JavaScript, Bootstrap, and AngularJS, establishing core front-end fundamentals at the start of a web development career.
Get in touch
Open to senior front-end roles.
If you are building something that needs a dependable senior front-end developer, I would be glad to talk.
chris.ardona@gmail.com
Website & Portal v1.3.2
Website and Portal v1.3.2 is the base template that every project in this showcase is built on. It provides the core website and client-portal foundation, a unified starting point that each project then customises for its own brand, content, and features. I led the current version, refining the shared website and portal foundation the team now builds on.
- Liquid
- JavaScript
- HTML5
- CSS3
- GraphQL
- Stripe
Osstem Implant Australia
Osstem Implant is the world's 4th largest dental-implant company, used in more than 80 countries, and a leading implant brand out of Korea. For the Australian site I led the front end, building the catalogue architecture, a multi-level menu and submenu system spanning implant systems, surgical kits, and equipment, with a clean, professional UI. I also implemented Stripe payments for the implant-training course enrolment. The product eShop is handled by a third-party provider.
- Liquid
- JavaScript
- HTML5
- CSS3
- GraphQL
- Stripe
The Outsource Place
The Outsource Place is a platform where job seekers meet employers. Job seekers get easy access to job listings, personalised recommendations, and tools to support their search, while employers find suitable candidates quickly and efficiently. I led the front end, building two distinct account types, Employer and Jobseeker, each with its own portal view and payment type, plus location-based job matching, with Stripe handling payments.
- Liquid
- JavaScript
- GraphQL
- HTML5
- CSS3
- Stripe
Australian British Chamber of Commerce
An events platform for the chamber. I led the front end and built a Make.com automation that syncs Xero and SendGrid and surfaces error alerts to Slack in real time, keeping event operations and finance in step.
- Liquid
- JavaScript
- HTML5
- CSS3
- GraphQL
- Stripe
- Make.com
Nationally Coordinated Criminal History Checks
An Australian criminal background-check platform. I led the front end, including Stripe payments and a points-based ID and selfie verification flow, integrating the AWS Rekognition and NSS submission APIs delivered by the backend team, plus complex name-validation logic across legal name, alias, and maiden name.
- Vue
- JavaScript
- Liquid
- HTML5
- CSS3
- GraphQL
- Stripe
Grand Yacht Crew
A community platform for professional yacht crew. As a contributor I built several pages, including Contact and the newsletter submissions, working with a UI that diverged well beyond our standard template, and began integrating AI-assisted development into the build. No payments or member portal.
- Liquid
- JavaScript
- HTML5
- CSS3
- GraphQL
International Eucharistic Congress
The official site for the 54th International Eucharistic Congress, coming to Australia in 2028. As a contributor I worked on the engagement hub, multilingual support, the volunteer signup, the resources area, and a range of signup forms.
- Liquid
- JavaScript
- HTML5
- CSS3
- GraphQL
Real Estate Institute of Australia
A platform for Australia's peak real estate body. I led the front end and delivered the company's first Stripe subscription-webhook implementation, alongside Make.com-driven Xero and SendGrid updates for a fully automated membership flow. This project features a brand-new portal dashboard for recurring subscriptions, built to make document subscription management easier, faster, and more secure for all users.
- Liquid
- JavaScript
- HTML5
- CSS3
- GraphQL
- Stripe
- Make.com
Kindred Paws — Clinic Management
A web application for running a veterinary clinic, designed and built end to end on my own. It covers appointment booking, a day, week, and month vet calendar, grooming scheduling, full client and pet records with medical history, staff and user management, and an activity log.
I built the whole stack: a React single-page app with lazy-loaded routes and a custom Tailwind design system on the front end, backed by Supabase with a PostgreSQL schema, email authentication, and Row Level Security protecting every table. The project is open source.
- React
- Vite
- Tailwind CSS
- Supabase
- PostgreSQL
- Auth
- Row Level Security
- JavaScript
Sign in to the live demo
admin@kindredpaws.com
Q9chOFzAiC2L5cAa9!
Job-Hunt Copilot
An end-to-end AI automation I built to explore agent-style workflows in n8n. A job posting goes in through a form, and the workflow returns a structured fit assessment, a score backed by the specific strengths and gaps behind it, delivered to a web view, an email, and a Google Sheets tracker.
Under the hood, a form trigger passes the posting and a candidate profile into Google Gemini through a LangChain chain with a structured-output parser, so the model returns clean, typed fields rather than free text. The result fans out to a completion screen, an SMTP email, and a Google Sheets row. The prompt is engineered to score strictly and honestly, real postings come back at 25, 55, and 60 out of 100 rather than inflated, which keeps the assessment trustworthy.
- n8n
- Google Gemini
- LangChain
- Structured output
- Prompt engineering
- Google Sheets
- SMTP