Projects in Awesome Lists by AyoubAloui94

https://github.com/ayoubaloui94/the-wild-oasis-business-app

A cabin booking SPA build using React, React Router Dom, React Query, styled components and Supabase. The user (hotel staff) can create, edit and delete cabins, guests and bookings, check guests in and out, generate PDF invoices, etc... (Login info left in initial form state along with a sample data uploader component for demo purposes).

react react-datepicker react-pdf-renderer react-router-dom recharts single-page-app styled-components supabase tanstack-react-query vite

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/my-portfolio

Pardon the self-reference, but my portfolio site is one of my portfolio projects. It was built as a single-page-app using React and React-Router. The projects are fetched from the Github API using React-Query. I used a combo of tailwind & styled-components for the styling, EmailJs to handle the contact form and react-helmet for SEO.

axios emailjs-browser hcaptcha react react-helmet-async react-query react-router-dom styled-components tailwindcss

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/functional-weather

A weather app built using React. The user can check the weather for specific cities or use geolocation to view the weather in their current city through a reverse geocoding API. The app gives current weather conditions and params, hourly forecast (24 hours) and a 14 day forecast

create-react-app geocoding-api openmeteo-api react

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/auto-diag44

This project is a business showcase website for Auto-Diag 44, a car diagnostics and repair services company based in the Loire-Atlantique region. Built with Next.js, the site features a clean and modern design and is optimized for maximum SEO to improve search engine visibility, attract more visitors, and ultimately increase the company's sales.

app-router-nextjs nextjs14 reactjs vercel

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/the-wild-oasis-customer-app

This is a customer side version of the Wild Oasis business app built with NextJs using the app router. The user can sign up or login with their google account using next-auth, make bookings, view or update their reservations. Both this and the business app share the same database, which makes for a nice "full-stack" experience (No pun intended).

next-js nextjs-app-router nextjs14 react19 single-page-app supabase-js tailwindcss vercel

Last synced: 21 Dec 2024

https://github.com/ayoubaloui94/today-i-learned

This app is built with React and uses Supabase as a back-end to store user facts. It allows users to share facts and filter them by category. Users can also upvote or downvote a fact. Facts that get a lot of downvotes are marked as disputed.

css fullstack react supabase

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/forkify-cooking-app

This web app is built using Vanilla Javascript following the MVC pattern. Users can look up food recipes and add them to their bookmarks, which are stored in local storage. They can also add their own recipes through a POST request to the API.

parcel sass vanilla-javascript

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/react-quiz

A React Quiz app built with React (no pun intended). This was a fun little project to build while learning React. The user has to answer all questions before the timer reaches 0. The app keeps track of the score and the highest score is stored into state.

create-react-app css javascript react

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/worldwise-react-spa

This app is a SPA built with React, React Router Dom and React Leaflet for the map component. The user can use geolocation or pick a city on the map to add it to the list of cities/countries they visited along with the date of the visit and notes about what they liked about the trip. User entries are stored on Supabase.

react react-datepicker react-leaflet react-router-dom single-page-app supabase vite

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/mapty-project

This app is built using an OOP approach. Users can pick a location on the map and input their workout details. Workouts are stored in local storage and fetched upon render.

css html leaflet vanilla-javascript

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/bankist-marketing-website

This website is built with Vanilla Javascript and good old traditional CSS. Just like the name of the project implies, this is a marketing website for the bankist app (available in the list of my projects).

css html vanilla-javascript

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/bankist-app

This web app was built using vanilla Javascript. The user can log in and view their balance and transactions, send money to another user or request a loan. The user is logged out after 10 minutes. Demo accounts (user-pin): aa-1111, jd-2222, kw-3333.

css html vanilla-javascript

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/split-n-eat-app

This app is built using React. The user can add friends to the list to split the bills with and the app keeps track of the expenses and tells the user who owes them and who they owe.

react supabase vite

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/fast-react-pizza-co

This is a SPA built with React and React Router Dom that allows the user to add Pizzas to the cart and make their order. Geolocation can be used to get the user's address. The user can also track their order.

react react-redux react-router-dom redux-toolkit single-page-app tailwindcss vite

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/natours

This tour booking application is server-side rendered and relies on a RESTful API built using NodeJs, Express and Mongoose. The user can register, view available tours and book the tour of their choosing. The payment is handled through a Stripe integration. The user can also view their bookings and rate the tour.

axios esbuild express-js mongodb mongoose nodejs pug server-side-rendering stripe

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/usepopcorn

This app is built using React. It allows the user to search for movies and shows using OMDB API, the user can then rate and add said shows and movies to their watchlist, which is stored in local storage and re-fetched upon app render.

javascript localstorage react react-custom-hooks react-hooks vite

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/tagged-notes

This app is built using Typescript with React and Bootstrap. It allows users to take notes and add tags to them. The user can filter notes by tags or title. Tags and notes are stored in local storage and can be edited or deleted.

bootstrap react typescript vite

Last synced: 13 Nov 2024

https://github.com/ayoubaloui94/travel-site

This website was built with Vanilla Javascript and CSS and bundled with Webpack. It's a fictional travel agency's marketing website that I had fun responsively designing and working on.

css-modules html vanilla-javascript webpack

Last synced: 13 Nov 2024