Projects
These are frontend projects I built during live streams, with links to full access to source code, working demos, and YouTube playlists or videos. Every project is made with HTML, CSS (sometimes SCSS) and JavaScript. No frameworks, just clean, accessible code.
Personal Portfolio Website: PHP, HTML, SCSS & JavaScript
Follow along as I build my new website from the ground up using PHP, semantic HTML, SCSS, and vanilla JavaScript. There's plenty of project planning, QA, and real-time problem solving along the way—just like a real dev workflow.
Style Guide & Project Planning
In this project, we dive into the early stages of front-end project planning. Watch as we write user stories to define project goals and build a custom style guide using Affinity Photo. These videos lay the groundwork for strong, focused UI development.
Frontend Mentor: Product List with Cart
Join me as I tackle a fun Frontend Mentor challenge where I'll build a product list with an interactive shopping cart from scratch! We'll dive into HTML, CSS, and JavaScript to create a clean, responsive layout, and I'll walk you through adding key features like item quantities, total pricing, and cart updates.
Blog Layout with Category Filter | Photoshop to Finish
Follow along as I build a responsive blog-style layout from a Photoshop mockup using HTML, SCSS, and JavaScript. In this series, I cover key steps from design setup to clean, accessible code, perfect for anyone looking to sharpen their front-end skills.
Build a Pinterest Masonry Layout
In this 2-part live stream series, watch as I walk through the step-by-step process of building a responsive masonry layout using HTML, SCSS, and JavaScript. From setting up the structure to creating a dynamic, Pinterest-style grid, you'll learn how to create a beautiful and functional layout that adapts to different screen sizes.
Build a Modal Window with HTML, SCSS & JavaScript
In this live stream series, we'll break down building a modal window step by step using HTML, SCSS, and JavaScript. From the basic structure to styling and adding interactive features, you'll have everything you need to create your own custom modals.
Building a Landing Page | HTML, CSS & JavaScript
In this project, we're turning a Photoshop mockup into a fully functional landing page called Soho using HTML, vanilla CSS, and JavaScript. Over the course of eight live streams, we dive deep into creating a page that's responsive, accessible, and packed with smooth navigation and submenus (we spent 4 videos perfecting them).