My Projects

Netflix Clone

Netflix Clone

React.js, Next.js, NextAuth, Tailwind, MongoDB, Prisma, Zustand, Vercel

2024

Netflix Clone is a web application that replicates the functionality and design of Netflix, allowing users to browse and stream movies and TV shows.

  • ๐ŸŽฌ Movie & TV Show Browsing: Users can browse through a large library of movies and TV shows. for each transaction
  • โญ Favorites: Users can add movies and TV shows to their favorites for easy access later
  • ๐Ÿ‘คUser Profiles: Create and manage user profiles
  • ๐ŸŽฅ Video Playback Controls: Includes play, pause, skip, and volume controls
  • ๐Ÿ–ผ๏ธ Responsive Design: Adaptable interface that works on different screen sizes
  • Plane Scape

    Plane Scape

    React.js, Tailwind CSS, Material-UI, Express.js, Google Cloud Storage, Prisma, MongoDB Atlas, Google Cloud Console, React Router, Notistack, Jsonwebtoken, Vite

    2024

    Plane Scape is A web app for searching, filtering, and booking flights effortlessly.

  • ๐Ÿ›ซ User Registration & Login: Create accounts and log in
  • โœˆ๏ธ Flight Browsing: Browse through available flights with detailed information
  • ๐Ÿ” Advanced Filtering: Filter flights by airport, date, time, layovers, and direction
  • ๐Ÿ—“๏ธ Reservation Management: Users can reserve flights, with bookings listed on their flights page
  • ๐Ÿ–ผ๏ธ Responsive Design: Adaptable interface that works on different screen sizes
  • ๐Ÿ”” Notification Messages: Error and success alerts for user actions
  • LuxeLane

    LuxeLane

    HTML, CSS, JavaScript, Handlebars, Bootstrap, Express.js, SQLite

    2023

    LuxeLane is a web application that allows users to rent luxury cars.

  • ๐Ÿ”’ User registration and login
  • ๐Ÿš™ List of Luxury cars by categories
  • ๐Ÿ“… Car rental function for the desired date or time range
  • ๐Ÿ“ Users can view their orders on their personal page
  • ๐Ÿง Detailed review of luxury cars
  • ๐Ÿ› ๏ธ Admin can add, delete, and edit cars,brand,branch
  • Personal Finance Tracker

    Personal Finance Tracker

    React.js, Vite, Tailwind, Mui, Iconify, Zustand, Chart.js, React Router, PdfMake

    2024

    Personal Finance Tracker allows users to manage their expenses, visualize financial data, and generate reports.

  • ๐Ÿ’ฐ Tracking: Add expenses and income with categories, icons, and dates
  • ๐Ÿ—‚๏ธ Category Management: Create and customize tracking categories
  • ๐Ÿ’ธ Money Transfer: Send money to friends within the app
  • ๐Ÿ“ˆ Data Visualization: Use line and pie charts for financial insights
  • ๐Ÿ“„ PDF Export: Download reports summarizing expenses and income
  • ๐Ÿ“ฑ Responsive Design: Seamlessly works on all screen sizes
  • Task Guard

    Task Guard

    React.js, Vite, Material-UI, Axios, React Router, Express.js, Jsonwebtoken, Cors, Dotenv, Prisma, PostgreSQL, Docker

    2024

    This application is designed for managing tasks with varying user roles and permissions. It provides a structured approach to task management with role-based access control to ensure efficient task handling and user management.

  • ๐Ÿ—‚๏ธ Task Management: Users can create, view, edit, and delete tasks based on their role
  • ๐Ÿ‘ฅ User Role Management: Assign different roles to users with specific permissions
  • ๐Ÿ” Role-based Permissions: Control user access and actions within the application
  • Product Management

    Product Management

    React.js, Material-UI , Web Push Notifications, Express.js, Prisma, PostgreSQL, Docker, Vite

    2024

    This project is an e-commerce application with admin and user roles. Admin users can add, delete, and update products, while regular users can view the list of products and check the details of the products they like.

  • โš™๏ธ Admin users can add,delete,update products
  • ๐Ÿ“‹ Users can view the list of products
  • ๐Ÿ“ฆ Users can check the details of the products they like
  • Automotive HMI Concept

    Automotive HMI Concept

    React.js, Vite, SASS

    2022

    This project is an HMI Concept UI for an EV infotainment system.

  • ๐Ÿ”‹ Battery Status: Current battery percentage and estimated range
  • โšก Charging Info: Locations of charging stations and time to charge
  • ๐Ÿ—บ๏ธ Navigation: GPS route planning with EV-friendly paths
  • ๐ŸŒก๏ธ Climate Control: Adjust heating/cooling remotely for comfort
  • ๐ŸŽถ Infotainment System: Access music, podcasts, and vehicle settings
  • ๐Ÿ“Š Performance Metrics: Real-time energy consumption and efficiency stats
  • Real Time Chat

    Real Time Chat

    React.js, Vite, Tailwind, Express.js, Socket.io

    2024

    Realtime chat app made with ReactJS and socket.io.

  • โšก Real-Time Messaging: Instant delivery of messages using Socket.io
  • ๐Ÿ  Group Chat: Create and manage chat groups by room numbers
  • ๐Ÿ“ฑ Responsive Design: Works on both desktop and mobile devices
  • ๐Ÿ” User Authentication: Join with a username and room number
  • ๐Ÿค– Guest Usernames: If no username is provided, a random guest name is assigned
  • ๐Ÿšซ Unique Usernames: Prevents duplicate usernames in the same room
  • Contact Form

    Contact Form

    React.js, Vite, Tailwind, Express.js, Nodemailer, React Hook Form, Notistack, Express Validation

    2024

    This application allows users to submit their contact information and messages to the administrator of the page.

  • ๐Ÿ“ Users can submit their contact information and messages by filling out a form
  • ๐Ÿ“ง The submitted contact form is automatically sent to the email address specified by the site administrator
  • ๐Ÿ› ๏ธ User inputs are validated both server-side and client-side, ensuring error messages are displayed to the user if any issues arise
  • ๐Ÿ“ฌ Notifications are used to provide feedback to the user about the submission process
  • Paint App

    Paint App

    React.js, Vite, Tailwind

    2024

    This simple Paint application allows users to draw and showcase their creativity.

  • โœ๏ธ Drawing Tools : Ability to draw with various tools like pen, brush, fill, etc
  • ๐ŸŽจ Color Selection : Users can choose from different colors
  • ๐Ÿ–Œ๏ธ Brush Size Adjustment : Different brush sizes can be selected for drawing
  • ๐Ÿ’พ Save and Share : Drawings can be saved and optionally shared on social media platforms
  • Widgets

    Widgets

    JavaScript, HTML, CSS

    2024

    This project includes 9 different widgets designed to enhance user experience. Each widget serves a unique purpose and provides interactive functionalities.

  • Interactive Experience ๐ŸŽฎ: The widgets provide interactive features that allow users to perform various actions (e.g., playing piano ๐ŸŽน, spinning ๐Ÿ”„, drawing a circle ๐Ÿ”ต)
  • Dynamic and Fun Gameplay ๐ŸŽฒ๐Ÿš€: Game-based widgets like the spin ๐Ÿ”„ and circle drawing test ๐ŸŽฏ provide dynamic and entertaining experiences
  • Music and Sound Features ๐ŸŽต๐Ÿ”Š: Widgets such as the piano ๐ŸŽน and music player ๐ŸŽถ allow users to interact with music, offering sound control and a variety of notes
  • Whack A Mole

    Whack A Mole

    React.js, Vite, Tailwind CSS

    2024

    Whack A Mole is a fun arcade game that tests players' speed and reflexes. Players try to earn points by hitting the moles that pop up on the screen.

  • ๐Ÿ“ Players can earn points by quickly clicking on the moles that appear on the screen
  • โฑ๏ธ Time-limited game mode encourages fast thinking and reaction skills
  • ๐ŸŽฏ Players earn points for each successful hit; missed hits result in a point loss
  • ๐Ÿ† High scores are recorded and displayed at the end of the game
  • Card Matching

    Card Matching

    React.js, Vite, Tailwind CSS

    2024

    Card Matching is a card matching game where users try to match identical cards.

  • ๐Ÿ–ฅ๏ธ User-friendly interface
  • ๐Ÿƒ Shuffling of cards
  • ๐Ÿ† Matching and scoring system
  • Weather App

    Weather App

    React.js, Vite, Tailwind CSS, Notistack

    2024

    This React-based weather application allows users to check the current weather conditions of any desired location. The app dynamically changes background color and images based on the weather: sunny days display a sunny background with clear skies, while rainy days show a cloudy background with rain clouds.

  • ๐Ÿ–ฅ๏ธ User-friendly interface
  • ๐Ÿงฉ Component-based architecture
  • ๐ŸŒ State management and updates
  • ๐Ÿš€ Usage of React Hooks
  • ๐Ÿ”” Error notifications powered by Notistack
  • Where aesthetics &
    functionalitymeet

    Contact Me

    Say Hello!

    My Projects

    Explore Projects

    Sertaslan

    ertugrulsertaslan ยฉ2024 - Privacy Policy

    Istanbul, Turkey