01
Experience
3+ years shipping software
JF
Portfolio / 2026
John Florence R. Batol
Available for full-time roles, freelance work, and product collaborations
Modern product engineering
Software Engineer / AI Products / Mobile + Web
John Florence R. Batol
Full-Stack Software EngineerMetro Manila, Philippinesflorencebatol85@gmail.com
I build web and mobile products with a strong bias toward clean interfaces, fast delivery, and practical business outcomes.
My recent work spans AI-assisted products, internal business systems, cross-platform mobile apps, and modern TypeScript stacks powered by React, Next.js, NestJS, and Convex-friendly backends.
HTMLCSSReactJS/TypeScriptReact Native ExpoNextJSVueJSPiniaZustandTailwindCSSNestJS
02
Core Strength
Web + Mobile product builds
03
Current Focus
AI workflows, internal tools, and polished UX
Current Chapter
Shipping software that feels sharp, useful, and production-ready.
John works best where product thinking, engineering rigor, and execution speed overlap. The focus is not just shipping features, but delivering software people actually enjoy using.
Latest role
Lead Software Engineer
Cauld & Clark IT Solutions
January 2025 - Present
01
AI copilots, chat systems, and product features backed by real workflows
02
Next.js and React frontends that feel fast, clear, and intentionally designed
03
React Native and Expo applications for field teams and business operations
Quick Contact
Reach out directly or use the AI guide
Email
florencebatol85@gmail.com
LinkedIn
Professional profile and network
GitHub
Code, experiments, and public repos
Portfolio Archive
Earlier portfolio snapshot
Facebook
My personal social media account
Visitors can use the built-in AI assistant to ask about John's background, stack, projects, and availability before reaching out.
Editorial Overview
About
A closer look at the kind of engineering work John does and the lens he brings to product delivery.
Building software across frontend, backend, mobile, and product design without losing clarity in the user experience.
I’m a software engineer who works across frontend, backend, mobile, and product design. I’m comfortable moving from UI decisions and Figma thinking into production React and React Native code, then down into APIs, databases, and deployment work.
Most of my experience comes from building practical software for real teams: business systems, dashboards, clinic tools, dispatch workflows, POS features, and AI-powered products that need to work reliably in production.
I’m especially interested in products that combine strong UX, operational clarity, and AI capabilities without overcomplicating the stack.
Operating Range
Where John adds value
The strongest fit is work that mixes strong UX, practical operations, and modern engineering systems.
01
AI copilots, chat systems, and product features backed by real workflows
02
Next.js and React frontends that feel fast, clear, and intentionally designed
03
React Native and Expo applications for field teams and business operations
04
CMS-backed content systems and internal admin tools with clean data models
Quick Snapshot
Latest role
Lead Software Engineer
Cauld & Clark IT Solutions
What he builds
AI copilots, chat systems, and product features backed by real workflows
Core stack
HTMLCSSReactJS/TypeScriptReact Native ExpoNextJS
Capabilities
Tech Stack
Grouped by the kinds of systems John actually ships, not by buzzwords.
01
Frontend
HTMLCSSReactJS/TypeScriptReact Native ExpoNextJSVueJSPiniaZustandTailwindCSS
02
Backend
NestJSNode.jsExpressLaravelPHPMongoDBMySQLPostgreSQLGraphQLSocket.IOConvexSupabaseFirebase
03
AI + Tools
NestJSNodeJSExpressJSLaravelPHPMongoDBMySQLPostgresRESTfulGraphQL APIsSocket IOConvexSupabaseFirebase
Selected Work
Projects
A mix of AI products, mobile systems, and operational software built for real users and teams.
Featured Project
ElectriVision
Android-based electrical issue reporting system for Pamantasan ng Lungsod ng Valenzuela.
ReactReact NativeExpoNode.jsExpressMySQL
01
Built an admin dashboard and two Android apps for reporters and maintenance staff.
02
Integrated geofencing and SMS notifications for issue routing and response visibility.
03
Designed the product around public-sector reporting and field maintenance needs.
Project Modes
01
AI copilots, chat systems, and product features backed by real workflows
02
Next.js and React frontends that feel fast, clear, and intentionally designed
03
React Native and Expo applications for field teams and business operations
02
ClinicApp
Appointments and patient management system for an LSTV clinic deployment.
TypeScriptReact NativeExpoZustandExpressMySQL
Built an Android app for clinic patients and appointment management.
Worked through a real deployment workflow alongside DevOps and operational requirements.
Web-based mental health companion that integrates multiple AI models in one experience.
Next.jsNestJSMongoDBApollo GraphQLChakra UI
Integrated GPT, DeepSeek, and Gemini text models into a single AI product workflow.
Added GitHub OAuth authentication and model orchestration inside the app.
MockAI runs role-aware voice interviews using your resume and the job description, so each session targets the exact position you care about.
Next.jsConvexTypescriptVapi
Visual Direction
Gallery
A visual strip of the themes and kinds of products John tends to build.
01
AI Product Work
Chatbots, AI workflows, and multi-model experiences
02
Mobile Systems
React Native and Expo builds for real operations
03
Internal Tools
Dispatch, admin, clinic, and reporting workflows
04
Design to Code
Figma thinking carried into polished frontend delivery
05
Full-Stack Delivery
From schemas and APIs through UX and deployment support
Career Path
Experience
Recent roles and the kinds of systems John has been trusted to build.
Lead Software Engineer
Cauld & Clark IT Solutions
January 2025 - Present
Remote
TypeScriptNext.jsNestJSMongoDBGraphQL
Led development across web and mobile applications using TypeScript, React, React Native, Expo, Next.js, NestJS, GraphQL, and MongoDB.
Implemented client-requested features, fixed production issues, and improved performance in a large production codebase.
Worked on a chatbot system, a web-based POS, and multiple cross-platform applications focused on reliability and UX quality.
AI Software Engineer
Accelerated Fleet Services
September 2025 - February 2026
Remote
Next.jsReact NativeExpoProduct Design
Led frontend development and design for the company marketing site and landing pages used for brand positioning and client acquisition.
Built core modules in the ServiceBay web app including fleet dispatch, service orders, parts inventory, and accounting flows.
Contributed to the technician mobile app with React Native and Expo, improving real-time updates, task management, and field operations.
Software Developer
Lee Systems Technology Ventures Inc.
June 2024 - December 2024
Philippines
HRISPOSBSSMaintenance
Contributed to internal and customer-facing systems including HRIS, POS, BSS Mobile, and Timeclock.
Handled production maintenance, bug fixes, and feature enhancements based on live client feedback.
Worked with SQLyog, Sequelize, Zustand, and MUI in a real production environment.
Software Developer & Designer
Freelance
February 2023 - April 2024
Philippines
React NativeDjangoFigmaUI/UX
Built and deployed a payroll system using React Native and Django around real client requirements.
Designed an educational math game prototype in Figma with gameplay mechanics and user flows.
Delivered projects end to end from requirements gathering to launch support.
Foundations
Education & Recognition
Academic background and distinctions that shaped the start of John's career.
Education
Bachelor of Science in Information Technology
Pamantasan ng Lungsod ng Valenzuela (PLV)
Valenzuela, Philippines
Best in IT Student Internship
2x Web Designing 2nd Placer
Dean's Lister with 1.3 and 1.49 GWA
01
Best in IT Student Internship
Academic distinction from PLV
02
2x Web Designing 2nd Placer
Competitive design recognition
03
Dean's Lister
Maintained a 1.3 and 1.49 GWA
Approach
Working Style
How John tends to think about product, code quality, and collaboration.
01
Design-aware engineering
I care about layout, interaction flow, and readability, not just making features work technically.
02
Production-minded delivery
I’m comfortable fixing bugs in large codebases, handling client-requested changes, and iterating against real user constraints.
03
AI with practical value
I use AI when it meaningfully improves workflows, support, speed, or product quality instead of adding noise.