BELAL ALFUTAYH

  • ABOUT

  • PROJECTS

Software Development Projects

Welcome to the ‘Projects’ page! Here, you’ll find a collection of my personal projects, each reflecting my skills and dedication. Feel free to explore and learn more about my work. I hope these projects give you a good sense of my capabilities. Enjoy your visit!

nextui logo

Movie App

Visit RepoVisit Website

Overview

  • This project is a comprehensive movie and TV series application, which was my first venture into building applications using Next.js. The application serves as an excellent tool for movie and TV series enthusiasts, providing them with the ability to stay updated on the latest releases and popular shows.
  • The application offers a user-friendly interface that allows users to easily navigate through a vast array of movies and TV series. It provides detailed information about each movie or series, including cast details, plot summaries, ratings, and more. Users can search for specific titles, browse by genre, or explore trending and top-rated content.
  • This project was a significant learning experience for me, providing me with valuable insights into Next.js and its capabilities. It was an exciting journey to see the application take shape, and I’m proud of the result. The knowledge and skills I gained from this project will undoubtedly be beneficial in my future endeavors in web development.

Technologies Used

NextJS

NextJS

TypeScript

TypeScript

Tailwind CSS

Tailwind CSS

NextUI

nextui logo

Marvel Memory Card Game

Visit RepoVisit Website

Overview

  • This is an interactive, Marvel-themed memory card game built with React. The game features a visually appealing interface with vibrant cards, each showcasing a unique character from the expansive Marvel Universe. Each card is adorned with a high-quality image of a Marvel character and their respective name, making the game a visual treat for all Marvel fans.
  • this is my second time creating a React app, and found the process quite enjoyable.The game looks good, and the animations add a dynamic and engaging element to the user experience. Still i believe that the game still needs a little bit more development to be more fun

Technologies Used

React

nextui logo

CV Generator

Visit RepoVisit Website

Overview

  • This is a dynamic web application designed for creating CVs. It’s user-friendly and makes the process of CV creation straightforward and enjoyable. Users can easily input their personal details, educational background, and work experience.
  • As users fill in their information, the application provides a real-time preview of the CV on the right side of the screen. This feature allows users to see exactly how their CV will look and make adjustments as needed.
  • Finally, the application has an export option. Users can download their finished CV in various formats like PDF or Word document. This makes the CV ready for use and sharing.
  • This project is a special as it marked the commencement of my exploration with React.js. It served as a stepping stone, paving the way for me to delve deeper into this powerful library. I look forward to revisiting and further developing this project, enhancing its features and functionality with the additional knowledge and experience I have gained since its inception.

Technologies Used

React

nextui logo

Weather Project

Visit RepoVisit Website

Overview

  • The project is designed to provide real-time weather information for cities worldwide. It fetches accurate data from the WeatherAPI and presents it in a user-friendly and easy-to-read format. This ensures that users can quickly understand the current weather conditions of any city they’re interested in.
  • It was the first time I ventured into fetching data from an external API, specifically the WeatherAPI.It was a challenging yet rewarding experience that expanded my skill set and opened up new possibilities for future projects

Technologies Used

Javascript

Javascript

HTML

HTML

CSS

CSS

nextui logo

Tic-Tac-Toe

Visit RepoVisit Website

Overview

  • The game is meticulously crafted to ensure that the essence of the original Tic Tac Toe is preserved while enhancing the experience with a user-friendly interface. The rules remain the same, but the digital format adds a layer of convenience and accessibility.
  • One of the key features of this game is its ability to foster interaction. Whether it’s friends looking for a quick game to pass the time, or family members seeking a friendly match, this game caters to all. It’s not just about winning; it’s about the shared moments and laughter along the way.
  • Looking back, developing this game was a joyous journey filled with learning and creativity. As I continue to grow as a developer, I look forward to enhancing this game and creating more such enjoyable experiences.

Technologies Used

Javascript

Javascript

HTML

HTML

CSS

CSS

nextui logo

Portfolio Website

Visit RepoVisit Website

