About the Project
‍The Loma Linda Clinical Laboratory sought to modernize its outdated manual processes by transitioning to a fully digital workflow. Their key requirements included centralizing patient records and inventory management, simplifying lab result transcription, and automating report delivery to reduce administrative overhead. As the developer, I designed and built a custom web application to address these needs. The system introduced features like real-time patient registration, an integrated database for inventory tracking, and automated result distribution via email and Telegram—eliminating error-prone manual data entry and cutting report turnaround time by 60%.

Development & Impact
‍Using React.js and Tailwind CSS for the frontend, I crafted an intuitive interface that reduced staff training time by 30% through clear navigation and role-specific dashboards. The backend, powered by Nest.js and MySQL, ensured secure, scalable data handling for over 5,000 patient records. A dedicated physician portal allowed doctors to access test histories instantly, while staff could manage appointments and inventory seamlessly. The lab reported a 50% drop in data errors and a 100% boost in operational efficiency, transforming their workflow into a streamlined, patient-centric process. This project underscored my ability to solve complex logistical challenges with user-focused technical solutions.

Lessons & Growth
‍This project challenged me to balance technical precision with user-centric design under tight deadlines. I deepened my expertise in full-stack development, particularly in integrating React.js with Nest.js for seamless frontend-backend communication. Managing a centralized database for sensitive medical data taught me the importance of security and scalability, while designing role-specific dashboards honed my ability to tailor interfaces to diverse user needs. The biggest hurdle was ensuring real-time updates for lab results across multiple platforms (email, Telegram), which pushed me to optimize API efficiency and error handling. This project not only sharpened my technical skills but also solidified my passion for building tools that solve real-world problems.

Tools Used
‍React.js, Tailwind CSS, Nest.js, MySQL.
‍
‍Key Metrics
‍60% faster reporting, 50% fewer errors, 30% shorter training.

About the Project
The Card Flipping Memory Game was a hands-on React.js project designed to deepen my understanding of state management and component-driven development. Built with React.js and Tailwind CSS, the game challenges players to match pairs of cards while tracking moves and scores. Key features include dynamic card shuffling, smooth flip animations, and a win-condition modal. I focused on creating reusable components like Card and Modal to ensure clean, modular code, while leveraging React’s useState and useEffect hooks to handle game logic, such as tracking matches and resetting the board. Tailwind CSS allowed me to craft visually engaging transitions, enhancing the user experience without compromising performance.

‍Lessons & Growth
This project pushed me to master React’s state management in a practical context. Debugging the card-matching logic taught me to write cleaner, more efficient code, while implementing animations with Tailwind CSS improved my CSS utility-first workflow. The biggest challenge was ensuring seamless synchronization between game states (e.g., flipped cards, move counts), which deepened my grasp of React’s lifecycle methods. Building reusable components also reinforced the importance of scalability in code structure. Ultimately, this game solidified my confidence in React fundamentals and showcased how even small projects can sharpen problem-solving and attention to detail.

‍Tools Used
‍React.js, Tailwind CSS, Vite.
‍
Key Features
‍Animated cards, score tracking, modular component design.

About the Project
The Loma Linda Clinical Laboratory landing page was designed to address the lab’s urgent need for a modern digital presence. With a sleek, intuitive interface aligned with the company’s brand colors, the project emphasizes simplicity and accessibility. Built with HTML, CSS, and vanilla JavaScript, the site showcases diagnostic services, FAQs, location details, and health articles in a clean, responsive layout. The design prioritizes user-friendly navigation across devices, ensuring critical information is easily accessible while maintaining a professional and modern aesthetic. By balancing visual appeal with functionality, the page reflects the lab’s commitment to trustworthiness and innovation in healthcare.

Tools Used
‍HTML, CSS, JavaScript.
‍
Focus Areas
‍Brand-aligned design, intuitive UI, cross-device responsiveness.

‍

About the Project
The Task Manager App is a dynamic to-do list built with React.js, designed to streamline task organization through intuitive interactivity. This project allows users to add, edit, mark as complete, and delete tasks seamlessly. Leveraging React’s state management, I implemented a custom useForm hook to handle controlled inputs, ensuring smooth form resets and real-time updates. Features like auto-focus during task editing and reusable components (TodoItem, TodoList) emphasize modularity and user-friendly design. The app’s clean interface prioritizes clarity, making it easy for users to manage their daily activities efficiently.

‍Lessons & Growth
Developing this app deepened my understanding of React’s state and lifecycle management. Building the useForm hook taught me to abstract logic for reusable solutions, while structuring components like TodoItem improved my code organization skills. A key challenge was synchronizing state across actions (e.g., editing while preserving completion status), which honed my debugging and problem-solving techniques.

Tools Used
‍React.js, CSS Modules, Custom Hooks.
‍
‍Key Features
‍ Real-time updates, auto-focus editing, modular components.

About the Project
The 3D Printing Business Landing Page was created to boost a local 3D printing startup’s online visibility and client engagement. Built with HTML, CSS, JavaScript, and Bootstrap, the site features a clean, modern design focused on showcasing recent prints, services offered, and a streamlined order form. Key sections include a dynamic gallery of custom figures, detailed services descriptions, and an intuitive contact form for project requests. The goal was to create a professional yet approachable platform that reflects the business’s creativity and technical expertise.

Tools Used
‍HTML, CSS, JavaScript, Bootstrap.
‍
‍Key Features
‍Slider gallery, order form, responsive design.