I have created some projects on my own when I was in college. I joined a coding boot camp and gained some fundamentals in web development. I also joined a company sponsored boot camp that is conducted onsite where I was able to expand my knowledge in software development as well as improve my soft skills and confidence in the workplace. As a lifelong learner, I always strive to improve my craft every single day.
This is my fullstack capstone project I made in Zuitt Coding Bootcamp. It is built using the Node.js, Express.js, React.js and MongoDB.
This is a simple landing page I have built using React TypeScript with Vite and Tailwind CSS. By building this project, I was able to practice responsive design using modern libraries and frameworks.
This is an application that allows the user to choose a particular subject and take its quiz. At the end, it shows the result to the user. This is built using React which allowed me to build the application using components. As for the styling, I used Sass which is a CSS preprocessor and the BEM methodology for writing my classes.
This project is a simple password generator app that allows you to generate a password based on the selected options. I implemented at simple generator and password strength calculation logic and it allows to copy the password to clipboard. I also customized some HTML form elements and overidden their default styling.
This project is a simple calculator that calculates the tip and total amount per person. I implemented calculations and form validation in this project and it also adapts to different screen sizes. By building this project, I was able to practice writing readable and maintainable code.
This project is a sample dashboard and its data came from a file. I implemented data fetching using JavaScript's fetch function in order to retrieve the data from a json file. By building this project, I learned how to handle asynchronous task like data fetching and implement error handlers when error occurs.
This project contains a form that you need to fill out and it will take you to a success page upon successful submission. Otherwise, it will provide helpful error messages to help you complete it. By building this project, I learned the basics of retrieving and validating form data using JavaScript.
In this project, I used JavaScript to add interactivity to a simple card component. It is used to show or hide a UI by clicking a button. By building this project, I gained some fundamentals in JavaScript and how it contributes to websites.
In this project, I have used everything that I have learned in HTML and CSS. I used Sass and BEM methodology to style my elements. I created design tokens, variables, reusable styles and used it throughout this project. I practiced my responsive layouting skills using Flexbox and CSS Grid.
In this project, I used CSS grid to create the layout for this project and made it responsive to different screen sizes. I also used Sass mixins feature to create a reusable CSS styles for each testimonials card.
In this project, I used CSS Grid to position the four cards. The grid layout is adjusted accordingly based on screen sizes. I also used semantic html to structure my content and Sass to implement styles.
In this project, I used Sass which is a CSS preprocessor. Using this tool, I was able to write shorter CSS code by nesting CSS selectors to target a specific element. I also created css variables to setup colors, fonts, etc.
This is another project I have built with HTML and CSS. This is where I practiced using semantic elements to provide meaning to the content and enhance accessiblity for search engines and users of screen readers.
This is my social links profile page built with HTML and CSS. This is where you can check all of my social media accounts and other links related to my professional career. It is also responsive and has hover effects.
This project is built using HTML and CSS with hover effect. It is also responsive in most screens especially on desktop, tablet and mobile views.
This is my sample QR Code component built with simple HTML and CSS. This will take you to a platform where you can practice your frontend development skills by building real world projects.