Hi, I'm Loay

I Develop User-friendly / Responsive Web Applications

mountains
 

Overview.

I'm a skilled software developer with experience in TypeScript and JavaScript, and expertise in frameworks like React, Next.js, and Vue.js, I'm a quick learner and collaborate closely with clients to create efficient, scalable, and user-friendly solutions that solve real-world problems. Let's work together to bring your ideas to life!

web-development

React Developer

web-development

Vue.js Developer

web-development

Javascript Developer

 

What I have done so far

Work Experience.

GeekyAir

Frontend Developer

GeekyAir

  • Proficient in developing robust and scalable web applications using Next.js and React.js (JavaScript and TypeScript). Skilled in creating dynamic user interfaces with Tailwind CSS, PrimeReact, Material UI, and Shadcn UI, ensuring responsive and visually appealing designs.
  • Experienced in managing complex forms with React Hook Form and Formik. Proficient in integrating RESTful APIs, enabling seamless communication between frontend and backend, and ensuring efficient data handling and user interactions.
  • Adept at working with backend teams to ensure smooth integration and functionality. Strong understanding of modern web development practices, tools, and methodologies. Committed to delivering high-quality code, following best practices in UI/UX design, and continuously improving application performance and user experience.
May 2024 - Present
Creative Way Ad

Frontend Developer

Creative Way Ad

  • Designed and developed user interface components for TypeScript-based web applications using React.
  • Managed all aspects of component design, from initial concept to final testing.
  • Collaborated with cross-functional teams to ensure seamless integration of data and functionality into web applications through RESTful APIs.
  • Contributed to the creation of dynamic and responsive user interfaces, enhancing overall user experience and usability of web applications.
  • Performed field-level analyses with integration and business teams, resulting in the ability to provide better user story acceptance.
Jun 2023 - Sep 2023
ZINAD IT

Software Engineer

ZINAD IT

  • Acquired a solid foundation in database management during my internship, becoming proficient in SQL and Supabase.
  • Actively contributed to database design, optimization, and data retrieval processes, ensuring the seamless operation of web and mobile applications.
  • Developed cross-platform mobile apps using FlutterFlow, emphasizing user-friendly interfaces and best-practice mobile architecture.
Jul 2023 - Aug 2023
Information Technology Institute · ITI

React Developer

Information Technology Institute · ITI

  • Gained hands-on experience in HTML, CSS, JavaScript, ES6, and React.js through various courses offered by the institute.
  • Enhanced understanding of UX Design fundamentals and freelancing, attending talks on skills roadmap for developers.
  • Devised and implemented a cutting-edge, responsive eCommerce web application using React.js, Redux, and Context API, enabling seamless state management and application flow.
Jul 2022 - Nov 2022
 

My work

Projects.

Following projects showcases my skills and experience through real-world examples of my work. Each project is briefly described with links to code repositories and live demos in it. It reflects my ability to solve complex problems, work with different technologies, and manage projects effectively.

SkyPass Caribbean

SkyPass Caribbean

SkyPass Caribbean is a SaaS-based platform enabling users to book airport fast pass and transfer services like Arrival/Departure Fast Pass and SUV/VAN Transfers. Built with React, TypeScript, PrimeReact, and Tailwind CSS, it features dynamic pricing, real-time flight integration, and a scalable Admin Dashboard with role-based access for managing bookings, services, and multi-tenant functionality. The platform supports rescheduling, customizable booking forms, and a seamless user experience, showcasing expertise in building efficient, user-centric SaaS solutions.

#react

#vite

#typescript

#primereact

#tailwindcss

MemberPortal - MyDoGood

MemberPortal - MyDoGood

Developed a React-based platform leveraging the Context API for streamlined and efficient state management across components. Integrated with Salesforce as a backend to manage and retrieve dynamic data for both members and service providers. The platform enables members to explore, learn about, and support quality service providers that align with DoGood’s mission of promoting impactful purchasing. Since launch, DoGood has facilitated over $1 million in donations to charities and nonprofits, empowering members to make meaningful social contributions through their professional roles and purchasing decisions.

#react

#typescript

#antd

#salesforce

#GraphQL

888clients Dashboard

888clients Dashboard

Developed a scalable and performance-oriented dashboard using Next.js to manage over 100 marketing sites, optimizing content oversight and performance monitoring. The dashboard integrates with key platforms like Google Maps, Google My Business, Facebook, and Instagram, centralizing cross-platform data to streamline functionality. Hosted on AWS for enhanced scalability and reliability, the solution ensures strong performance under high traffic and usage demands.

#next.js

#react

#javascript

#primereact

#tailwindcss

#framerMotion

Happy Shop

Happy Shop

Happy-Shop is designed to deliver a seamless and engaging e-commerce experience, featuring product browsing, detailed product views, shopping cart management, and a responsive, user-friendly interface. Admins have extensive control over the platform, including adding and managing brands, categories, products, coupons, and orders, with validation and responsive design ensuring smooth operation. Users can create accounts, manage profiles and addresses, view order history, add products to favorites, and efficiently interact with the shopping cart and checkout processes. The platform supports secure user authentication and various payment options for an enhanced user experience.

