KanaDojo かな道場

Japonca öğrenmek için estetik, minimalist ve son derece özelleştirilebilir bir platform

📖 KanaDojo Hakkında

KanaDojo, Hiragana, Katakana, Kanji ve kelime bilgisinde ustalaşmayı eğlenceli ve kolay hale getiren etkileşimli bir web tabanlı Japonca öğrenme platformudur. Estetiğe, özelleştirilebilirliğe ve etkili öğrenmeye odaklanılarak tasarlanan KanaDojo, her seviyeden Japonca öğrencisi için kapsamlı bir eğitim ortamı sunar.

İster daha yeni kana hecelerini öğrenmeye başlıyor olun, isterseniz de ileri düzey kanji ve kelimeler ile JLPT sınavlarına hazırlanıyor olun, KanaDojo akıcı, dikkat dağıtıcı öğelerden uzak sizin tercihlerinize ve öğrenme tarzınıza uyum sağlayan bir öğrenme deneyimi sunar.

✨ Öne Çıkan Özellikler

🎯 Üç Eğitim Dojosu

Kana Dojo - Hiragana ve Katakana hece sistemlerinde temel, dakuon, yoon ve yabancı ses gruplarını öğrenerek ustalaşın
Kanji Dojo - JLPT seviyelerine (N5, N4, N3, N2) göre düzenlenmiş, en önemli kanji karakterlerini öğrenin
Vocabulary Dojo - Yeterlilik seviyesine göre seçilmiş kelime koleksiyonları ile Japonca kelime bilginizi geliştirin

🎮 Dört Dinamik Oyun Modu

Her dojo, öğrenmeyi pekiştirmek için dört ilgi çekici eğitim modunu destekler:

Seçmeli - Çoktan seçmeli: Gösterilen karakter için doğru romaji/çeviriyi seçin
Tersten Seçmeli - Tersten çoktan seçmeli: Verilen romaji/çeviri için doğru karakteri seçin
Yazma - Yazı yazma: Doğru romaji/çeviriyi yazın
Tersten Yazma - Tersten yazı yazma: Doğru karakteri yazın

🎨 Kapsamlı Özelleştirme

100+ Tema - Geniş bir koleksiyondan oluşan birbirinden güzel açık ve koyu temalardan birini seçin veya rastgele tema özelliğini kullanın
28 Japon Yazı Stili - Estetik tercihinize göre çeşitli özgün Japon yazı tipleri arasından bir seçim yapın
Ses Efektleri - Açılıp kapatılabilen tatmin edici arayüz geri bildirim seslerinin keyfini çıkarın
Gösterim Seçenekleri - Seçim menüsünde Romaji/İngilizce ve Kana/Kanji gösterimleri arasında geçiş yapın
Kısa Yol Tuşları - Verimli öğrenme için klavye kısayolları (devre dışı bırakılabilir)

📊 İlerleme Takibi

Doğru/yanlış sayacı ile gerçek zamanlı geri bildirim
Motivasyonu sürdürmek için seri takibi
Öğrenim sürecinizi izlemek için istatistikler

🌐 Modern Web Deneyimi

Masaüstü, tablet ve mobil cihazlarda çalışan tamamiyle duyarlı tasarım
Kurulum gerektirmez - internet bağlantısı olan her yerde çalışın
Öğrenmeye odaklanmanızı sağlayan temiz, minimalist arayüz
Framer Motion tarafından sağlanan akıcı animasyonlar ve geçişler

🖼️ Ekran Görüntüleri

Ana Sayfa

Kanji Seçim Menüsü

Eğitim Sayfası

Özelleştirme & Temalar

🎨 Arayüz & Tasarım Felsefesi

KanaDojo, maksimum esneklikle birleştirilmiş minimalist bir estetiği benimser. Tasarım felsefesinin merkezinde şunlar yer alır:

Minimalizm Öncelikli

Dikkat dağınıklığını en aza indiren temiz arayüz
Eğitimin içeriğine odaklanın
Rahatca gezinme ve net bilgi hiyerarşisi
Amaca yönelik boşluk kullanımı

Estetik Özeleştirmeler

Yumşak pastel renklerden canlı neonlara kadar uzanan geniş tema kütüphanesi (100+ seçenek)
Hem açık ve hem de koyu modu destekler
Uzun süreli çalışma seansları sırasında göze rahat gelen, özenle seçilmiş renk paletleri
Kesintisiz tema geçişleri

