|
1 |
| -# React + Vite |
| 1 | +# React + Vite Random Users and Cards |
2 | 2 |
|
3 |
| -This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. |
| 3 | +[DEMO](https://react-random-user-gamma.vercel.app/) |
4 | 4 |
|
5 |
| -Currently, two official plugins are available: |
| 5 | +Proje https://randomuser.me/ adresinde yayımlanan random user api üzerine kurulmuştur. |
6 | 6 |
|
7 |
| -- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh |
8 |
| -- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh |
| 7 | +API'a atılan istek sonucunda dönen veri ile yeni bir obje oluşturularak kullanıcılar için bir card tasarımı uygulanıp sonuçlar listelenmiştir. |
| 8 | + |
| 9 | +Projede `useEffect` ,`useState` , `axios` kütüphaneleri ve `tailwindcss` kullanılmıştır. Yapı hem web hemde mobil görünümde tasarlanmıştır. |
| 10 | + |
| 11 | +İstenilen sayı kadar `user card` (maks 99) oluşturulabilir. |
| 12 | + |
| 13 | +İstenilen bölgeye göre kullanıcılar filtrelenebilir. |
| 14 | + |
| 15 | +İstenilen cinsiyete göre kullanılar filtrelenebilir. |
| 16 | + |
| 17 | +Ayrıca ilk açılış ve filtreleme dahil olmak üzere veriler json halinde indirilebilir. |
| 18 | + |
| 19 | +Örnek veri : |
| 20 | + |
| 21 | +```json |
| 22 | +[ |
| 23 | + { |
| 24 | + "uuid": "6a7a60a0-3af6-4a14-8d5a-1a3b7e57a076", |
| 25 | + "avatar": "https://randomuser.me/api/portraits/women/95.jpg", |
| 26 | + "fullName": "Esma Gürmen", |
| 27 | + "address": "6707 Abanoz Sk, Adıyaman, Samsun, Turkey", |
| 28 | + "country": "Turkey", |
| 29 | + |
| 30 | + "phone": "(493)-429-3036", |
| 31 | + "username": "yellowfish403", |
| 32 | + "password": "RiFiMlYuQZjAYVAv" |
| 33 | + } |
| 34 | +] |
| 35 | +``` |
| 36 | + |
| 37 | +API'da çok fazla gereksiz kısım olduğu ve filtreleme ardından yeniden obje oluştura alıştırması olması için gelen verilerden yeni bir veri kümesi oluşturulduktan sonra projede gösterilmiştir. |
0 commit comments