#react

#vite

#javascript

#bootstrap

#nodejs

#mongodb

B2B Real Estate

B2B Real Estate

The project involves building a dual-sided e-commerce application. On the admin side, administrators can perform CRUD operations, managing products. On the client side, users can browse products, create wish lists, add items to a watchlist, shop, add to cart, and complete purchases. User authentication features like signing in and out are also implemented for a personalized experience.

#react

#vite

#typescript

#tailwindcss

#php

E-Commerce

E-Commerce

This full-stack e-commerce project is developed using React and TypeScript, integrating technologies like Chakra UI, Redux Toolkit, Formik, and React Router for seamless user interactions and efficient state management. The implementation connects the React TypeScript front end with a Strapi backend, demonstrating proficiency in backend API communication, user authentication, and role-based permissions. The outcome is a secure and engaging full-stack e-commerce experience.

#react

#vite

#typescript

#chakraUI

#strapi

Find A Coach

Find A Coach

The Find A Coach Vue App is a user-friendly platform built with Vue.js, designed to connect users with coaches. It allows coaches to register, update their profiles, and manage incoming requests from users. The app includes a request system, authentication with Firebase, and a responsive interface for seamless navigation across devices. Core technologies used include Vite, Vue Router, Vuex for state management, Tailwind CSS for styling, and Firebase Realtime Database and Authentication for backend functionality.

#vue.js

#vite

#firebase

#html

#css

#javascript

To-Do List

To-Do List

The Fullstack Next.js Todo App seamlessly integrates a frontend and backend using Next.js, React, Prisma, Clerk Authentication, and TypeScript. Users can easily manage todos with features like adding, editing, and deleting tasks—all personalized to the user's account. The tech stack includes React-Hook-Form, Tailwind CSS, Lucide React, and Moment, ensuring a secure and feature-rich todo management solution.

#next.js

#react

#typescript

#shadcnUI

#tailwindcss

#mongodb

#prisma

Oya-Clone

Oya-Clone

Oya-Clone is a Vue.js 3 web application designed to highlight the power of GSAP for building interactive animations. This project demonstrates how to create a dynamic, responsive user experience using reusable, modular components. By replicating the essential features of the original Oya platform, Oya-Clone serves as a comprehensive practice project for mastering Vue.js and advanced animation techniques.

#vue.js

#gsap

#html

#css

#javascript

Dashboard React

Dashboard React

Dashboard React is a dynamic web application built with React and Vite, designed to display data interactively across various pages such as charts, calendars, and forms. Utilizing technologies like Material UI, Nivo, FullCalendar, and Firebase, it offers a rich user experience with features like data visualization, event management, and team and contact information.

#react

#vite

#javascript

#tailwindcss

#MUI

#nivo

#FullCalendar

#firebase

Real-Estate React App

Real-Estate React App

Real-Estate React App is a responsive and user-friendly web application for browsing real estate listings, built with React and Tailwind CSS. It offers an interactive property list on the home page and a detailed property view with images, descriptions, and contact options for each listing. The app is designed to provide an optimal experience across various screen sizes, making it easy to explore properties on both mobile and desktop devices.

#react

#javascript

#tailwindcss

#react-icons

Store Web App

Store Web App

The Store Web App is a responsive eCommerce platform built with React.js and Create React App. Featuring a modern interface, it optimizes UI components using HTML, Bootstrap, and JavaScript. Seamless integration of external product data from a fake storeAPI enhances both realism and functionality, offering users a visually appealing and user-friendly online shopping experience.

#react

#javascript

#bootstrap

To-Do List React App

To-Do List React App

The Fullstack Todo List is an efficient and modern application for managing tasks, crafted with React, TypeScript, and Tailwind CSS. It offers seamless task creation, editing, and deletion, backed by a Strapi backend for secure data handling. Its responsive design ensures a smooth user experience for enhancing personal productivity.

#react

#vite

#typescript

#headlessUI

#tailwindcss

#strapi

Shopping Cart Vue App

Shopping Cart Vue App

Shopping Cart Vue App is a simple e-commerce application built with Vue.js. It allows users to browse products, add items to a shopping cart, update quantities, and view total prices. The app uses Vue Router for navigation and Vuex for state management. Ideal as a foundation for a scalable shopping cart system.

#vue.js

#html

#css

#javascript

Vscode Clone

Vscode Clone

The VSCode Clone project is a Redux Toolkit-driven endeavor, meticulously recreating the familiar Visual Studio Code interface. Seamlessly open files through the file tree, manage tabs with syntax-highlighted content, and optimize your workspace layout with the resizable panel – all enhanced by the robust state management capabilities of Redux Toolkit.

#react

#vite

#typescript

#tailwindcss

Product Cards

Product Cards