Kullanıcı Deneyimi

Tatmin edici geri bildirimler sağlayan akıcı animasyonlar ve mini etkileşimler
Tüm ekran boyunlarına mükemmel uyum sağlayan duyarlı tasarım
Etkileşimler için sesli geri bildirim (isteğe bağlı)
Tüm bölümlerde tutarlı görsel dil

Japon Tipografisi

Çeşitli stilleri kapsyan 28 özgün Japon yazı tipi
Karmaşık kanji karakterlerinin düzgün gösterimi
Benzer görünen karakterler arasında net ayrım
Gerçek Japon metin örnekleriyle yazı tipi önizlemeleri

🛠️ Kullanılan Teknolojiler

KanaDojo, en iyi performans ve geliştirici deneyimi için modern web teknolojileri ile geliştirilmiştir:

Çekirdek Framework

Next.js 15 - Sunucu taraflı renderleme ve en iyi performans için App Router kullanan React framework'ü
React 19 - Eşzamanlı (concurrent) özelliklere sahip güncel React sürümü
TypeScript - Tür güvenli geliştirme

Tasarım & Arayüz

Tailwind CSS - Kullanışlılık öncekli CSS framework'ü
shadcn/ui - Yüksek kaliteli erişilebilir bileşen kütüphanesi
Framer Motion - Akıcı animasyonlar ve geçişler
Lucide React - Güzel ve tutarlı ikon kütüphanesi
FontAwesome - Ek ikon desteği

Durum Yönetimi

Zustand - Minimum başlangıç koduyla hafifletilmiş durum yönetimi
Zustand Persist - Kullanıcı tercihleri için yerel depolama kalıcılığı

Yardımcı Araçlar & Özellikler

use-sound - Ses geri bildirim sistemi
canvas-confetti - Kutlama efektleri
react-timer-hook - Zamanlayıcı işlevselliği
react-markdown - Eğitici içerikler için Markdown işleme
random-js - Kriptografik olarak güçlü rastgele sayı üretimi
clsx + tailwind-merge - Koşullu tasarım yardımcıları

Geliştirme Araçları

ESLint - Kod denetimi
next-sitemap - Otomatik site haritası oluşturma

Analitik Veriler & Performans

@vercel/analytics - Web analitiği
@vercel/speed-insights - Performans izleme

🚀 Başlangıç

Önkoşullar

Node.js 18.x veya üstü
npm 10.x veya üstü (Node.js ile birlikte gelir)

Kurulum

Depoyu klonlayın

git clone https://github.com/lingdojo/kanadojo.git
cd kanadojo

Bağımlılıkları yükleyin
```
npm install
```
Geliştirme sunucusunu çalıştırın
```
npm run dev
```
Tarayıcınızı açın http://localhost:3000 adresine gidin

Yayın Ortamı için Derleme

# Yayın ortamı için optimize edilmiş derleme oluştur
npm run build

# Yayın sunucusunu çalıştır
npm start

Diğer Komutlar

# ESLint'i çalıştır
npm run lint

# Site haritasını oluştur (derlemeden sonra otomatik olarak çalışır)
npm run postbuild

Sorun Giderme

Geliştirme süresince sorunlar ile karşılaştıysanız, şu çözümleri deneyin:

Next.js Önbelleğini Temizle

macOS/Linux:

rm -rf .next
npm run dev

Windows (PowerShell):

Remove-Item -Recurse -Force .next
npm run dev

Windows (Komut İstemi):

rmdir /s /q .next
npm run dev

Node Modüllerini Temizle ve Tekrar Yükle

macOS/Linux:

rm -rf node_modules package-lock.json
npm install

Windows (PowerShell):

Remove-Item -Recurse -Force node_modules, package-lock.json
npm install

Windows (Komut İstemi):

rmdir /s /q node_modules
del package-lock.json
npm install

Tüm Önbellekleri Temizle (Kesin Çözüm)

macOS/Linux:

rm -rf .next node_modules package-lock.json
npm cache clean --force
npm install
npm run dev

Windows (PowerShell):

Remove-Item -Recurse -Force .next, node_modules, package-lock.json
npm cache clean --force
npm install
npm run dev

Windows (Komut İstemi):

rmdir /s /q .next
rmdir /s /q node_modules
del package-lock.json
npm cache clean --force
npm install
npm run dev

Port Zaten Kullanımda

Eğer 3000 portu zaten kullanımdaysa:

macOS/Linux:

