Clarus Store

In this project, users can view products, review their details and log in. This project was developed using React and Tailwind CSS.

Features

• User Login and Logout Management: Users can create accounts, log in and log out of their existing accounts.
• Showing Products as a List: Products are shown as a list on the home page or category pages. Users can see the names, prices and brief descriptions of the products.
• Product Detail Page: Each product has a page showing detailed information. The product detail page contains information such as product description, price and pictures.
• Search Function: Users can search for products by keywords using the search bar. Search results are updated instantly, allowing users to quickly find the products they want.
• Dynamic Pages and Routing: The application provides dynamic pages and routing using React Router. Users can seamlessly navigate to product detail pages, user account pages and other pages.
• Error Page (404 Not Found): When users try to access a page that does not exist, a 404 Not Found error page appears, providing a meaningful error message and redirect options.

Technologies

• HTML5
• CSS3
• React
• javascript
• Tailwind CSS
• React Router
• Session Stroge
• DummyJSON API

Clarus Store

Bu projede kullanıcılar ürünleri görüntüleyebilir, detaylarını inceleyebilir ve giriş yapabilirler. Bu proje, React ve Tailwind CSS kullanılarak geliştirilmiştir.

Özellikler

• Kullanıcı Giriş ve Çıkış Yönetimi: Kullanıcılar, hesap oluşturabilir, mevcut hesaplarına giriş yapabilir ve çıkış yapabilirler.
• Ürünlerin Liste Halinde Gösterilmesi: Ürünler, ana sayfada veya kategori sayfalarında liste halinde gösterilir. Kullanıcılar, ürünlerin adlarını, fiyatlarını ve kısa açıklamalarını görebilirler.
• Ürün Detay Sayfası: Her ürünün ayrıntılı bilgilerini gösteren bir sayfa bulunur. Ürün detay sayfasında, ürünün açıklaması, fiyatı, resimleri gibi bilgiler yer alır.
• Arama Fonksiyonu: Kullanıcılar, arama çubuğunu kullanarak ürünleri anahtar kelimelerle arayabilirler. Arama sonuçları anında güncellenir ve kullanıcıların istedikleri ürünleri hızlıca bulmalarını sağlar.
• Dinamik Sayfalar ve Yönlendirme: Uygulama, React Router kullanarak dinamik sayfalar ve yönlendirme sağlar. Kullanıcılar, ürün detay sayfalarına, kullanıcı hesap sayfalarına ve diğer sayfalara sorunsuz bir şekilde geçiş yapabilirler.
• Hata Sayfası (404 Not Found): Kullanıcılar, mevcut olmayan bir sayfaya erişmeye çalıştıklarında anlamlı bir hata mesajı ve yönlendirme seçenekleri sunan 404 Not Found hata sayfası görüntülenir.

Teknolojiler

• HTML5
• CSS3
• React
• Javascript
• Tailwind CSS
• React Router
• Session Stroge
• DummyJSON API

clarus.mp4

Live