Yazılımcı Gözüyle

Yapısına bakığımızda AngularJS MVC mantığını client-side yani kullanıcı tarafında gerçekleştirebilen bir platform. Dolayısı ile form kontrolleri için ideal bir durum sunuyor. sunucu tarafına istek yapılmaksızın girilen değerler belirli ölçülerde kontrol edilebilir. HTML5 özelliği olan "required" anahtar kelimesi ile zorunlu alanlar işaretlenebilir, ve " $valid " ile giriş olup olmadığı kontrol edilebilir. NOT : Ancak unutulmaması gereken kullanıcı tarafındaki validasyonlar gerek olmasına rağmen yeter değildir, güvenlik adına sunucu tarafında kontrol gereklidir. AngularJS te input ve form calidasyonları mevcut ve hepsi "true / false" değerlerini alırlar. inoput state leri: $untouched Henüz alana dokunulmadı. $touched   Alana dokunuldu. $pristine  Henüz alan değiştirilmedi. $dirty     Alan değiştirildi. $invalid   İçerik geçerli değil. $valid     İçerik geçerli. Form a ilişkin stateler: $pristine   Hiçbir alan değiştiri...

AngularJS ile aşağıdaki direktifleri kullanarak, Kullanıcı aksiyonları için event ekleyebilirsiniz. Bu eventler standart HTML eventlerini ezmeyecek 2 si birlikte tetiklenecektir. ng-blur         ng-change       ng-click        //Mouse Event ng-copy         ng-cut          ng-dblclick     //Mouse Event ng-focus        ng-keydown      ng-keypress     ng-keyup        ng-mousedown    //Mouse Event ng-mouseenter   //Mouse Event ng-mouseleave   //Mouse Event ng-mousemove    //Mouse Event ng-mouseover    //Mouse Event ng-mouseup      //Mouse Event ng-paste        Mouse eventleri tüm HTML objelerine eklenebilir. Aşağıdaki örnekte "ng-click" ve "ng-mouseover" eventinin kullanımı, bir fonksiyonun nasıl tetikleneceği gösterilmekt...

Servisler AngularJS uygulaması ile sınırlı ve içinde erişebilir durumdaki fonksiyon ve objelerdir. AngularJS te yaklaşık 30 civarı ön tanımlı servis mevcuttur. Örnek olarak " location " servisini ele alabiliriz, bu servis mevcut sayfanın lokasyonu ile ilgili bir çok metot içerir; $location.absUrl(); ile absoluteURL bilgisine ulaşılabilir. Aslında DOM da location objesi (" window.location ") hali hazırda mevcut AngularJS servisini kullanmaya gerek yok gibi görünsede mevcut objeleri kullanmak AngularJS içinde sizi limitler, Servis ile daha rahat hareket edebilirsiniz. Özellikle güncellemelerden aktif şekilde haberdar olabilmek için servis kullanımı tercih edilmesi sağlıklıdır. $http       - http request yapmaya yarar. $timeout - belirli bir süre bekleme yaratır. ( window.setTimeout gibi) $interval - .NET teki Timer gibi, tekrarlayan işlemler sağlar. "http" Servis: Ayrıca Kendi servisinizi yaratmanız mümkündür, ayrıca daha önce gördüğümü...

Scope: HTML kısmı view olarak, JavaScript'i controller olarak düşünürsek MVC yapısında scope model olarak düşünülebilir. Mevcut deişken ve fonksiyonları barındırır ve her 2 taraftada kullanılabilir. Ancak her 2 taraf için erişimler biraz farklıdır, Aşağıdaki Örnekte görülebilir. Eğer HTML tarafında data güncellenirse, model ve controller olarak JavaScript tarafı değişimden haberdar olur. Ayrıca tüm uygulama tarafında tanımlı "rootScope" mevcuttur, Bu durumda her 2 taraftada tanımlı değişken yada fonksiyonlara erişim sağlanırken ayrıca dikkat etmek gerekir, Bu noktada öncelik her zaman daha küçük ve Özel tanımlı olan yerel scope tur. Filtreler (Filters): Datayı formatlamak, yada filtrelemek amaçlı eklenebilecek ifadelerdir.  currency  Parasal formatlama date  Tarih formatlama filter  Listeden Alt kümeyi filtreleme json  Bir objeyi JSON metni formatına dönüştürmek limitTo  Liste yada methi belli bir sayı yada uzunlukla sınırlam...

Model: Aslında daha önceden bu konudan bahsetmiştik, esasen özel bir direktif olan " ng-model" direktifinden bahsediyoruz. Bu direktif HTML objelerin (input, select, textarea) değerini uygulama datasına bağlar, bu bağlantı 2 yönlüdür, gösterim için kullanılabileceği gibi kullanıcı tarafından yapılan değişiklikleride değişkene besler. "ng-model" - Direktifi kullanılan data için " invalid, dirty, touched, error" statülerini sağlamaktadır, ve kullanıldığı objenin tipine göre aşağıdaki CSS/class ları sağlar. ng-empty ng-not-empty ng-touched ng-untouched ng-valid ng-invalid ng-dirty ng-pending ng-pristine Kontrolör (Controler): AngularJs çalışma mantığında, uygulamalar kontrolörler tarafından yönetilir. Kontrolörler standar java objeleridir ve obje constructor ile oluşturulur, ve " $scope " parametresi ile çağrılır. Bu parametre uygulama değişkenlerinin ve method larının tutulduğu objedir. Kontrolörlerin ext...

