WHATSAPP
AngularJS Nedir? Nasıl Kullanılır?

AngularJS Nedir? Nasıl Kullanılır?

AngularJS, dinamik bir web uygulaması geliştirmek için kullamılan JavaScript MVC kütüphanesidir. AngularJS başlangıçta Google’da bir proje olarak başlatılmıştır. Fakat günümüzde açık kaynak olarak sunulmaktadır..

 

AngularJS tamamen HTML ve JavaScript'i temel almaktadır, bu nedenle başka bir kodlama dili öğrenmeye gerek yoktur.

 

AngularJS statik HTML'yi dinamik HTML olarak değiştirir. HTML'in yerleşik özellikler ve bileşenler ekleyerek yeteneğini genişletir ve ayrıca basit JavaScript kullanarak özel özellikler oluşturma olacağı sağlar.

 

Google, 2012’de ilk sürümü AngularJS’i resmen yayınladı ve o zamandan beri de sürdürüyor.

 

AngularJS'nin piyasaya sürülmesinden önce, dinamik sayfalar oluşturmanın başka yolları vardı. Ancak, AngularJS kadar uygun değildi.

 

AngularJS, web uygulaması geliştirmede kullanılan Model-View-Controller (MVC) mimarisini kullanır .

 

MVC şunlardan oluşur:

 

  • Model - bilgileri burada yönetilir.
  • Görünüm - bilgilerin işlenerek görüntüsü oluşturulur.
  • Denetleyici - veri girişlerini işler ve modelle bağlantı kurar.

 

Basitçe söylemek gerekirse:

 

  • AngularJS, JavaScript ve HTML'yi bağlar
  • JavaScript kullanıcı girişini kabul eder ve AngularJS'e gönderir.
  • AngularJS, HTML’yi değiştirmek için kullanılır

 

AngularJS Örneği

 

Aşağıdaki, bir metni metin kutusuna ne yazdığınıza göre değiştiren basit bir AngularJS örneğidir.

 

<!DOCTYPE html>

<html>

<head>

<script src=js/angular.js"></script>

</head>

<body ng-app>

Lütfen isminizi yazınız: <input type="text" ng-model=“isim” /> <br />

Merhaba <label ng-bind=“isim”></label>

</body>

</html>

 

Yukarıdaki örnek, ng-app, ng-model ve ng-bind gibi birkaç AngularJS ile yazılmış düz HTML kodudur.

Aynı görev, aşağıda gösterildiği gibi, daha fazla kod satırına sahip jQuery kullanılarak gerçekleştirilebilir.

 

<!DOCTYPE html>

<html>

<head>

<script src=“js/jquery-1.10.2.min.js"></script>

</head>

<body>

Lütfen isminizi yazınız: <input type="text" id=“yazi” /> <br />

Merhaba <label id=“buraya”></label>

<script>

$(document).ready( function () {

$(‘#yazi’).keyup(function () {

$(‘#buraya’).text($('#yazi').val());

});

});

</script>

</body>

</html>

 

AngularJS'in Avantajları

 

  1. Açık kaynaklıdır.
  2. Google tarafından desteklenir.
  3. Başka bir kodlama dili öğrenmeye gerek yok. Sadece saf JavaScript ve HTML.
  4. MVC tasarım modelini kullanır.
  5. Statik HTML'yi dinamik yapar.
  6. Özelleştirmesi kolaydır.
  7. Tek Sayfa Uygulamasını Destekler.
  8. REST dostu.
İlginizi çekebilir...
Instagram'a sadece 4 adımda yeni konum nasıl eklenir? Instagram'a sadece 4 adımda yeni konum nasıl eklenir?
Instagram'a şirketinizin konumunu eklemek çok önemli bir dijital pazarlama tekniğidir. Instagram yeni konum ekleme, instagrama şi...
Draw.io nedir? Diyagram Nasıl Yapılır? Draw.io nedir? Diyagram Nasıl Yapılır?
draw.io nedir?   Draw.io ücretsiz çevrimiçi diyagram çizim uygulamasıdır. Draw.io proje oluşturmak için temel ...
Türk Telekom Prime Dijital Baskı firmasına yapmış olduğumuz projeyi incelemek istemez misiniz ?