Product Cards is a dynamic and intuitive React application designed for streamlined inventory management. Developed with Vite, TypeScript, and Tailwind CSS, it offers users a fluid experience in adding, editing, and removing products. Enhanced by @heroicons/react and @headlessui/react for elegant UI components, this app is ideal for managing product details with efficiency and style.

#react

#vite

#typescript

#headlessUI

#tailwindcss

Shopping Cart

Shopping Cart

The Shopping Cart optimized with Redux Toolkit, ensures a smooth shopping journey. Effortlessly add and manage items with actions like viewing, updating quantities, and removing. Experience streamlined state management for a responsive and dynamic shopping experience.

#react

#vite

#tailwindcss

#typescript

Fitness React App

Fitness React App

Fitness React App is a responsive web application built with React, JavaScript, and Material UI, designed to help users explore and manage fitness routines. It features a clean, interactive interface for accessing exercises, tracking progress, and viewing personalized workout plans.

#react

#javascript

#MUI

Social Web App

Social Web App

The Social Web App is a responsive platform developed with HTML, CSS (Bootstrap), and JavaScript, allowing users to log in, register, create posts, and view profiles. Axios is employed for smooth server communication. The app features essential components like navigation, authentication modals, post creation and viewing, as well as alerts for notifications. With a clean and efficient design, it provides a straightforward and user-friendly experience for social interactions.

#html

#bootstrap

#javascript

Kasper

Kasper

The Kasper Art Studio Template is a dynamic HTML, CSS, and JavaScript project tailored for artistic showcases. Boasting a responsive design, it features animated sections for landing, services, portfolio, about us, statistics, skills, testimonials, pricing, and a contact form. With visually captivating elements, including image sliders powered by Swiper and enchanting scroll-triggered animations using WOW.js.

#html

#css

#javascript

Quiz App

Quiz App

The Quiz App is an engaging platform that challenges users with diverse topics through multiple-choice questions. Accessible via a web browser, participants select the correct answers and submit them to progress through the quiz. With dynamic question displays, a countdown timer, and insightful feedback, the app concludes with a comprehensive summary of the user's performance.

#html

#css

#javascript

Business

Business

The Multi-Purpose Business Template is a dynamic HTML, CSS, and JavaScript project tailored for versatile businesses. Notable features include engaging Swiper slides in the Testimonials section, creating a visually appealing display. Additionally, the AOS Animate Library is seamlessly integrated, providing smooth and captivating animations triggered on scroll. This template ensures an interactive and modern user experience.

#html

#css

#javascript

Hangman Game

Hangman Game

The Hangman Game is a classic word-guessing challenge where players aim to unveil a hidden word by guessing letters. Accessible through a web browser, the game randomly selects a word from various categories, prompting players to click on letters to decipher the word. With each incorrect guess, a dynamic hangman illustration evolves. Successfully guessing the word leads to victory while reaching 8 wrong attempts results in defeat.

#html

#css

#javascript

Agency

Agency

The Special Design template offers a dynamic HTML, CSS, and JavaScript solution for creative agencies. With its modern design and various sections like About Us, Our Skills, Gallery, and Testimonials, it delivers an immersive user experience. Noteworthy features include local storage support for personalized settings and smooth animations for enhanced engagement.

#html

#css

#javascript

Construction Company

Construction Company

Landing Page

#html

#css

Typing Speed Test Game

Typing Speed Test Game

The Typing Speed Test Game is a web-based challenge designed to elevate your typing skills. Offering various difficulty levels, including Easy, Normal, and Hard, the game prompts players to type displayed words within a set time limit. With a dynamic interface, real-time score updates, and a congratulatory finish message, this game provides an engaging way to measure and improve your typing speed.

#html

#css

#javascript

Travel Agency

Travel Agency

Landing Page

#html

#css

Dashboard

Dashboard

Landing Page

#html

#css

Blog

Blog

Landing Page

#html

#css

Memory Game

Memory Game

The Memory Game is a simple and engaging challenge where players match pairs of images related to various technologies. To play, users click the 'Start Game' button, enter their name when prompted, and the game briefly reveals all images before starting. Clicking on two blocks unveils the images, and if they match, the blocks stay flipped; otherwise, they flip back. The game continues until all pairs are successfully matched.

#html

#css

#javascript

Leon

Leon

Landing Page

#html

#css

 
Next.js

Next.js

React

React

Vue.js

Vue.js

JavaScript

JavaScript

TypeScript

TypeScript

HTML5

HTML5

CSS3

CSS3

Bootstrap

Bootstrap

Tailwind CSS

Tailwind CSS

Material UI

Material UI

Headless UI

Headless UI

Chakra UI

Chakra UI

Shadcn UI

Shadcn UI

PrimeReact

PrimeReact

Redux Toolkit

Redux Toolkit

Strapi

Strapi

Firebase

Firebase

supabase

supabase

MongoDB

MongoDB

Prisma

Prisma

Figma

Figma

Git

Git

Github

Github

 

Get in touch

Contact.