Embedded Files
A collection of web and app solutions built over the years.
Vue Projects
Built as part of a 3-hour Vue.js Crash Course (2024) by Traversy Media, Vue Jobs is a functional job browsing platform deployed using Netlify that allows users to:
Browse job listings and read job details
Add new jobs to the list
Edit existing job entries
This project runs locally using JSON as a backend server, meaning the online version does not support data persistence. However, it served as a great hands-on introduction to Vue.js and solidified my love for the framework. Through this project, I deepened my understanding of Vue’s reactivity system, component-based architecture, and state management, making it a stepping stone for more advanced Vue applications.
React Projects
Built with a minimal setup using React and Vite, TimeTally is a responsive web application designed to calculate and display time inputted by users in decimal format deployed using Vercel. Key features include:
User inputs time values in different time groups
The app calculates and shows the sum in decimal format
Includes light and dark modes for enhanced user experience
Fully responsive design for optimal viewing on both mobile and desktop devices
Although I haven’t explored much of Vite yet, this project provided a great opportunity to understand the power of React for managing dynamic states and handling user input, while also experimenting with Vite for fast, modern build tooling. This project helped me improve my front-end development skills and gave me insight into creating user-friendly interfaces with React.
Developed using React and Firebase, Trading Rules Checklist is a flexible and user-friendly app that helps traders manage and track their trading rules. Key features include:
Firebase Authentication allows secure login and personalized experience for users.
Users can easily Add and Display Rules which are stored and displayed dynamically.
Each rule can be pinned, edited or deleted as needed.
Users can pin important rules, and these pinned rules will not be deleted when the "Delete All" button is used.
This project leveraged Firebase for a flexible and scalable database, allowing seamless storage, editing, and deletion of rules. The dynamic data handling and enabled a smooth and secure user experience, demonstrating my ability to integrate front-end and back-end technologies effectively.
Mobile Development
Pillpal
Pillpal
Developed in Kotlin in 2023, Drug Interaction is a prototype mobile app designed to help users check potential drug interactions. The app was designed using Figma and features a user-friendly interface for easy navigation and interaction. Key details include:
Drug Interaction Database - A simulated database of drug interactions (random data for the prototype) for demonstration purposes.
Search Functionality - Users can search for drug names and view interaction warnings and details.
Prototype Recognition - This project was recognized as the second-best app prototype in class, showcasing strong design and functional concepts.
Though the data was randomly generated, this project provided valuable insights into mobile app design, Kotlin development, and prototyping. It demonstrated my ability to build practical, user-centric applications and to work with design tools like Figma to bring ideas to life.
EJS and API Integration
CryptoxlPeso
CryptoxlPeso
CryptoxlPeso is a cryptocurrency platform built to display the currently trending coins in Philippine Peso (PHP) using the CoinGecko API for real-time data fetching. Key features include:
Real-Time Coin Data - Fetches and displays the latest trending cryptocurrencies along with their market data in PHP.
API Integration - Uses the CoinGecko API to pull accurate and up-to-date data on the most popular coins.
EJS Templating – Implements EJS for rendering dynamic content on the front end.
This project allowed me to integrate a reliable API, manage real-time data, and work with both front-end and back-end technologies to build a full-fledged platform. It strengthened my skills in API integration creating responsive web applications that deliver dynamic data in real time.
FakeStore Explorer is a simple e-commerce web application that fetches and displays product data from the FakeStoreAPI. It utilizes EJS templating to render dynamic content and is deployed on Render.com as a web service.
Product Catalog – Displays a list of products with images, prices, and descriptions.
API Integration – Fetches real-time product data from FakeStoreAPI.
EJS Templating – Dynamically renders product details on the front end.
Deployed on Render – Runs as a live web service using Render.com.
This project allowed me to integrate a reliable API, manage real-time data, and work with both front-end and back-end technologies to build a full-fledged platform. It strengthened my skills in API integration creating responsive web applications that deliver dynamic data in real time.
VOGUE BAGUIO
VOGUE BAGUIO
Vogue Baguio is a blog platform dedicated to showcasing the lifestyle, fashion, and culture of Baguio City. Built with EJS templating, it delivers a seamless and dynamic user experience. The project is deployed on Vercel.com for fast and reliable hosting.
Curated Blog Content – Covers fashion trends, local culture, and lifestyle in Baguio.
EJS Templating – Enables dynamic content rendering for an engaging user experience.
Deployed on Vercel – Ensures fast and scalable performance.
This project strengthened my skills in server-side rendering, dynamic content management, and full-stack deployment using Vercel.
Static HTML, CSS and JavaScript
Responsive Minimalist Web Design Prototypes
Responsive Minimalist Web Design Prototypes
These minimalist prototypes website was built using HTML, CSS, and JavaScript to create an engaging, interactive experience for client presentations. Key features include:
Animations - Smooth, interactive animations enhancing user engagement and experience.
Minimalist Styling - Clean and modern design focused on clarity, simplicity, and ease of navigation.
Responsive Design - Ensures a seamless experience across various devices, tailored to the client's needs.
Interactivity - JavaScript enhances the site’s dynamic features, improving user interaction with smooth transitions and effects.
These projects highlights my ability to design and build clean, visually appealing websites with a focus on user interaction and responsive design, ensuring a great experience for potential clients.
PHP and SQL Database
Sag'mano
Sag'mano
Built in June 2021, this directory platform connects local microbusinesses (e.g., sari-sari stores) in the Philippines with customers, helping them be more seen to the public. This also helps buyers to see the nearest store with the best prices. Key features include:
Business Listings - Local microbusinesses can create profiles with details like store name, products, and location to help customers discover them.
Customer Interaction - Customers can browse through various business profiles and contact them for more information.
Dynamic Functionality with PHP - Utilizes PHP for server-side scripting, enabling dynamic functionality and seamless user interactions.
SQL Database Management - Stores business data and customer interactions in an SQL database, ensuring efficient data handling and retrieval.
Front-End Design with HTML, CSS, and JavaScript - HTML, CSS, and JavaScript create a clean, responsive front-end, providing smooth navigation, business search, and user interaction.
This project highlights my ability to build full-stack web applications that bridge local businesses with their communities. The combination of PHP, SQL, and modern front-end technologies showcases my skills in developing dynamic websites with database integration, user-friendly design, and scalable functionality.
Java and Java Database Connectivity
Ailurus - Point of Sales System
Walk-through
Ailurus is a Point of Sales (POS) system designed to streamline transactions and inventory management for businesses. Built in March 2021, this project utilizes Java and SQL to provide a seamless user experience with a Graphical User Interface (GUI).
Key Features:
✅ Sales Processing - Handles customer transactions efficiently with a user-friendly interface.
✅ Inventory Management - Tracks product stock, allowing businesses to manage items easily.
✅ Database Integration - Utilizes Java Database Connectivity (JDBC) with SQL for secure and reliable data storage.
✅ Graphical User Interface (GUI) - Built using Java Swing/JavaFX, ensuring an intuitive and responsive design.
✅ Walk-through Feature - A step-by-step guide helps users navigate the system effortlessly.
This project demonstrates my ability to build robust desktop applications using Java for back-end logic and SQL for data management, creating a fully functional POS system tailored for business needs.
Social Media Information System Walk-through
Built in November 2020, this Social Media Information System is a data-driven platform designed to manage and organize user information efficiently. Developed using Java and SQL, it leverages Java Database Connectivity (JDBC) to enable seamless data storage and retrieval.
Key Features:
✅ User Information Management – Stores and organizes user profiles, including names, contact details, and activity data.
✅ Database Integration – Utilizes SQL for structured data management, ensuring efficient storage and retrieval.
✅ Java Database Connectivity (JDBC) – Provides a secure and scalable connection between the application and the database.
✅ Graphical User Interface (GUI) – Offers an intuitive and interactive front-end for managing data with ease.
✅ Walk-through Feature – Includes a guided tutorial to help users navigate the system effortlessly.
This project showcases my expertise in Java-based applications, SQL database management, and GUI development, demonstrating my ability to build data-driven systems with structured and efficient back-end functionality.
Java RPG Object Oriented Programming
Mysterage - Role Playing
Text-based Game
Walk-through
Mysterage is a text-based RPG that immerses players in an interactive adventure driven by choices and exploration. Built in February 2020, this project was developed in Java, leveraging Object-Oriented Programming (OOP) principles to create a structured and engaging gameplay experience.
Key Features:
✅ Choice-Driven Gameplay – Players make decisions that influence the story’s progression and outcome.
✅ Text-Based Exploration – Navigate through an immersive world using text commands and prompts.
✅ Object-Oriented Game Design – Implements Java OOP principles, including classes, inheritance, and encapsulation, to manage game logic efficiently.
✅ Dynamic Storytelling – Branching storylines and interactive mechanics keep players engaged.
✅ Walk-through Feature – Provides a guided experience to help players understand game mechanics.
This project showcases my ability to develop interactive systems, apply OOP principles, and design engaging gameplay mechanics using Java. Mysterage serves as a testament to my creativity and problem-solving skills in game development.
Page updated
Google Sites
Report abuse