modern frontend
DESCRIPTION
Node.js, Mongo DB ve Angular JS hakkında bilgiler ve birbirleri ile REST API üzerinden iletişimleri.TRANSCRIPT
Modern
Frontend
{“author”: “cihad horuzoglu”}
● Server Side JavaScript
● V8 Engine
● Single thread
● Event Loop
● Non-Blocking I/O
● Ruby, Python ve Perl’den daha hızlı
● Çoğu kodu C ile yazıldı
● Client side’da yazılan çoğu kod nodejs sayesinde server
side’da da kullanılabiliyor
Node.js Giriş
> node server.js
V8 Engine
● Google tarafından geliştirildi
● Chrome altyapısı kullanıyor
● JavaScript’i native makina koduna çeviriyor
● Hız odaklı
● Açık kaynaklı
Single Thread
Event Loop
Blocking
Blocking vs Non-Blocking
Non Blocking
Non Blocking Event
Diğer diller
Node JS
Callback’ler
Node.js callbackleri sayesinde işlemler asenkron ve
gereksiz beklemeler olmadan çalışır.
npm nedir?
● ‘node packaged modules’ açılımı
● node ile birlikte geliyor
● modül repositorysi
● kolay bir şekilde modülünüzü paylaşabilirsiniz
● local yada global olarak modül kurabilyorsunuz
● npmjs.org repo adresi
Mongo DB Genel Bakış
● JSON objeleri ile veri saklama
● Document Oriented Data Base
(NoSQL)
● key / value mantığı ile çalışır
● key’ler stringdir
● value’lar number, string, array
yada object olabilir
Örnek JSON mongo data
Mongo DB Özellikleri
1. Esnek
2. Güçlü
3. Ölçekleme
4. Kullanım kolay
5. JavaScript üzerine inşa edildi
Kolay kullanım
Filtreleme,
çoğaltma, sıralama
ve birleştirme gibi
işlemleri kısa kodlar
yardımı ile
yapabiliyorsunuz
Kimler Kullanıyor
Angular JS Giriş
● Google tarafından geliştiriliyor
● Browser tabanlı MVC framework
● Open source
● SPA
● Angular JS 2.0 Mobile based
Neler sağlıyor?
● Directives
● $scope
● Two way data binding
● Dependecy Injection
● Services
● vs...
Web timeline...
Directives
● Extends HTML
$scope = evriything
● View ile controller’ı birbirine bağlar
● Data binding işlemlerini yapar
● Hiyerarşik bir düzene sahip
Two Way Data Binding semiallahulimenhamideh.
Model ve View arasında her bir değişimi
izleyip, iki katman arasında veri eşitleme
sağlıyor.
Dependecy Injection
● Bir yazılım mimarisi (design pattern)
● loosely coupled - gevşek bağlılık ilkesi
Services
● Kodun işçi sınıfıdır
● Birbirlerine DI ile bağlıdır
● Client-server iletişim mimarisi
● HTTP protokolüne paralel olarak geliştirildi
● Lightweight
● JSON, XML, CSV formatlarını destekliyor
REST - (REpresentational State Transfer)
Create - (POST)
Read - (GET)
Update - (PUT)
Delete - (DELETE)
domain.com/api/user/1
domain.com/weatherForecast/{state}/{city}
console.log(‘ hadi kodlayalım ’);
Teşekkürler
Kod repo: https://github.com/cihadhoruzoglu/AddressBook