# 3000 portunu kullanmakta olan işlemi bulun
lsof -i :3000

# İşlemi sonlandırın (PID'i gerçek işlemi ID'si ile değiştirin)
kill -9 PID

Windows (PowerShell/Komut İstemi):

# 3000 portunu kullanmakta olan işlemi bulun
netstat -ano | findstr :3000

# İşlemi sonlandırın (PID'i gerçek işlemi ID'si ile değiştirin)
taskkill /PID PID /F

Veya farklı bir portta çalıştırın:

# macOS/Linux/Windows
PORT=3001 npm run dev

📁 Proje Yapısı

kanadojo/
├── app/                        # Next.js App Router sayfaları
│   ├── kana/                   # Kana dojo sayfaları
│   │   └── train/[gameMode]/   # Her oyun modu için eğitim sayfaları
│   ├── kanji/                  # Kanji dojosu sayfaları
│   │   └── train/[gameMode]/
│   ├── vocabulary/             # Kelime dojosu sayfaları
│   │   └── train/[gameMode]/
│   ├── preferences/            # Ayarlar ve özelleştirmeler sayfası
│   ├── academy/                # Eğitici içerik
│   ├── layout.tsx              # Sağlayıcılar için kök tasarım planı
│   └── page.tsx                # Ana sayfa
│
├── components/                 # React bileşenleri
│   ├── Dojo/                   # Belirli eğitime özel bileşenler
│   │   ├── Kana/               # Kana seçimi ve kartları
│   │   ├── Kanji/              # Kanji seçimi ve kartları
│   │   └── Vocab/              # Kelime seçimi ve kartları
│   ├── reusable/               # Paylaşımlı bileşenler
│   │   ├── Menu/               # Gezinme ve menü bileşenleri
│   │   └── ...                 # Yeniden kullanılabilir diğer bileşenler
│   ├── Settings/               # Tercih bileşenleri
│   └── ui/                     # shadcn/ui bileşenleri
│
├── lib/                        # Yardımcı araçlar ve fonksiyonlar
│   ├── hooks/                  # Özel React hook'ları
│   │   ├── useAudio.ts         # Sesli geri bildirim hook'ları
│   │   └── ...
│   ├── interfaces.ts           # TypeScript arayüzleri
│   └── utils.ts                # Yardımcı fonksiyonlar
│
├── i18n/                       # Çeviri yönetim sistemi
│   └── request.ts              # Çevrilmiş metin getirme yardımcısı
│
├── store/                      # Zustand durum yönetimi
│   ├── useKanaKanjiStore.ts    # Kana/Kanji seçim durumu
│   ├── useVocabStore.ts        # Vocabulary seçim durumu
│   ├── useStatsStore.ts        # İstatistikler ve ilerleme
│   └── useThemeStore.ts        # Tema ve tercihler
│
├── static/                     # Statik veri ve yapılandırma
│   ├── kana.ts                 # Kana karakter verisi
│   ├── kanji/                  # JLPT seviyesine göre Kanji verisi
│   ├── vocab/                  # Kelime verileri
│   ├── themes.ts               # Tema tanımları
│   ├── fonts.ts                # Yazı tipi yapılandırmaları
│   └── info.tsx                # Bilgilendirici içerik
│
├── translations/               # Çevrilmiş metin içeriği
│   ├── en.json                 # İngilizce metin içeriği
│   └── es.json                 # İspanyolca metin içeriği
│
├── public/                     # Sabit dosyalar
│   ├── sounds/                 # Ses dosyaları
│   └── wallpapers/             # Arka plan resimleri

Temel Kavramlar

Durum Yönetimi Akışı

Kullanıcı menü bileşenlerinde içeriği seçer
Seçimler Zustand depolarında (useKanaKanjiStore, useVocabStore) saklanır
Eğitim bileşenleri soruları oluşturmak için depolardan okur
İstatistikler useStatsStore içersinde takip edilir ve saklanır
Kullanıcı tercihleri localStorage kalıcılığı ile useThemeStore içerisinde kaydedilir

Bileşen Mimarisi

Dojo Bileşenleri: Her içerik türü için karakter/kelime seçimini yönetir
Eğitim Bileşenleri: Oyun modlarını ekranda oluşturur ve kullanıcı etkileşimini yönetir
Yeniden Kullanılabilir Bileşenleri: Paylaşımlı arayüz öğeleri (butonlar, kartlar, modallar, vb.)
Menü Bileşenleri: Gezinme, bilgi bölümleri ve dojo seçimi