İfadeler (Expressions): AngularJS ifadeleri HTML taglari içinde '{{...}}' çiftli süslü parantezler içine yada ' ng-bing="" ' ifadesi ile kullanılabilirler. ifadeler JavaScript ifadelere benzer ve tanım, değişken yada işlemler içerebilirler. Yukarıdaki örnekte bir çarpım ifadesini AngularJS expression olarak gördük bu diğer işlemler, string ifadeler için mümkün olduğu gibi JavaScript teki şekilde JSON objesi ve/veya Array kullanmakta mümkün. Modüller (Modules): Modüller uygulamanın farklı parçaları olarak değerlendirilebilir. ileride inceleyeceğimiz Kontrolleri çalıştırabilmek adına Modül ihtiyacımız olacak. Yukarıdaki örnekte, görüleceği gibi, HTML içinde 1 uygulama tanımlandı ve 2 ayrı DIV 2 ayrı modül olarak tanımlandı, ve aynı isimlerle 2 değişken 2 farklı modül içinde farklı değerlerle oluşuruldu. Bu noktada, her DIV objesi tanımlandığı modül içindeki değerlere erişim sağladığı görülebilir. Direktifler (Directives): "ng-...

Nedir: - Öğrenmesi basit, - HTML özelliklerini genişleten, - Tek sayfa uygulamalar (SPA - Single page applications) için ideal, Bir javascript kütüphanesidir. ".js" (javascript file) olarak dağıtılır ve script tag'i ile sayfaya eklenebilir. Eklerken Online bir kaynağın kullanılmasında güncel olabilmesi adına fayda olacaktır. Örnek olarak sayfanıza aşağıdaki tag'i ekleyerek başlayabilirsiniz. < script  src ="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js" > < /script > AngularJS ile çalışabilmek için Öncelikle aşağıdaki konulara hakim olmanız gerekecek: - HTML - CSS - JavaScript HTML Eklentileri: AnglarJS HTML ortamına olan etkilerini temel olarak ng-directives ile yapar. - ng-app    : AngularJS uygulaması tanımlar. - ng-model : HTML objelerinin değerlerini uygulamaya bağlar. - ng-bind  : uygulama datalarını HMTL e bağlar. AngularJS hakkında konuşurken, basit adımlar olarak " directives, expr...

Sosyal medya paylaşımları yada kaynak araştırmalarındaki linklere dikkat, fishing olayları git gide artıyor. yanlış yönlendirmeler ve tuzaklarla dolu bir çok yöntem mevcut. Banka sayfalarının birebir kopyalarından virüslere kadar bir çok yolu deniyorlar. Şahit olduğum vakalarda herşey tuzak link yada SMS ile başlıyor.  - Öncelikle kendiniz bilerek yazmadığınız, önünüze pop-up olarak gelen hiç bir linkte finansal işlem denemeyin, şifre bilgilerinizi vermeyin yada sms ile gelen yönlendirmeleri takip etmeyin. - İşlemleri siz başlatmadığınız sürece OTP mesajlarını dikkate almayın ve hiç bir kanalda kullanmayın, paylaşmayın. Yaşanan bir örnekte, instagram üzerinden reklam linki ile kurumsal bir bankanın internet sitesini kopyalyan bir adrese yönlendirme yapılıyor, burada kampanyadan yararlanmak için login olmanız isteniyor ancak login işlemi  bir kaç defa sözde sistemsel hatalardan ötürü tekrarlanıyor, burada esas olan şeyse sahte sitede sizin girdiğiniz bilgiler ve OTP ...

Inline Fonksiyonlar: Fonksiyonların tanımlarında obje mantığı ile yaratılan değişkenler ve reserve alanlar olacaktır, buda performans ve kaynak tüketimi demek oluyor. Ancak, Lambda ifadeler aracılığı ile yazılacak kodlarda bunun önüne geçilebilir. Extension Fonksiyonları Mevcut bir sınıfı değiştirmede bu sınıfı referans olarak ekleyen bir noktada yeni bir method eklemenizi sağlayan yazım tekniği olarak düşünebiliriz. Normal şartlar altında müdahale şansınız olmayan sınıflara method eklemek için oldukça yararlı bir özellik.”infix” notasyonu ile kullanılır. Üst seviyeli fonksiyonlar: Bir fonksiyonu input alan fonksiyonlar olarak düşünülebilir. Lambda ifadeler: Üst seviye fonksiyonlar gibidir, ancak tanımlı bir fonksiyon yerine inline fonksiyon ifadesini input olarak kullanırlar.