Famous Form Validations
Article Helper ProjectA showcase project demonstrating various form management libraries integrated with validation tools. This project features Formik, React Hook Form, and React Final Form with schema-based validation using Yup and Zod.
Tech Stack:
Source:
Demo:
Konva Masking and Drawing Tool
CaseKonva Masking and Drawing Tool A web-based image manipulation tool built with React and Konva.js, allowing users to upload images, draw shapes (Brush, Lasso, Rectangle), and export masked images in PNG, JPG, or JPEG formats.
Tech Stack:
Source:
Demo:
Kelebek Falı
Official WebsiteFourSeasons is a simple React component library that animates your application with seasonal themes: Winter, Summer, Autumn, and Spring. It provides a beautiful, dynamic way to enhance your UI based on the time of year.
Tech Stack:
Demo:
Civas Hukuk
Official WebsiteFounded by co-founders Av. İsmailcan Civaş and Av. Murathan Civaş, Civaş Law & Consultancy provides top-quality legal and consultancy services to its clients and partners. With expertise spanning numerous cases and advisory matters, the firm serves clients both nationally in Turkey and internationally across the globe.
Tech Stack:
Demo:
Kamer Organizasyon
Official WebsiteFounded in 1990 in Bakırköy, Kamer Baptism, Wedding, and Funeral Organization Company opened its second branch in 2004 in Şişli-Feriköy and continues its operations to this day. Our company provides a range of services for baptisms and weddings, including church decoration, catering, music, trio bands, DJs, photography, and video recording. We also manage all processes related to funeral ceremonies in churches, as well as domestic and international funeral transportation services. With our experienced staff, we are at your service 24/7, standing by your side in both your joyful and sorrowful moments.
Tech Stack:
Demo:
Four Seasons
Npm LibraryFourSeasons is a simple React component library that animates your application with seasonal themes: Winter, Summer, Autumn, and Spring. It provides a beautiful, dynamic way to enhance your UI based on the time of year.
Tech Stack:
Source:
Demo:
Dead Pixel Detector
Tool ProjectThis is a Vue.js application for detecting dead pixels on your screen. It cycles through a series of colors in fullscreen mode to help identify any dead or stuck pixels.
Tech Stack:
Source:
Demo:
Star Wars
Listing ProjectThis project is a Star Wars-themed web application built with Nuxt.js, focusing on server-side rendering (SSR), dynamic routing, and API integration with the Star Wars API (SWAPI). It features different sections including People, Planets, Species, Starships, Vehicles, and Films. Each section provides a list of items with pagination, and users can view detailed information about each item on dedicated detail pages.
Tech Stack:
Source:
Demo:
Pokémon
Listing ProjectThis project is a simple Pokémon catalog built using Remix, focusing on server-side rendering (SSR), client-side interactions, and API integration using the PokéAPI. The application features a Pokémon listing page with pagination, search functionality, and a detailed Pokémon page that displays additional information about each Pokémon, including types, stats, abilities, and evolution chains.
Tech Stack:
Source:
Demo:
Interface Design Case
CaseFor this part of the project, your task is to code the responsive interface design provided in the Figma file. You can choose to implement it using either Tailwind CSS or Bootstrap. I chose Bootstrap for this task. I took each photo separately, which took a considerable amount of time. Although it was time-consuming, I wanted to demonstrate my ability to work meticulously, piece by piece. Alternatively, I could have taken larger photos and continued, but I preferred to work with smaller pieces to showcase my attention to detail. Regarding CSS, I decided to use a mix of custom CSS and Bootstrap to demonstrate my versatility and ability to work with various approaches.
Tech Stack:
Source:
Demo:
Quiz App Case
CaseIn this project, the primary focus was on developing a JavaScript application, specifically a Quiz App. While I used Bootstrap for the previous task to demonstrate my skills, I decided to utilize Tailwind CSS for the Quiz App to showcase my proficiency with it. Additionally, I ensured that the design is responsive across different screen sizes. As an additional feature, I created a general fetching folder. With this setup, you can perform GET, POST, PUT, and DELETE requests with just a string, and a single Axios function handles the fetching. For managing test answers, I employed Context API. While a simple useState could have sufficed for this purpose, I wanted to demonstrate my experience with state management.
Tech Stack:
Source:
Demo:
Shopation Case
CaseWelcome to the Shopation Case Study project! This project was developed as part of a frontend developer technical assessment, focusing on implementing a product listing and detail page with various features including cart management, filtering, and local storage persistence.
Tech Stack:
Source:
Demo: