Yazılım öğrenmeye başladığım günden beri tüm kaynaklarda, sosyal medya hesaplarında, online eğitimlerde ve bu işin alaylılarında gördüğüm, okuduğum ve duyduğum ilk şey “kodla, pratik yap, yazmaya çalış” oldu.
İkinci şey ise “başkalarının kodlarını oku”. Tamam da neden ve nasıl? Kod okumanın bana ne gibi bir faydası olabilir? Nereden başlanır? Kodlar kitap gibi mi okunur? Kafamda bir sürü soru. Ve işin ilginç tarafı bu yazılımın her dilinde, her framework’ünü öğrenirken de geçerli olduğu söylenen bir tavsiye. Ne öğreniyorsanız öğrenin bu tavsiyeler hiç değişmiyor. Ben de bu konunun üzerine eğilerek, araştırarak, basit kod parçacıklarından başlayarak okuya okuya -hatta bazen anlamayarak devam ettiğim de oldu- kod okuma işinde epey ilerledim.
Sonrasında gördüm ki kod okumak, yazılım dünyasında çok değerli bir beceri ve başkalarının yazdığı kodları anlamak, hem kendi projelerimde daha iyi bir yazılımcı olmama hem de ekip içinde daha etkili çalışmama yardımcı oluyor. Kod okumayı öğrenmek başlangıçta zor gibi görünüyor, bana da öyle gelmişti ama bu süreçte yaptığım şeyleri, öğrendiklerimi bira da farklı kaynaklardan alıntılayarak senin için hazırladım ve adım adım ilerleyerek bunu senin de geliştirebileceğini düşünüyorum. İşte sana detaylı bir yol haritası:
Kod Okuma Nedir ve Neden Önemlidir?
Kod okuma, başka birinin yazdığı kodu inceleyip anlamak demektir. Bu beceri sayesinde:
- Yeni teknikler ve yöntemler öğrenirsin.
- Hata ayıklama ve mevcut kodu optimize etme yeteneğin gelişir.
- Daha iyi bir yazılım geliştirici olmak için farklı bakış açıları edinirsin.
Kod okumayı öğrenmek, bir dil öğrenmeye benzer: Kelimeleri, cümleleri ve paragraf yapılarını anlamayı içerir.
Kod Okumaya Nasıl Başlanır?
Küçük ve Basit Kodlardan Başla:
Basit ve iyi belgelenmiş kod örnekleriyle başlamak en iyisidir.
GitHub’da veya kendi kullandığın teknolojinin resmi örnek projelerini incele. Örneğin, Flutter öğreniyorsan, Flutter’ın “counter” (sayaç) örnek uygulaması güzel bir başlangıç olabilir.
Kodun Amacını Anla:
Okumaya başlamadan önce kodun ne yaptığını öğren. Projenin README dosyasını veya açıklamalarını oku.
Kod bir sayfada mı çalışıyor, yoksa bir API’ye mi bağlanıyor? Bunu bilmek işini kolaylaştırır.
Parça Parça İlerleme:
Kodun tamamını bir anda anlamaya çalışmak yerine, küçük bölümlere odaklan. Örneğin, bir Flutter projesinde sadece “main.dart” dosyasına bakarak başla.
Değişkenler ve Fonksiyonlara Odaklan:
Değişken isimleri ve fonksiyonlar genelde kodun amacını açıklar. Örneğin, bir değişken totalCost
adını taşıyorsa, bunun toplam maliyetle ilgili olduğunu tahmin edebilirsin.
Açıklamaları Oku:
Yorum satırları (//
ile başlayan) ve dökümantasyon kodun mantığını anlamanda yardımcı olur. Bu açıklamalara dikkat et.
Kodun Çalışmasını İzle:
Kodun nasıl çalıştığını görmek için bir geliştirme ortamında çalıştır. Hangi kod parçalarının nasıl sonuçlar ürettiğini gözlemle.
Kod Okuma Sırasında Takip Edebileceğin Adımlar
Genel Bakış Yap:
Dosyalara hızlıca göz gezdir. Dosyaların isimlerine ve yapısına bakarak bir fikir edin.
Fonksiyonlar ve Metotlara Odaklan:
Kodun en temel işlevlerini gerçekleştiren kısımlara dikkat et. Bir uygulama kullanıcının giriş yapmasını sağlıyorsa, “login” ya da “authenticate” isimli fonksiyonlara bak.
Akışı İzle:
Programın başlangıç noktası (genellikle main
fonksiyonu) üzerinden ilerleyerek kodun akışını takip et.
Zor Gelen Kısımlarda Araştır:
Bilmediğin bir yapı, kütüphane ya da metot gördüğünde hemen araştır. Stack Overflow, GitHub veya dokümantasyon bu konuda en iyi kaynaklardır.
Sorular Sor ve Not Al:
Kod okurken “Bu neden yapılmış?”, “Bu değişken ne iş yapıyor?” gibi sorular sormak anlamanı artırır.
Kod Okuma Pratiği İçin Öneriler
Küçük Açık Kaynak Projeleri İncele:
GitHub gibi platformlardan küçük projeler bulup incele. Basit todo listeleri, sayaç uygulamaları, ya da temel web projeleri idealdir.
Kendi Projelerini Oku:
Daha önce yazdığın kodlara tekrar bak. Kendine “Bunu neden böyle yapmışım?” diye sormak da öğrenmene yardımcı olur.
Kod İncelemelerine Katıl:
Eğer bir ekipte çalışıyorsan, kod inceleme süreçlerine dahil ol. Bu süreçlerde farklı yazım stillerine ve yaklaşımlara tanık olursun.
Kod Okumayı İyileştirmek İçin Araçlar
Linter Kullanımı:
Kodun okunabilirliğini artıran araçlar (ör. Flutter için dart analyze
) kod hatalarını ve uyarılarını gösterir.
Debugging Araçları:
Kod çalışırken ne olduğunu anlamak için hata ayıklama araçlarını kullan. Bu, hangi değişkenlerin ne zaman değiştiğini görmene yardımcı olur.
Versiyon Kontrolü (Git):
Kodun geçmişine bakmak için Git kullan. Kodun önceki halleri ile şu anki hali arasındaki farkları incelemek faydalıdır.
Buraya kadar kod okumanın ne olduğu, nasıl okunabileceği, hangi adımların izlenebileceği gibi genel geçer maddeleri sıraladım. Ama ben asıl Flutter çalışmaya başladıktan sonra kod okumayı öğrenme ihtiyacı hissettim. Bu yüzden yazımın devamında Flutter özelinde kod okuma nasıl yapılır, nereden başlanır, bunlardan söz etmek istiyorum.
Flutter’da Kod Okumak
Flutter’da kod okumak başlangıçta diğer dillerde olduğundan daha zor görünüyor, bana öyle gelmişti. Bunun bir kaç sebebi var. Birincisi Flutter’ın Widget Yapısı. Flutter’da her şey bir widget’tır ve widget’lar iç içe yerleşir. İlk başta bu yapı, “Kod nerede başlıyor, nerede bitiyor?” diye düşündürebilir.
İkincisi Flutter’ın dinamikliği. Özellikle animasyon ve State management gibi özellikler kodun akışını anlamayı zorlaştırabilir.
Üçüncüsü de Flutter’ın paketleri. Birçok Flutter projesi, pubspec.yaml
dosyasındaki bağımlılıkları kullanır. Kodda gördüğün bir fonksiyon ya da widget başka bir paketten geliyor olabilir.
Bu zorlukların farkında olmak, okuma sırasında kendine karşı sabırlı olmanı sağlıyor. Bunu kendimde tecrübe ettiğim için söylüyorum. Şimdi adım adım Flutter’da kod okuma nasıl yapılır bunu inceleyelim.
Flutter Projelerinin Yapısını Tanı
Bir Flutter projesinin genel dosya yapısını anlamak kod okuma sürecini kolaylaştırır. Tipik bir proje şu şekildedir:
lib/
|- main.dart
|- screens/
|- home_screen.dart
|- settings_screen.dart
|- widgets/
|- custom_button.dart
|- models/
|- user_model.dart
İlk Adım: main.dart
Dosyasını Anlamak
main.dart
, her Flutter uygulamasının giriş noktasıdır. Kod okurken önce bu dosyayı incele:
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const HomeScreen(),
);
}
}
Bu kodu incelerken şu soruları sor:
runApp
ne yapar? (Cevap: Uygulamayı başlatır.)
MyApp
hangi widget türü? (Cevap: StatelessWidget.)
MaterialApp
içinde ne var? (Cevap: Tema, başlık ve ana ekran bilgisi.)
Flutter’da Widget Hiyerarşisini Anla
Widget hiyerarşisini anlamak, Flutter kodlarını okumanın anahtarıdır. Örneğin, Flutter’ın standart sayaç uygulamasına bakalım:
class CounterScreen extends StatefulWidget {
const CounterScreen({Key? key}) : super(key: key);
@override
_CounterScreenState createState() => _CounterScreenState();
}
class _CounterScreenState extends State<CounterScreen> {
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Counter App'),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const Text('You have pushed the button this many times:'),
Text(
'$_counter',
style: Theme.of(context).textTheme.headline4,
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Increment',
child: const Icon(Icons.add),
),
);
}
}
Bu kodu okurken şunlara dikkat et:
Scaffold
uygulamanın ana iskeletini sağlar (appBar, body, floatingActionButton).
setState
neden kullanılıyor? (Cevap: Durum değiştiğinde kullanıcı arayüzünü güncellemek için.)
Column
içindeki widget’lar nasıl düzenlenmiş? (Cevap: Dikey bir düzen içinde, mainAxisAlignment
kullanılarak merkezlenmiş.)
Kod Akışını İzle
Widget’ların nasıl çalıştığını anlamak için akışı takip et:
Başlangıç Noktası: main.dart
dosyasındaki home
widget’ını bul.
Bir Widget’tan Diğerine Git: Örneğin, HomeScreen
içinde bir buton başka bir ekrana yönlendiriyorsa, bu butonun hangi fonksiyonu çağırdığına bak.
Örnek: Navigasyon Akışını Anlamak
class HomeScreen extends StatelessWidget {
const HomeScreen({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Home'),
),
body: Center(
child: ElevatedButton(
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const SettingsScreen()),
);
},
child: const Text('Go to Settings'),
),
),
);
}
}
Navigator.push
ne yapar? (Cevap: Kullanıcıyı SettingsScreen
adlı başka bir ekrana götürür.)
Kodda geçen SettingsScreen
’i bulup incele.
Paketleri ve Kütüphaneleri Araştır
Flutter projelerinde sık sık paketler ve kütüphaneler kullanılır. Örneğin, bir proje http
paketini kullanıyorsa, kodda şunu görebilirsin:
import 'package:http/http.dart' as http;
Future<void> fetchData() async {
final response = await http.get(Uri.parse('https://api.example.com/data'));
if (response.statusCode == 200) {
print(response.body);
} else {
throw Exception('Failed to load data');
}
}
http.get
nedir ve ne yapar? Bu paket hakkında daha fazla bilgi için HTTP paketi dokümantasyonuna göz at.
Kodun çalıştığı yeri adım adım takip et ve verinin nasıl işlendiğini anlamaya çalış.
Kod Okuma Pratiği İçin İpuçları
Flutter Projelerini Çalıştır ve Deneyimle:
Kodun nasıl çalıştığını görmek için bir IDE (ör. VS Code) içinde çalıştır. Widget özelliklerini değiştir ve nasıl etkilendiğini gözlemle.
Basit Kodlar ve Widget’larla Başla:
Container
, Row
, Column
, Text
, Button
gibi temel widget’ların nasıl kullanıldığını öğren. Örneğin, bir Row
içindeki widget’ların yan yana nasıl yerleştiğini anlamak için kodu değiştir.
State Management Kodlarına Odaklan:
setState
, Provider
, veya Riverpod
gibi yapılar kodun işleyişini derinlemesine anlamana yardımcı olur.
Öneriler
Flutter Örnek Kodlarını Kullan: Flutter’ın resmi dokümantasyonunda ve GitHub’da bolca örnek var. Örneğin, Material3 Demo reposunu inceleyebilirsin.
Sorular Sorarak İlerleme Sağla: “Bu widget ne işe yarıyor?”, “Hangi kütüphane ne için kullanılmış?” gibi sorular seni derinleştirir.
Kendi Projelerini Oku: Daha önce yazdığın Flutter projelerini inceleyip “Daha iyi nasıl yapardım?” diye düşün.
Son Olarak: Sabırlı Ol!
Kod okumak, zamanla gelişen bir beceridir. İlk başta zorlanmak normaldir, ama düzenli pratikle hem hızlanır hem de anlamayı kolaylaştırırsın. Başlangıç için basit kodlarla kendine güven kazandıktan sonra, daha karmaşık projelere geçebilirsin.
Buraya kadar okuduğun için teşekkür ederim.
Selin.
Hiç yorum yok:
Yorum Gönder