modern frontend

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