Overview

  • In the Home section, I introduce myself and give you a brief overview of what to expect as you navigate through the site.
  • The Projects section is where I display my work. It’s a visual representation of my skills and capabilities, showing what I have achieved and what I can offer. Each project is presented in a way that highlights my role, the skills used, and the results achieved.
  • The About section offers a more personal look into who I am. It goes beyond just my professional skills and achievements, giving you a chance to connect with me on a more personal level.
  • This website marks my first experience using a headless CMS - ButterCMS. The experience was enriching and enjoyable. ButterCMS provided the flexibility and efficiency I needed to create a dynamic and responsive portfolio website.Creating this portfolio website is a significant step in my career. It’s not just about showcasing my work to people, but also about expressing my passion, dedication, and vision.

Technologies Used

NextJS

NextJS

TypeScript

TypeScript

Tailwind CSS

Tailwind CSS

ButterCMS

ButterCMS

NextUI

nextui logo

AI Image Analyzer Project

Visit Repo

Visit Website

Overview

  • The project is built using JavaScript for both the frontend and backend, with Express.js serving as the backend framework. HTML and CSS were used to design and style the user interface.
  • The application allows users to input an image via a URL. This image is then processed using Azure’s Computer Vision service. The service analyzes the image and returns a set of prediction tags, providing insights into the content of the image.
  • The backend, built with Express.js, handles the communication with the Azure Computer Vision service. It sends the image data to the service and receives the prediction tags. These tags are then sent to the frontend.
  • The frontend, built with JavaScript, HTML, and CSS, provides a user-friendly interface for users to upload or input their images. Once the prediction tags are received from the backend, they are displayed on the webpage, providing the user with immediate feedback on the content of their image.
  • This project was a significant part of our university course, and it was successfully completed through the collaborative efforts of our group. It was an enriching experience that allowed us to apply the theoretical knowledge gained from the course into a practical project, enhancing our understanding of Azure services and teamwork.

Technologies Used

Javascript

Javascript

HTML

HTML

CSS

CSS

nextui logo

Project Giggle Gazette API

Visit Repo

Visit Website

Overview

  • This project is the backbone of the Giggle Gazette newspaper web app, crafted with Spring Boot to provide a robust and scalable backend.
  • Built using a microservice architecture, it features three core services: User Service for managing user data and profiles, Article Service for handling news articles, and Auth Service for secure authentication and JWT token management.
  • The User Service manages user registration, login, and user profiles, ensuring a seamless user experience.
  • The Article Service powers the creation, management, and retrieval of news articles, offering a structured approach to content management.
  • The Auth Service handles secure user authentication, generating and validating JWT tokens to safeguard API endpoints.
  • Designed to integrate with the frontend of Giggle Gazette, this backend setup ensures smooth communication and data exchange between the web app and the microservices.
  • This project exemplifies the use of Spring Boot for building efficient, scalable microservices and highlights best practices in modern web development.

Technologies Used

IntelliJ IDEA

IntelliJ IDEA

Spring Boot

Spring Boot

nextui logo

Falcon 9 Data Project

Visit Repo

Visit Website

Overview

  • Key Project Phases: The points below highlight the main steps taken in the project.
  • Data Collection: Gathered data from the SpaceX API and Wikipedia through web scraping.
  • Data Wrangling: Cleaned and structured the data, adding a column to indicate launch success or failure.
  • Exploratory Data Analysis (EDA): Performed SQL queries and created visualizations to uncover key patterns.
  • Interactive Visualization: Developed dynamic visual tools using Folium maps and Plotly Dash.
  • Predictive Analysis: Built and refined classification models, with the Decision Tree model achieving the highest accuracy.

Technologies Used

SQLite

SQLite

Jupyter Notebook

Jupyter Notebook

Python

Python


Built with

NextJS

NextJS

ButterCMS

ButterCMS

NextUI

Uses

Font Awesome

Lordicon

Icons8

Source Code

bilalftaieh/Portfolio-Website

Contact

Github

Linkedin

Email

© 2024 Belal Alfutayh. All Rights Reserved.