all projects
BackRoads Project
The aim of the BackRoads Project is to convert an HTML and CSS web page into a functional React web page. To accomplish this objective, I have segmented the code from the index.html file into several React components. This approach is aligned with the best practices for React projects, and the project itself is relatively straightforward.
Weather App
Weather App is a mobile application that allows users to check the weather in their current location or any location they choose. The app uses Core Location to get the user's GPS data and display the weather for their current location with the user's permission. Users can also input a city name of their choice using the UITextField feature. The app features a dark-mode option, allowing users to switch between a light and dark color scheme. The Weather App also uses vector images to enhance the user interface. To get the weather data, the app makes HTTP requests with URLSession to a weather API. The app uses JSONDecorder to parse the JSON data returned by the API.
Photo gallery Canada
I recently completed a project involving HTML, CSS, and JavaScript, which resulted in a stunning photo gallery webpage. I utilized several technologies to enhance the user experience, such as duplicating slides with different angles and adding blur effects to create changing backgrounds as slides transitioned. Another noteworthy feature is the disappearing effect of the first paragraph when users swipe through the slides. Additionally, users can click on images to scale them and adjust their angles for a customized viewing experience.
Horizontal parralax css effect
I worked on an HTML/CSS/JS project that incorporated the parallax CSS effect to create the illusion of camera movement as users scroll horizontally through the webpage. During my project, I came across a library called Swiper, which offers tools to set up a smooth scrolling user experience.
Rentool
Rentool is a contactless tool rental service for individuals or groups who may need a certain tool to complete a task but do not have access to that tool. This project was developed by a team of 3 developers and 3 designers. I have used HTML, CSS, and JavaScript. I was responsible for developing the product view page and some styling of this project.
Splink
Splink is a community-based grocery-shopping mobile app, developed by a team of 5 developers and 3 designers. I was responsible for creating the Discover, Filter, and Notification sections. I have used React Native and Tailwind CSS in the frontend. In the backend, I used Node.js, Express, MongoDB, Firebase, and AWS( Amazon EC2). The biggest challenge I faced was utilizing a Flatlist from React Native for filtering events based on user input like address, shop name, address, and city.
Hppy
Hppy - This project is an employee engagement app that uses sentiment analysis on employee feedback to evaluate if it's positive or negative. Our team consisted of 4 developers and 3 designers who worked together to bring the project to life. My specific responsibilities included the creation of user-friendly forms on the frontend, and ensuring seamless integration between the frontend and backend. Utilizing my expertise in HTML, CSS, React.js, Node.js, Express, and MongoDB, I was able to contribute to the project's success. The end result was a user-friendly and effective tool.
parallax's project
I worked on an HTML/CSS/JS project that incorporated the parallax CSS effect to create the illusion of camera movement as users scroll through the webpage. During my project, I came across a library called GSAP, which offers tools like ScrollTrigger and ScrollSmoother to enhance the scrolling effect. I also calculated the size of headers depends of the size of window.
Bill Splitter
Introducing my personal project, the Bill Splitter app. This app allows users to easily divide the cost of a shared bill among multiple people. Developed using Swift and Xcode, I utilized segue identifiers to navigate between screens and transfer data efficiently. With this app, calculating each person's share of the bill has never been easier.
Focus Time
For this project developed using React Native and Expo, I leveraged the React-Native-Paper library to seamlessly incorporate various UI components such as progress bars, input text fields, and more. To ensure consistency in size and color across these elements, I created a separate file to define and manage their respective sizes, colors, and spacings.