{"projects":[{"status":"published","private":true,"id":1016,"title":"Client-Side Module Development & API Reverse Engineering","thumbnail":null,"body":"# Client-Side Module Development & API Reverse Engineering\n\n Java Development / Reverse Engineering 2024–2025
\n
\n\n### Technologies that I have worked on here\n\n- Java (JDK 8+)\n- Gradle build system\n- Client-side APIs\n- Reverse engineering techniques\n- Live multiplayer environment integration\n\n### Project Overview\n\nDeveloped custom client modules and extensions for a multiplayer environment with minimal available documentation. This project required extensive reverse engineering of undocumented APIs, code exploration, and problem-solving to implement new features and enhance existing functionality.\n\n**Repository:** [github.com/jovylle/Trouser-Streak-Clone](https://github.com/jovylle/Trouser-Streak-Clone)\n\n### Key Responsibilities\n\n- Reverse-engineered client-side APIs to understand internal architecture and data flow\n- Developed custom modules to automate repetitive tasks and improve user experience\n- Enhanced existing functionality through careful code analysis and integration\n- Solved complex technical challenges with limited documentation or community resources\n- Maintained compatibility across updates and version changes\n- Implemented features that integrate seamlessly with the live multiplayer environment\n\n### Technical Challenges\n\n**Limited Documentation:** Navigated through codebases with sparse or non-existent documentation, relying on code exploration, debugging, and reverse engineering to understand system behavior.\n\n**API Discovery:** Identified and utilized undocumented APIs through bytecode analysis and runtime debugging to implement desired features.\n\n**Integration Complexity:** Ensured custom modules worked harmoniously with existing systems without causing conflicts or performance issues.\n\n**Version Compatibility:** Adapted implementations to handle updates and maintain functionality across different client versions.\n\n### Skills Demonstrated\n\n- Strong problem-solving and analytical thinking\n- Proficiency in Java and Gradle build systems\n- Experience with reverse engineering and code analysis\n- Ability to work independently with minimal external resources\n- Understanding of client-server architecture in multiplayer environments\n\n### Outcome\n\nSuccessfully created a suite of custom modules that significantly enhanced user experience in the target environment. The project showcases my ability to tackle complex technical challenges, learn quickly from code analysis, and deliver functional solutions even when facing documentation gaps.\n\n### Disclaimer\n\nThis project was developed independently for educational and personal skill development purposes. It demonstrates my technical capabilities in Java development, reverse engineering, and problem-solving with limited resources."},{"status":"published","private":false,"id":1000,"title":"A Nextjs Website designed to spark curiosity and tell innovative concepts.","thumbnail":"/uploads/screenshot_20250102_135614.png","body":"# A Nextjs Website designed to spark curiosity and tell innovative concepts\n\n Blog Website 2025
\n
\n\n\n\n### Technologies that I have worked on here\n\n- Next.js\n- React\n- TailwindCSS\n- MDX\n- Vercel Deployment\n- JavaScript (ES6+)\n- CSS Modules\n\n### Responsibility\n\nI designed, developed, and coded this modern blog website from the ground up. My main goal was to create an engaging and visually striking platform that allows me to share my personal interests, opinions, and creative ideas.\n\nKey responsibilities included:\n\n- Designing an intuitive and responsive user interface to ensure a seamless browsing experience across devices.\n- Developing dynamic, SEO-optimized pages using Next.js to improve site performance and visibility.\n- Integrating MDX to create a flexible blogging environment for publishing markdown-based content with custom React components.\n- Styling the website with TailwindCSS, focusing on a clean and modern aesthetic.\n- Ensuring fast load times and smooth navigation through code optimization and deployment on Vercel.\n- Continuously iterating on design and functionality to incorporate new features and improve user engagement.\n\nCollaboration with tools and libraries was integral to achieve a polished final product. By staying up-to-date with the latest trends in frontend development, I ensured the site delivers both an engaging experience and robust technical performance.\n\n### Disclaimer\n\nThis project represents a personal endeavor and is displayed here for informational and demonstration purposes. It is a showcase of my skills, creativity, and dedication to building high-quality web experiences.\n\nPlease note that the descriptions, images, and information related to this project reflect my individual contributions as a designer and developer. They are not associated with any external organization or client.\n\nFor further details about this project or to discuss my qualifications, feel free to reach out to me directly."},{"status":"published","private":false,"id":1001,"title":"QuickGPT — Multi-model Chat Studio","thumbnail":"/uploads/screenshot_20241002_172131.png","body":"# QuickGPT — Multi-model Chat Studio\n\n Conversation Interface 2026
\n
\n\n\n\n**Live:** [chatgpt.uft1.com](https://chatgpt.uft1.com) / [chat.uft1.com](https://chat.uft1.com)\n\n## Android app (Chat Assistant Box 1.4)\n\nThe same web app now ships as a **real Android app** via **Capacitor** (not TWA). We went from PWA → TWA (PWA Builder/Bubblewrap) → Capacitor WebView shell on the capacitor-shell branch. No \"Running in Chrome,\" no asset links—a native app shell that loads the same public/ assets. Release **1.4** (versionCode 5) is built and signed with our keystore; **releases/chat-assistant-box-1.4.aab** is ready for Google Play.\n\n## Snapshot\n\nQuickGPT is a single-page chat UI that ships with a dedicated conversation sidebar, markdown rendering, export/import controls, light/dark theming, prompt suggestions, and Netlify serverless glue to whichever AI provider a user picks. The experience keeps the same rapid cadence that helped friends keep their free chatgpt.com instance alive while scaling the surface area for productivity features.\n\n## Conversation list & sidebar UX\n\nEvery conversation is persisted and ordered by the last update, with metadata showing the timestamp and estimated token count. Sidebar toggle state survives reloads, and the **+ New conversation** CTA clears the chat while keeping the shared localStorage store in sync with exports, imports, and delete flows.\n\n```javascript\nfunction renderConversationList() {\n conversationList.innerHTML = '';\n const sortedIds = Object.keys(conversations).sort((a, b) => conversations[b].updated - conversations[a].updated);\n sortedIds.forEach(id => {\n const convo = conversations[id];\n const item = document.createElement('div');\n // render title, metadata, delete button\n });\n}\n```\n\n## Multi-model backend routing\n\n`netlify/functions/chat.js` now accepts OpenAI and Anthropic keys, normalizes request history, validates quotas, and surfaces errors back to the UI. GPT-3.5-turbo-16k remains the default while two GPT-4o variants are available, and Anthropic credentials unlock three Claude models that stay free for users who qualify. Advanced users can inject their own API key/provider per request without touching the deployed secrets.\n\n## Productivity polish\n\nThe UI renders each response with a regenerate action, adds copy buttons inside code blocks, and tightens styling across desktop/mobile. Prompt suggestions, sidebar persistence, and exports/imports continue to share the same store so every surface reads identical conversation context regardless of how you rehydrate a thread.\n"},{"status":"published","private":false,"id":1002,"title":"Sunflower Land: Desert Digging Tool","thumbnail":"/uploads/sfl.uft1.com.png","body":"A high-performance web tool that assists players with the **Desert Digging** feature in Sunflower Land.\n\n🧠 **Key Technologies**:\n- Vue 3 with Composition API\n- Vite multi-page setup\n- Tailwind CSS 4\n- VueUse & Head API\n- Puppeteer for screenshot automation\n- API proxy with Vite dev server\n\n📈 Used by **hundreds of players** daily \n🗣️ [See community feedback → https://sfl.uft1.com/feedbacks](https://sfl.uft1.com/feedbacks)\n\n"},{"status":"published","private":false,"id":1003,"title":"Deployed and mentained site in Full Stack responsibility","thumbnail":"/laravel2.png","body":"# {{ $doc.title }}\n\n Web Portal Application 2023
\n
\n\n\n\n### Technologies that I have worked on here.\n\n- Deploying site in Linux, Nginx Mysql, PHP\n- Laravel. Specificly..\n - Controllers\n - Laravel Events\n - Repositories\n - PHP Artisan\n - Eloquent\n - Query Builder\n- Mysql\n - Basic and Advanced queries\n - Select inside selects\n - Alot of Joining tables\n\n## Disclaimer\n\nThe projects featured on this portfolio were created during my professional experience and are displayed here for informational and demonstration purposes. These works are meant to showcase my skills, abilities, and the range of projects I've been involved in.\n\nPlease note that the inclusion of these projects does not imply any ongoing affiliation with the organizations for which they were originally created. They are presented as examples of my past work and do not necessarily represent the current standards, strategies, or views of those organizations.\n\nAll descriptions, images, and information related to these projects represent my individual contributions, possibly in collaboration with others during my employment or engagement with those organizations.\n\nFor further details about these projects or to discuss my qualifications, please don't hesitate to reach out to me directly."},{"status":"published","private":false,"id":1004,"title":"Browser Chrome Based Extensions","thumbnail":"/image-extensionmelvor.png","body":"# {{ $doc.title }}\n\n Browser Chrome Based Extensions 2020
\n
\n\n
\nSee the code here\n\n\nhttps://github.com/jovylle/melvorite\n\n
\n\n\n
\nalso available on other chrome based browser like Microsoft Edge and Brave.\n\n\nhttps://chromewebstore.google.com/search/jovylle\n\n
\n\n\n## Description: \nDeveloped a Chrome extension using \"manifest_version\": 3 for Chrome-based browsers. The extension automates gameplay tasks in the web game \"Melvor Idle\" by strategically clicking buttons at intervals and identifying HTML elements for optimal gameplay efficiency.\n\n## Features:\n\nAutomated button clicking within the game interface.\nJavaScript executor to perform actions based on game conditions.\nTechnologies Used:\n\nJavaScript\nChrome Extension APIs\nHTML DOM manipulation\n\n## Achievements:\n\nCurrently maintains a 5.0 rating with 25 active users.\nPositive user feedback and ongoing development to enhance usability and functionality.\n\n## Future Plans:\n\nImplementing community features such as user forums and real-time feedback mechanisms.\nIntegration with cloud-based services for enhanced scalability and user engagement."},{"status":"published","private":false,"id":1005,"title":"Created Client Portfolio Website in NuxtJs2","thumbnail":"/image-5.png","body":"# {{ $doc.title }}\n\n Client Portfolio 2022
\n
\n\n\n\n### Technologies that I have worked on here.\n\n- Nuxtjs2\n- HTML, CSS\n- TailwindCSS\n- Strapi CMS\n- VueJs2\n- SalJs\n\n### Challenges\n\nThis is one of the first projects I made in NuxtJS, mistakes was obvious on ineffective use of tailwind and NuxtJS bad component structure. But learned along the way and made a satisfied result. At least to me and to my boss.\n\n### Responsibility\n\nAs a frontend developer here I was responsible for creating front-end codes for websites, my main role is to design visually appealing and user-friendly web pages. This involves translating design concepts into web pages that look great on various devices and browsers. I also focus on delivering a smooth user experience, optimizing page load times, and ensuring that the website is compatible with different browsers. \n\nCollaboration with designers and back-end developers is a crucial part of my job to make sure the user interface and functionality work seamlessly together. Staying updated with the latest web development trends and best practices is also essential to deliver high-quality websites for our clients.\n\n## Disclaimer\n\nThe projects featured on this portfolio were created during my professional experience and are displayed here for informational and demonstration purposes. These works are meant to showcase my skills, abilities, and the range of projects I've been involved in.\n\nPlease note that the inclusion of these projects does not imply any ongoing affiliation with the organizations for which they were originally created. They are presented as examples of my past work and do not necessarily represent the current standards, strategies, or views of those organizations.\n\nAll descriptions, images, and information related to these projects represent my individual contributions, possibly in collaboration with others during my employment or engagement with those organizations.\n\nFor further details about these projects or to discuss my qualifications, please don't hesitate to reach out to me directly."},{"status":"published","private":false,"id":1006,"title":"Flutter Weather App","thumbnail":"/uploads/weather4.png","body":"\n\n\n**Live Site:** [weather.uft1.com](https://weather.uft1.com/)\n\n## Flutter Weather App\n\n**Mobile Application** \n**Released:** 2025 \n**Role:** Developer \n\n### Overview\n\nThe **Flutter Weather App** is a sleek and modern mobile application built with **Flutter**. It allows users to check the weather of their current location, search for specific locations, mark them as favorites, and customize settings such as temperature units (Celsius/Fahrenheit) and theme preferences (Dark/Light mode).\n\n### Key Features\n\n* **Local Weather Option:** Get real-time weather updates based on the user's current location.\n* **Search and Favorite Locations:** Look up weather details for specific locations and save them for quick access.\n* **Settings Page:** Configure temperature units (Celsius/Fahrenheit) and toggle between Light and Dark themes.\n* **Beautiful UI:** A visually appealing interface with a smooth user experience.\n\n### Technologies Used\n\n* **Flutter & Dart** - For building a cross-platform mobile application.\n* **Riverpod** - State management for efficient and scalable app architecture.\n* **SharedPreferences** - To persist user settings like theme preference and temperature unit.\n* **GoRouter** - For seamless and declarative navigation.\n* **OpenWeather API** - To fetch real-time weather data.\n\n\n\n\n\n### Development Approach\n\nThis project prioritizes user experience with a clean UI and intuitive navigation. It integrates with the **OpenWeather API** to provide accurate weather forecasts, and **Riverpod** ensures efficient state management. **SharedPreferences** allows users to save their settings, making their experience more personalized and seamless.\n\n### Challenges\n\n* **API Data Handling:** Efficiently parsing and displaying weather data in a user-friendly manner.\n* **Theming Implementation:** Ensuring a smooth and consistent UI across light and dark themes.\n* **State Management Optimization:** Utilizing **Riverpod** for performance-friendly state updates.\n\n### Future Enhancements\n\n* **Hourly and Weekly Forecasts:** Expand weather data to include more detailed predictions.\n* **Animated Weather Icons:** Enhance UI with dynamic and animated weather visuals.\n* **Notifications:** Send alerts for severe weather conditions.\n\n### Try It Out\n\nThe Flutter Weather App will soon be available on **Google Play Store** and **Apple App Store**. Stay tuned for updates!\n\n\n\n\n---\n\nBy developing this app, I aimed to combine functionality with aesthetics, demonstrating my expertise in Flutter development, state management, and API integration."},{"status":"published","private":false,"id":1007,"title":"Created Another Business Website in NuxtJs2","thumbnail":"/image-5.png","body":"# {{ $doc.title }}\n\n Business Website 2022
\n
\n\n\n\n### Technologies that I have worked on here.\n\n- Nuxtjs2\n- HTML, CSS\n- TailwindCSS\n- Strapi CMS\n- VueJs2\n- SalJs\n\n### Responsibility\n\nAs a frontend developer here I was responsible for creating front-end codes for websites, my main role is to design visually appealing and user-friendly web pages. This involves translating design concepts into web pages that look great on various devices and browsers. I also focus on delivering a smooth user experience, optimizing page load times, and ensuring that the website is compatible with different browsers. \n\nCollaboration with designers and back-end developers is a crucial part of my job to make sure the user interface and functionality work seamlessly together. Staying updated with the latest web development trends and best practices is also essential to deliver high-quality websites for our clients.\n\n## Disclaimer\n\nThe projects featured on this portfolio were created during my professional experience and are displayed here for informational and demonstration purposes. These works are meant to showcase my skills, abilities, and the range of projects I've been involved in.\n\nPlease note that the inclusion of these projects does not imply any ongoing affiliation with the organizations for which they were originally created. They are presented as examples of my past work and do not necessarily represent the current standards, strategies, or views of those organizations.\n\nAll descriptions, images, and information related to these projects represent my individual contributions, possibly in collaboration with others during my employment or engagement with those organizations.\n\nFor further details about these projects or to discuss my qualifications, please don't hesitate to reach out to me directly."},{"status":"published","private":false,"id":1008,"title":"Full Stack Utility Tools Hub - UFT1.COM","thumbnail":"/uploads/uft1screenshot.png","body":"## Full Stack Utility Tools Hub - UFT1.COM\n\n\n Web Utility Application 2025 \n  
\n
\n\nA collection of handy online tools built with Next.js and Tailwind CSS, featuring real-time audio delay, camera testing, and signature pad functionalities. Deployed and live at [uft1.com](https://uft1.com).\n\n\n\n\n\n### Technologies I Worked On\n\n- **Frontend Development**:\n - **Next.js (App Router, v14.2.5)**:\n - Client-side rendering with `\"use client\"`\n - Dynamic routing for tool pages\n - SEO optimization with metadata and Open Graph tags\n - **React**:\n - Hooks (`useState`, `useEffect`, `useRef`)\n - Component-based architecture\n - **Tailwind CSS**:\n - Responsive design across devices\n - Dark mode support (in progress)\n - **Web APIs**:\n - Web Audio API for real-time delayed audio playback\n - MediaRecorder API (initial audio implementation)\n - Navigator MediaDevices for camera and microphone access\n\n- **Project Structure & Tools**:\n - ESLint with Next.js config for code quality\n - PostCSS and Tailwind config for styling\n - Git for version control\n - Deployed via Vercel (assumed hosting platform)\n\n- **Key Features Implemented**:\n - Real-time Delayed Audio Playback with configurable delays (1-60 seconds)\n - Camera testing tool\n - Signature pad utility\n - Modular component design (Header, Footer, Layout)\n\n## Project Overview\n\n\"UFT1 Tools\" (developed under the working title \"Wanabusful\") is a personal passion project showcasing a suite of browser-based utilities. Built from the ground up with Next.js, this full-stack application demonstrates my skills in modern web development, real-time media processing, and responsive UI design. It’s now live at [uft1.com](https://uft1.com), ready for anyone to explore!\n\nKey highlights:\n- A real-time audio delay tool that captures microphone input and plays it back with a user-selected delay, powered by the Web Audio API.\n- A clean, responsive interface styled with Tailwind CSS, accessible on mobile and desktop.\n- A scalable architecture designed for adding new tools over time.\n\n### [Live Demo](https://uft1.com) | [GitHub Repository](https://github.com/jovylle/wanabusful)\n\n## Challenges & Solutions\n\n- **Real-Time Audio Processing**: Started with MediaRecorder for audio capture but pivoted to Web Audio API for seamless live delay. Ensured proper stream cleanup to avoid browser issues.\n- **Responsive Design**: Leveraged Tailwind’s utility classes to create a fluid layout without custom CSS breakpoints.\n- **Deployment**: Successfully deployed to a live domain (uft1.com), optimizing for performance and SEO.\n\n## Future Enhancements\n\n- Complete dark mode with system preference detection.\n- Add new tools like a QR code generator or text formatter.\n- Integrate a waveform visualizer for the audio tool to enhance user experience.\n- Explore analytics to track tool usage and improve features.\n\n## Disclaimer\n\nThe projects featured in this portfolio, including UFT1 Tools, were created during my personal development time to demonstrate my technical skills and problem-solving abilities. They are presented for informational and portfolio purposes only.\n\nUFT1 Tools is a solo project and does not represent any affiliation with external organizations. It serves as a showcase of my capabilities in full-stack development.\n\nFor more details about this project or to discuss my qualifications, feel free to [contact me](mailto:your.email@example.com)."},{"status":"published","private":false,"id":1009,"title":"Created 3 Business Websites of different Clients in GatsbyJs and SanityCMS","thumbnail":"/image-7.png","body":"# {{ $doc.title }}\n\n Business Website 2020
\n
\n\n\n\n### Description\n\n{{ $doc.description }}\n\n### Technologies that I have worked on here.\n\n- GatsbyJs\n- ReactJs\n- HTML, CSS\n- Bootstrap CSS\n- Sanity CMS\n\n### Responsibility\n\nAs a frontend developer here I was responsible for creating front-end codes for websites, my main role is to design visually appealing and user-friendly web pages. This involves translating design concepts into web pages that look great on various devices and browsers. I also focus on delivering a smooth user experience, optimizing page load times, and ensuring that the website is compatible with different browsers. \n\nCollaboration with designers and back-end developers is a crucial part of my job to make sure the user interface and functionality work seamlessly together. Staying updated with the latest web development trends and best practices is also essential to deliver high-quality websites for our clients.\n\n## Disclaimer\n\nThe projects featured on this portfolio were created during my professional experience and are displayed here for informational and demonstration purposes. These works are meant to showcase my skills, abilities, and the range of projects I've been involved in.\n\nPlease note that the inclusion of these projects does not imply any ongoing affiliation with the organizations for which they were originally created. They are presented as examples of my past work and do not necessarily represent the current standards, strategies, or views of those organizations.\n\nAll descriptions, images, and information related to these projects represent my individual contributions, possibly in collaboration with others during my employment or engagement with those organizations.\n\nFor further details about these projects or to discuss my qualifications, please don't hesitate to reach out to me directly."},{"status":"published","private":false,"id":1010,"title":"Mentained and implement features to a Project","thumbnail":"/image-8.png","body":"# {{ $doc.title }}\n\n Web Portal Website 2020
\n
\n\n\n\n### Technologies that I have worked on here.\n\n- Laravel. Specificly..\n - Controllers\n - Laravel Events\n - Laravel Queue\n - Repositories\n - Migrations\n - PHP Artisan\n - Eloquent\n - Query Builder\n- Mysql\n - Basic and Advanced queries\n - Select inside selects\n - Alot of Joining tables\n\n\n## Disclaimer\n\nThe projects featured on this portfolio were created during my professional experience and are displayed here for informational and demonstration purposes. These works are meant to showcase my skills, abilities, and the range of projects I've been involved in.\n\nPlease note that the inclusion of these projects does not imply any ongoing affiliation with the organizations for which they were originally created. They are presented as examples of my past work and do not necessarily represent the current standards, strategies, or views of those organizations.\n\nAll descriptions, images, and information related to these projects represent my individual contributions, possibly in collaboration with others during my employment or engagement with those organizations.\n\nFor further details about these projects or to discuss my qualifications, please don't hesitate to reach out to me directly."},{"status":"published","private":false,"id":1011,"title":"Created a Derma's Business Website in NuxtJs2","thumbnail":"/image-6.png","body":"# {{ $doc.title }}\n\n Business Website 2022
\n
\n\n\n\n### Technologies that I have worked on here.\n\n- Nuxtjs2\n- HTML, CSS\n- TailwindCSS\n- Strapi CMS\n- VueJs2\n- SalJs\n\n### Responsibility\n\nAs a frontend developer here I was responsible for creating front-end codes for websites, my main role is to design visually appealing and user-friendly web pages. This involves translating design concepts into web pages that look great on various devices and browsers. I also focus on delivering a smooth user experience, optimizing page load times, and ensuring that the website is compatible with different browsers. \n\nCollaboration with designers and back-end developers is a crucial part of my job to make sure the user interface and functionality work seamlessly together. Staying updated with the latest web development trends and best practices is also essential to deliver high-quality websites for our clients.\n\n## Disclaimer\n\nThe projects featured on this portfolio were created during my professional experience and are displayed here for informational and demonstration purposes. These works are meant to showcase my skills, abilities, and the range of projects I've been involved in.\n\nPlease note that the inclusion of these projects does not imply any ongoing affiliation with the organizations for which they were originally created. They are presented as examples of my past work and do not necessarily represent the current standards, strategies, or views of those organizations.\n\nAll descriptions, images, and information related to these projects represent my individual contributions, possibly in collaboration with others during my employment or engagement with those organizations.\n\nFor further details about these projects or to discuss my qualifications, please don't hesitate to reach out to me directly."},{"status":"published","private":false,"id":1012,"title":"Sunflower Land Farm Helper: Mass Plant & Harvest Chrome Baseeeed Extension","thumbnail":"/uploads/screenshot_20240924_103434.png","body":"## Sunflower Land Farm Helper: Mass Plant & Harvest\n\n**Chrome Extension**\\\n**Released:** 2024\\\n**Role:** Developer \n\n### Its Website\n\n[sunflower-land-helper.jovylle.com](https://sunflower-land-helper.jovylle.com/)\n\n### Install from Chrome Web Store\n\n[chromewebstore.google.com/detail/sunflower-land-farm-helpe/innimeplbaacgjbdpohblfgamoheoihi](https://chromewebstore.google.com/detail/sunflower-land-farm-helpe/innimeplbaacgjbdpohblfgamoheoihi)\n\n- - -\n\n### Overview\n\n**Sunflower Land Farm Helper: Mass Plant & Harvest** is a Chrome extension that I developed to enhance the player experience in the popular web game **Sunflower Land**. The extension allows players to plant and harvest crops in bulk with a single click, streamlining the repetitive tasks of the game while maintaining control over gameplay. It demonstrates my ability to integrate efficient, user-friendly functionality within a web environment.\n\n### Key Features\n\n* **Bulk Planting & Harvesting:** Perform mass planting and harvesting operations with just a click, significantly reducing manual effort for players.\n* **Intuitive Interface:** Simple, user-friendly buttons are integrated directly into the game screen for easy access and optimal user experience.\n* **Performance Optimization:** The extension is designed to run efficiently within the game, without affecting overall performance.\n\n### Technologies Used\n\n* **JavaScript**: To manage DOM manipulation and inject functionality directly into the game environment.\n* **Chrome Extensions API**: To provide an interface for the extension to interact with browser tabs and game content.\n* **HTML/CSS**: For structuring and styling the interface elements, such as the buttons for planting and harvesting.\n\n### Development Approach\n\nIn building this extension, I focused on making the user experience as smooth as possible by creating an interface that integrates seamlessly into the existing game. Leveraging the Chrome Extensions API, I injected content scripts to handle mass DOM manipulations, enabling quick planting and harvesting in the game. \n\nThe permissions used are minimal to ensure user privacy, and the extension operates solely on the **Sunflower Land** game environment, avoiding any unnecessary access to user data.\n\n### Challenges\n\n* **DOM Element Handling:** The game dynamically loads elements, so I needed to ensure my JavaScript logic correctly identified and interacted with them in real-time.\n* **User Interface Design:** Creating a UI that integrates into the game's interface without disrupting the design required careful positioning and consideration of z-indexes.\n\n### Try It Out\n\nYou can [install the extension](https://chromewebstore.google.com/detail/sunflower-land-farm-helpe/innimeplbaacgjbdpohblfgamoheoihi) from the Chrome Web Store and use it while playing **Sunflower Land** to simplify your farming tasks. Feel free to check out the public repository for more details and to report issues or suggestions.\n\n### Explore the Public Repository\n\n\n\n- - -\n\n### Screenshot\n\n\n\n\n\n- - -\n\nBy showcasing this project, I’m highlighting my ability to build practical tools that integrate with existing web platforms, demonstrating my full-stack development skills and my ability to enhance user experiences with custom solutions."},{"status":"published","private":false,"id":1013,"title":"Stick Figure Game using Phaserjs /miniproject","thumbnail":"/uploads/screenshot_20241002_181646.png","body":"\n\n### Stick Figure Game\n\n**Project Overview:**\n\nI developed a stick figure game using PhaserJS, focusing on interactive gameplay and engaging mechanics. This project allowed me to explore game development while enhancing my JavaScript skills.\n\n**Live Site:** \n[***flyingstickfigure.atcebu.win***](https://flyingstickfigure.atcebu.win/)\n\n**Technologies Used:**\n\n* **PhaserJS**: Utilized this powerful framework to create an interactive gaming experience.\n* **HTML/CSS**: Designed a simple and responsive interface for gameplay.\n\n**Key Features:**\n\n* **Engaging Gameplay**: Implemented fun mechanics that challenge players and keep them engaged.\n* **Responsive Design**: Ensured the game runs smoothly on various devices, providing a seamless experience.\n\n**Outcome:**\n\nThis project deepened my understanding of game development principles and showcased my ability to create dynamic web applications. The stick figure game received positive feedback for its fun design and smooth gameplay."},{"status":"published","private":false,"id":1014,"title":"Created Business Website in NuxtJs2","thumbnail":"/image-9.png","body":"# {{ $doc.title }}\n\n Business Website 2022
\n
\n\n\n\n### Technologies that I have worked on here.\n\n- Nuxtjs2\n- HTML, CSS\n- TailwindCSS\n- Strapi CMS\n- VueJs2\n- SalJs\n\n### Responsibility\n\nAs a frontend developer here I was responsible for creating front-end codes for websites, my main role is to design visually appealing and user-friendly web pages. This involves translating design concepts into web pages that look great on various devices and browsers. I also focus on delivering a smooth user experience, optimizing page load times, and ensuring that the website is compatible with different browsers. \n\nCollaboration with designers and back-end developers is a crucial part of my job to make sure the user interface and functionality work seamlessly together. Staying updated with the latest web development trends and best practices is also essential to deliver high-quality websites for our clients.\n\n## Disclaimer\n\nThe projects featured on this portfolio were created during my professional experience and are displayed here for informational and demonstration purposes. These works are meant to showcase my skills, abilities, and the range of projects I've been involved in.\n\nPlease note that the inclusion of these projects does not imply any ongoing affiliation with the organizations for which they were originally created. They are presented as examples of my past work and do not necessarily represent the current standards, strategies, or views of those organizations.\n\nAll descriptions, images, and information related to these projects represent my individual contributions, possibly in collaboration with others during my employment or engagement with those organizations.\n\nFor further details about these projects or to discuss my qualifications, please don't hesitate to reach out to me directly."},{"status":"published","private":false,"id":1015,"title":"Wedding Website for Vyns and Tiney","thumbnail":"/uploads/screenshot_20241002_171043.png","body":"\n\n\\\nWedding Website for Client Vyns and Tiney\n\n\n\n\\\n\\\n\\\n**Project Overview:**\n\nI had the pleasure of designing and developing a wedding website for my friends, Vyns and Tiney, to celebrate their special day. The site serves as a digital invitation and resource hub for guests, blending aesthetics with functionality.\n\n**Live Site:** [vynsandtiney.atcebu.win](https://vynsandtiney.atcebu.win/)\n\n**Technologies Used:**\n\n* **HTML**: Crafted a clean and structured layout to enhance user experience.\n* **CSS**: Utilized modern styling techniques to create a visually appealing design that reflects the couple's personality.\n\n**Key Features:**\n\n* **Responsive Design**: The website is fully responsive, ensuring an optimal viewing experience on various devices, from desktops to smartphones.\n* **Event Details**: Included sections for wedding date, venue, and schedule to keep guests informed.\n* **RSVP Functionality**: Developed an RSVP section to allow guests to confirm their attendance effortlessly.\n* **Gallery**: Showcased a gallery of the couple's journey, adding a personal touch.\n\n**Outcome:**\n\nThe website not only met Vyns and Tiney's vision but also received positive feedback from guests for its ease of use and attractive design. This project enhanced my skills in front-end development and reinforced my passion for creating meaningful digital experiences."}]}