Veri Organizasyonu

Kana: Türe (hiragana/katakana) ve gruplara (temel, dakuon, yoon, yabancı) göre düzenlenmiştir
Kanji: Okunuşları ve anlamları ile birlikte JLPT seviyesine (N5-N2) göre düzenlenmiştir
Vocabulary: JLPT seviyesine ve kelime türüne (isimler, fiiller vb.) göre düzenlenmiştir

Oyun Modu İmplementasyonu

Her oyun modu, aşağıdaki işlevleri yerine getiren dinamik bir yoldur (/[contentType]/train/[gameMode]):

İlgili depodan seçilen içeriği okur
Seçimden rastgele sorular üretir
Anında geri bildirim sağlar
İstatistikleri (doğru, yanlış, seri) takip eder

🤝 Katkıda Bulunma

Katkılarınızı bekliyoruz! KanaDojo, topluluk tarafından topluluk için geliştirilen açık kaynaklı bir projedir. Nasıl katkıda bulunacağınıza dair daha ayrıntılı bilgi için CONTRIBUTING.md dosyasına göz atın.

Nasıl Katkıda Bulunulur?

Depoyu çatallayın
Bir özellik dalı oluşturun (git checkout -b feature/AmazingFeature)
Değişikliklerinizi katkı olarak işleyin (git commit -m 'Add some AmazingFeature')
Dalı gönderin (git push origin feature/AmazingFeature)
Bir Birleştirme İsteği(Pull Request) açın

Geliştirme Yönergeleri

Mevcut kod stilini ve kurallarını takip edin
Tür güvenliği için TypeScript kullanın
Değişikliklerinizi kapsamlı bir şekilde test edin
Gerektiğinde dökümanları güncelleyin
Bileşenleri tek bir amaca odaklı ve yeniden kullanılabilir tutun

📄 Lisans

Bu proje AGPL 3.0 Lisansı altında lisanslanmıştır - ayrıntılar için LICENSE.md dosyasına bakın.

🙏 Teşekkürler

Japonca dil verileri ve karakter bilgileri
Harika araçlar ve kütüphaneler için açık kaynak topluluğu
KanaDojo'yu daha iyi hale getirmek için katkı katkıda bulunanlar

📞 İletişim & Bağlantılar

Web sitesi: kanadojo.com
Depo: github.com/lingdojo/kanadojo
E-posta: dev@kanadojo.com

**Dünya çapındaki Japonca öğrenenler için ❤️ ile yapılmıştır

がんばって！ (Ganbatte! - Elinden gelenin en iyisini yap!)

⬆ Başa dön

FilesExpand file tree

README.tr.md

Latest commit

History

README.tr.md

File metadata and controls

KanaDojo かな道場

📖 KanaDojo Hakkında

✨ Öne Çıkan Özellikler

🎯 Üç Eğitim Dojosu

🎮 Dört Dinamik Oyun Modu

🎨 Kapsamlı Özelleştirme

📊 İlerleme Takibi

🌐 Modern Web Deneyimi

🖼️ Ekran Görüntüleri

Ana Sayfa

Kanji Seçim Menüsü

Eğitim Sayfası

Özelleştirme & Temalar

🎨 Arayüz & Tasarım Felsefesi

Minimalizm Öncelikli

Estetik Özeleştirmeler

Kullanıcı Deneyimi

Japon Tipografisi

🛠️ Kullanılan Teknolojiler

Çekirdek Framework

Tasarım & Arayüz

Durum Yönetimi

Yardımcı Araçlar & Özellikler

Geliştirme Araçları

Analitik Veriler & Performans

🚀 Başlangıç

Önkoşullar

Kurulum

Yayın Ortamı için Derleme

Diğer Komutlar

Sorun Giderme

Next.js Önbelleğini Temizle

Node Modüllerini Temizle ve Tekrar Yükle

Tüm Önbellekleri Temizle (Kesin Çözüm)

Port Zaten Kullanımda

📁 Proje Yapısı

Temel Kavramlar

Durum Yönetimi Akışı

Bileşen Mimarisi

Veri Organizasyonu

Oyun Modu İmplementasyonu

🤝 Katkıda Bulunma

Nasıl Katkıda Bulunulur?

Geliştirme Yönergeleri

📄 Lisans

🙏 Teşekkürler

📞 İletişim & Bağlantılar