Hi 👋🏽, my name is Rita Bradley
Your trusted guide in the digital world..

The Challenge: The aim of this project was to create a straightforward and efficient packing list application. The application had to handle various user interactions, such as adding, updating, and removing items, sorting items dynamically, and tracking packing progress.

The Solution: The AFK Packing List was brought to life, utilizing the robust capabilities of React. This app is user-friendly, offering an intuitive interface where users can effortlessly manage their packing tasks.

Using the React's useState hook for state management, the app maintains a dynamic state that responds smoothly to user interactions. Users can add new items to the list, complete with a description and quantity. As each item gets packed, users can update its state, which the app then uses to sort the items dynamically by their input order, description, and packed state.

The power of this application goes beyond simple list management, though. It offers a built-in progress tracker that calculates the number of items packed and the percentage of total items packed, giving users a clear view of their packing progress at a glance.

The app also allows users to remove items from the list or clear the entire list, offering flexibility in managing their packing tasks.

The Outcome: The AFK Packing List is a testament to the power of React and effective state management. It's a perfect tool for individuals looking for an organized, efficient, and interactive way to manage their packing tasks. This project showcases how user-friendly web applications can be built to handle complex user interactions and maintain a dynamic state.

The Challenge: The goal of this project was to create a web application that uses artificial intelligence to detect faces in images. It was crucial for the app to be user-friendly and to provide accurate results quickly.

The Solution: Face Detective, a sophisticated web app, was born. Built with React, Vite, and styled using Tailwind CSS on the frontend, the application combines elegance with functionality. Users are greeted with an intuitive interface where they can effortlessly upload images.

The app’s engine room is powered by the Clarifai API, an AI powerhouse, which makes the magic happen. Once an image is uploaded, the app swiftly analyzes it, accurately pinpoints faces, and visually represents these detections to the user.

The backend, crafted with Node.js and Express, interacts with the Clarifai API and manages user data, stored in a PostgreSQL database. This not only ensures smooth app functionality but also maintains a secure environment for user data.

The Outcome: Face Detective is a perfect blend of AI and web development, providing a seamless experience for developers, students, and anyone interested in exploring facial detection technology. It showcases the potential of integrating AI with web applications and paves the way for future projects involving image processing and AI.

The Challenge: The task was to create a simple, easy-to-navigate web application that displays a pizza menu, highlighting the availability status of each pizza. The application needed to be user-friendly and responsive, adapting seamlessly to various screen sizes.

The Solution: The result was Really Good Pizza, a React application that delivers a smooth user experience in a beautifully designed package. The application is split into three main components:

• The Pizza component displays each pizza item, dynamically adjusting its appearance based on availability status. If a pizza is sold out, it is grayed out, displaying "SOLD OUT" as the price. Otherwise, the pizza's full content is displayed.

• The Menu component hosts a title, a description, and a list where each Pizza component is rendered. It fetches data from an imported file and passes the necessary information as props to the Pizza component, creating a dynamic and interactive user experience.

• The Footer component brings a simple touch of completeness to the application with some text and a button.

The application's layout is designed using CSS Grid and Flexbox, resulting in a responsive and adaptive interface that enhances the user experience.

The Outcome: Really Good Pizza perfectly demonstrates how simplicity, intuitive design, and a responsive layout can come together to create a seamless web application. It underscores the strength of React and advanced CSS techniques in creating interactive, responsive, and visually appealing web applications.