My original portfolio, I designed and coded my first portfolio website from scratch. It has Home, About Me, Projects, and Contact pages, and a responsive layout built with Bootstrap 5. I added interactive touches including a typing-text intro, a project carousel, expandable project cards, and a background music toggle. I also set up Google Analytics to track how visitors used the site.
UI/UX Designer: Designed the layout, branding, and content, including the logo, fonts, and color scheme
Web Developer: Coded the site and made it responsive across desktop, tablet, and mobile.
HTML, CSS, JavaScript: Built and styled the pages and added interactive features.
Bootstrap 5, jQuery: Created the responsive layout, navigation, carousel, and project cards.
Google Analytics: Tracked visitor activity on the site.
This project strengthened my front-end skills and gave me a portfolio I built entirely myself. Later, I rebuilt it in WordPress to make it easier to update.
This project taught me how to create a website that attracts visitors and turns them into customers. I gained experience with SEO, marketing, and analyzing data, which will be useful for future web projects.
In this individual project, I developed a modern, niche marketing website using HTML, focused on enhancing user experience, SEO strategy, and keyword research. Integrated Google Search Console and Google Analytics to track performance, optimize content, and boost search visibility for a printable digital products business. Explored strategies including social media marketing and community building, while addressing privacy laws, copyright compliance, and website traffic analysis to drive traffic and improve overall performance.
SEO: Applied SEO strategies, used social media marketing to build traffic and a community, ensured privacy and copyright compliance, and analyzed traffic for better conversions.
UI/UX Designer and Web Developer: Designed a simple, user-friendly website that works on all devices, focusing on user engagement.
HTML, CSS, JavaScript: Built and styled the website with interactive features.
SEO, Google Analytics, Google Search Console: Tracked visitors and improved search engine rankings.
The main challenge was balancing SEO, marketing, design, and content. I focused on using SEO to attract visitors, ensuring privacy compliance, and using data to improve conversion rates.
This project taught me how to create a website that attracts visitors and turns them into customers. I gained experience with SEO, marketing, and analyzing data, which will be useful for future web projects.
This project is a dynamic Travel Destination Catalogue web application that allows users to explore travel destinations. The application supports keyword searching, multi-criteria filtering, pagination, and detailed destination views. It also includes a secure admin dashboard were authenticated users can manage catalogue content. This project covers database development, authentication, dynamic queries, and user-focused interface design. prepared statements, dynamic queries, and user-centered interface design.
PHP & Back-End Developer: I designed the relational MySQL database and built dynamic search, filtering, and pagination using PHP. All database interactions were secured with prepared statements to prevent SQL injection. I developed a session-based admin authentication system with hashed passwords and implemented full CRUD functionality for destinations and fun facts.
Full-Stack Web Developer:I created a responsive, mobile-first interface using Bootstrap and semantic HTML. I developed advanced search functionality that combines keywords and filters, designed detailed single-destination views, implemented JavaScript confirmation prompts, and handled image uploads and metadata storage.
HTML, Bootstrap: Semantic markup and responsive design.
PHP & MySQL: CRUD operations, prepared statements, dynamic SQL queries.
Cappadocia is a responsive, mobile-first website built using DaisyUI (a Tailwind CSS component library). The project includes three fully developed pages and demonstrates practical understanding of modern UI components, responsive layouts, and structured design systems. The site features subtle but fun CSS animations to create an interactive experience for users browsing the content.
Front-End Developer: I designed and implemented the website using DaisyUI components, combining them with custom CSS animations for visual appeal.
UX Designer: I focused on mobile-first design, ensuring smooth interactions, readable content, and a consistent navigation scheme that made the site easy and enjoyable to use.
HTML & DaisyUI: Structured content and styled the site using reusable components for a consistent look.
CSS Animation:Added subtle effects to make the site feel dynamic without distracting the user.
This individual project involved creating a Pokédex database to store Pokémon information. I designed and populated a database table, then used PHP to run SQL queries to retrieve, update, and manage Pokémon data. The project gave me hands-on experience with database management, including table creation, inserting records, updating stats, and displaying results dynamically on a web page.
PHP and SQL Developer: I created the table in SQL and wrote PHP code to run queries and display results clearly.
UI/UX Designer: I designed a simple, user-friendly website that works on all devices.
MySQL: Created the table, defined columns, and set primary keys.
PHP: Wrote code to run SQL queries and display results.
HTML: Organized query results in clear tables and lists.
Bootstrap: Styled the webpage for responsive, easy-to-read displays.
The main challenge was setting up the table with the correct data types and writing accurate SQL queries. I focused on getting the syntax right and tested each query to ensure it worked correctly.
This project helped me improve my skills in SQL database management and using PHP to interact with databases. These skills will be useful for future projects involving data management and retrieval.
In this solo project, I built a website for a fictional flower shop called Petal & Stem. The main feature is a form where users can request quotes for custom floral arrangements. I focused on validating user input with PHP to ensure everything was entered correctly, like phone numbers, emails, and delivery dates.
PHP Developer: I wrote the server-side scripts using PHP to validate the user's input. I used regular expressions to check if phone numbers, emails, and dates were in the right format.
Web Developer: I created the form and ensured that if there were any mistakes, the user's input would be saved so they could fix it. I also made sure the website was secure and protected against attacks.
HTML, Bootstrap: Used to design and style the form, making it easy for users to fill out.
PHP & MySQL: Used to validate the form data and store it safely in a database.
The biggest challenge was making sure the form worked correctly and securely. I needed to check if all the data was correct and that no harmful data could be submitted. I used PHP to validate fields like phone numbers and delivery dates and made sure errors were clear for users to fix.
It helped me improve my skills in handling and validating form data securely. I learned how to use PHP to check user input and build forms that are easy to use and secure. These skills will be useful in future web projects.
In this individual project, I created a responsive navigation menu for a website that works well on both desktops and mobile devices. I used CSS techniques like flexbox for layout, media queries for responsiveness, and a hamburger menu for mobile screens. I also worked with fonts, dropdown menus, and z-index to layer elements properly.
Web Developer: Built the responsive navigation menu using flexbox, z-index, and dropdown-menu to ensure it worked on all screen sizes. I also added a hamburger menu for mobile users and styled the design with custom fonts.
HTML, CSS: Used to build the layout, dropdown menus, and manage element positioning.
JavaScript: Added interactivity to the hamburger menu for mobile devices.
Responsive Web Design: Used media queries to adjust the layout for different screen sizes.
The biggest challenge was ensuring the navigation worked well on both large and small screens. I adjusted the layout using flexbox and media queries, styled the dropdown menus, and created a functional hamburger menu for mobile. I also used z-index to manage how elements stacked on the page.
I improved my skills in responsive design and CSS layout techniques, and learned how to create multi-level navigation and a hamburger menu for mobile. These skills will be useful in future web projects.
This solo project involved creating a webpage for a fictitious site using Bootstrap’s grid system. The goal was to make a page that looks great and works well on desktops, tablets, and phones. I used Bootstrap’s grid to split the page into rows and columns, ensuring it adapts to any screen size.
Web Developer: Built the page layout using Bootstrap, organizing content into rows and columns for a responsive design across all devices.
Bootstrap Grid: Used the grid system to create a responsive layout.
HTML: Structured the basic page using HTML.
Responsive Design: Ensured the page looks good and functions well on all devices.
The main challenge was making sure the content fit and looked good on all screen sizes. I adjusted the columns to resize properly and focused on keeping the design simple and mobile-friendly.
This project taught me how to use Bootstrap's grid system to build responsive pages. I now know how to organize a page with rows and columns and ensure it works well on any device. These skills will be helpful in future web development work.
This project is a responsive website built from a design composition using Intrinsic Web Design principles. The layout adapts smoothly from mobile to desktop, with clear typography, optimized images, and well-structured content using Flexbox and Grid. The design closely matches the original composition and demonstrates solid responsive coding practices.
This project is a completed one-page dashboard that clearly presents all required information and functionality. It features a user-friendly layout with strong visual hierarchy for easy navigation and is built entirely with Tailwind CSS. The design is fully responsive, ensuring smooth performance across all devices.
Responsive and fluid. Items rearrange automatically on window resize
Integrated a Galaxy-themed Nivo slider.
This project demonstrates the use of the Google Maps JavaScript API to create interactive, dynamic maps integrated into a custom web layout. The project showcases multiple map types, custom markers, infowindows, shapes, and overlays with event-driven interactivity. All features are original and designed to provide a clean, user-friendly interface with real-world locations.