Programcılar genellikle “Library (Kütüphane)” ve “Framework (Çerçeve)” terimlerini birbirlerinin yerine kullanırlar. Ancak bir fark var.
Hem frameworkler hem de kütüphaneler, başka programcılar tarafından yazılmış olan ve sizi satırlarca kod yazmaktan kurtaracak hayatınızı kolaylaştıracak kodlar bütünüdür.
Örneğin, String (metin) ile çalışmayı planladığınız bir programınız olduğunu varsayalım. Aşağıdaki gibi temiz kod yazmak istiyorsunuz:
function KelimeAl(str) {
const kelimeler= str.split(' ');
return kelimeler;
}
function CumleOlustur(kelimeler) {
const cumle= kelimeler.join(' ');
return cumle;
}Tebrikler! Bir kütüphane oluşturdunuz.
Frameworkler veya kütüphaneler sihirli değildir. Frameworkler ve kütüphaneler başkası tarafından yazılmış yeniden kullanılabilir koddur. Amaçları, ortak problemleri daha kolay yoldan çözmenize yardımcı olmaktır.
Ben genellikle Bir evi web geliştirme kavramları için metafor olarak kullanırım.
Bir kütüphane Ikea’ya gitmek gibidir. Zaten bir evin var, ama mobilya konusunda biraz yardıma ihtiyacın var. Sıfırdan kendi masanızı yapmak istemezsiniz. Ikea eviniz için ihtiyacınız olan veya istediğiniz mobilyaları veya renklerini seçmenizi kolaylaştırır.. Kontrol sizdedir.
Öte yandan, framework bir ev inşa etmek gibidir. Mimari ve tasarım söz konusu olduğunda, bir dizi tasarıma ve sınırlı seçeneğe sahipsiniz. Müteahhit ve plan kontrol altındadır. Ne zaman neye ihtiyacınız olduğunu size zamanı gelince söyler.
Teknik olarak farkları kontrolün ters çevrilmesidir. (Inversion Of Control)
Bir kütüphane kullanırken, uygulamanın akışından siz sorumlusunuz. Kütüphaneyi ne zaman ve nerede arayacağınızı seçiyorsunuz.Kodlar hazırdır. Bir çerçeve kullandığınızda, çerçeve akıştan sorumludur. Kodunuzu girmeniz için bazı yerler sağlar, ancak gerektiğinde girdiğiniz kodu çağırır. Yani kodların tamamını siz yazarsınız.
JQuery (kütüphane) ve Vue.js (framework) kullanarak örneklendirelim.
Bir hata olduğunda bir hata mesajı görüntülemek istediğimizi düşünün. Örneğimizde, bir düğmeye tıklayacağız ve bir hata oluştuğunu varsayacağız.
jQuery
// index.html
<html>
<head>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"
</script>
<script src="./app.js"></script>
</head>
<body>
<div id="app">
<button id="myButton">Submit</button>
</div>
</body>
</html>
// app.js
// A bunch of our own code,
// followed by calling the jQuery library
let error = false;
const errorMessage = 'An Error Occurred';
$('#myButton').on('click', () => {
error = true; // pretend some error occurs and set error = true
if (error) {
$('#app')
.append(`<p id="error">${errorMessage}</p>`);
} else {
$('#error').remove();
}
});JQuery’yi nasıl kullandığımıza dikkat edin. Programımıza nerede aramak istediğimizi söyleriz. Bu fiziksel bir kütüphaneye gitmeye ve bazı kitapları istediğimiz gibi raftan çekmeye benzer.
Bu, jQuery işlevlerinin biz onları çağırdığımızda belirli girdiler gerektirmediğini söylemek değildir, ancak jQuery’nin kendisi bu işlevlerin bir kütüphanesidir. Yetkili biziz.
Vue.js
//index.html
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="./app.js"></script>
</head>
<body>
<div id="app"></div>
</body>
</html>
const vm = new Vue({
template: `<div id="vue-example">
<button @click="checkForErrors">Submit</button>
<p v-if="error">{{ errorMessage }}</p>
</div>`,
el: '#vue-example',
data: {
error: null,
errorMessage: 'An Error Occurred',
},
methods: {
checkForErrors() {
this.error = !this.error;
},
},
});Vue ile boşlukları doldurmalıyız. Bize neye ihtiyaç duyduğunu anlatıyor ve ardından perde arkasında Vue ihtiyaç duyulduğu zaman karar veriyor. Vue, programın kontrolünü tersine çevirir. Kodumuzu Vue’ya ekliyoruz. Kontrol Vue’dedir.
Bir kütüphane ya da çerçeve olup olmadığını anlamak için kontrolün ters çevrilip çevrilmediğine bakmak yeterlidir.
Sonuç olarak
Frameworkler ve kütüphaneler, bazı genel görevleri daha az ayrıntılı bir şekilde gerçekleştirmenize yardımcı olan başkası tarafından yazılmış kodlardır.
Framework programın kontrolünü terse çevirir. Kütüphane bununla ilgilenmez. Programcılar kütüphaneleri ihtiyaç duyduklarında çağırırlar.
