19 Haziran 2018 Salı

node versiyonunu yükseltmek

Linux/macOS
Node versiyonu, "n" isimli node versiyon yönetim paketi ile güncellenebilir. Bunun için node'un halihazırda yüklü olması gerekmektedir.

İlk olarak "n" paketi global olarak yüklenir:
sudo npm install n -g
Sonrasında istenen versiyon "n <versiyon numarası>" komutuyla yüklenebilir. Bazı durumlarda admin yetkisi istenebilir. Bu durumda bu komutu "sudo" ile çalıştırmak gerekecektir. Örneğin:
sudo n 0.12.2
Son stabil versiyonu için aşağıdaki komut kullanılabilir:
sudo n stable
Son versiyonu için aşağıdaki komut kullanılabilir:
sudo n latest

Windows
Windows için node'un sitesinden istenilen versiyonun ".msi" dosyası indirilerek yeniden yükleme yapılabilir.

Kaynak:
https://stackoverflow.com/a/10076029/6593949

create-react-app ile oluşturulan projeye hot-reload özelliği eklemek

create-react-app ile oluşturulan bir projede default olarak bir hot-reload özelliği bulunuyor. Ancak tüm sayfa yenilendiği için, başlarda çok problem olmasa da, proje büyüdükçe faydalı olmaktan çıkıyor.

"index.js" dosyasında, webpack'in "module.hot" özelliğine ekleme yapılarak hot-reload özelliği işlevsel hale getirilebiliyor.



Bunun için "index.js" dosyasında aşağıdaki gibi değişiklik yapmak gerekiyor:
import React from 'react';
import ReactDOM from 'react-dom';
import './assets/index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';

ReactDOM.render(<App/>, document.getElementById('root'));

if (module.hot) {
module.hot.accept('./App', () => {
const NextApp = require('./App').default;
ReactDOM.render(<NextApp/>, document.getElementById('root'));
});
}

registerServiceWorker();
Vagrant vb. uygulamalar aracılığı ile geliştirme yaparken bu yeterli olmayabiliyor. Örneğin, geliştirme ortamı windows, kod derleme ortamı linux ise, windows tarafındaki dosya değişiklikleri, linux tarafından algılanamayabiliyor.

Bunun için ise root dizinde ".env" dosyasına aşağıdaki kodun eklenerek polling'in enable edilmesi gerekiyor. 

CHOKIDAR_USEPOLLING=true
Root dizinde bir ".env" dosyası yoksa, önce bunu oluşturmak gerekiyor.

Bu işlemler sonrasında hot-reload neredeyse sorunsuz çalışıyor. 


Kaynaklar:



27 Ağustos 2017 Pazar

create-react-app ile oluşturulmuş bir uygulamayı apache server altına deploy etmek

create-react-app tüm konfigurasyonlar ile (webpack, babel vs.) geliştirmeye hazır bir react uygulaması oluşturmaya yarar. Bunun için create-react-app global olarak yüklenmiş olmalıdır. Aşağıdaki komut ile global olarak yüklenebilir:
npm install -g create-react-app
Yükleme sonrası aşağıdaki komut ile bir react projesi oluşturulabilir:
create-react-app my-app
Bu komut içinde bulunulan bir dizinde “my-app” adında bir klasör açacak ve bizim react uygulamamızı bunun altında oluşturacaktır.


Bu dizine girip aşağıdaki komutu terminalde yazdığımızda uygulamanın local’de ayağa kalktığı görülecektir.

cd my-app
npm start


Ekran Resmi 2017-08-27 22.06.34.png


Bu uygulamayı derleyerek çıkan dosyayı Apache server altına deploy etmek istersek my-app altındaki public klasörüne aşağıdaki gibi bir “.htaccess” dosyası eklemek gerekiyor:


RewriteEngine On
RewriteBase  /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]


Eğer uygulamayı bir alt dizine deploy edeceksek package.json’a aşağıdaki satırı eklemek gerekemektedir.

"homepage": "/tstest/",
Ekran Resmi 2017-08-27 22.13.46.png


Sonrasında aşağıdaki komut ile uygulama derlenebilir:

npm run build

Bu komutun çalışması bitince my-app altında “build” klasörünün oluştuğu görülebilir.
Bunun altındaki dosyaların hepsi alınıp Apache server’da uygun yere kopyalandıktan sonra uygulamanın buradan da çalıştığı görülebilir.


Ekran Resmi 2017-08-27 22.18.21.png
Kaynaklar:





19 Şubat 2017 Pazar

Go'da değişkenler - gölgeli değişkenler (shadowed variables)

Golang’da aşağıdaki gibi değişken tanımlama yapılabilir:

var myVar int
var myVar = 5
myVar := 5

Global olarak “myVar:=5” şeklinde tanımlama yapılamaz. Derleme sırasında hata alacaktır. Yukarıdaki tanımlama şekillerinden ilk ikisinde olduğu gibi tanımlama yapılabilir.

Bir fonksiyon içinde, aynı scope içinde, tanımlanıyor ise o değişken kullanılmak zorundadır. Kullanılmadığı durumda derleme sırasında hata alacaktır.

Aynı scope içinde aynı değişken tekrardan tanımlanamaz. Aşağıdaki gibi tanımlama yapmak yanlıştır:

myVar := 5
fmt.Println(myVar)
myVar := 10

Derleme sırasında hata alacaktır.
Ancak çoklu değişken tanımlama sırasında, önceden tanımlanmış bir değişkene değer atanabilir:

myVar := 5
fmt.Println(myVar)
myVar, myOtherVar := 10, 7

Bu şekilde tanımlama yapılınca hata almayacaktır.
golang variable 

golang variable declaration


Bir fonksiyon içinde tanımlanan bir local değişken, içerideki başka bir scope’ta tekrar tanımlanabilir. Bunlara gölgeli değişkenler (shadowed variables) denir. Bu şekilde tanımlamalarda, daha iç scope’larda tanımlanan aynı değişkenler, dışarıda olanın değerini değiştirmeyecektir.

golang shadowed variables 

golang shadowed variables

8 Kasım 2016 Salı

Redux store fonksiyonları

The store binds together the three principles of redux. It holds the current applications state object. It lets you dispatch actions. When you create it, you need to specify the reducer that tells how state is updated with actions.

The store has three important methods.
The first method of store is "getState". It retrieves the current state of the redux store.
The second and the most commonly used store method is called "dispatch". And it lets you dispatch actions that changes the state of your application.
Third redux store method is called "subscribe". It lets you register a callback that the redux store will call anytime an action has been dispatched.



Store, redux’ın üç prensibini birleştirir. Uygulamanın state objesini tutar. Action’ları dispatch eder (dağıtır). Store’u oluştururken state’lerin action’larla nasıl güncelleneceği belirtilmelidir. (createStore function’ına parametre olarak reducer verilmelidir.)

Store’un 3 önemli yöntemi/metodu/fonksiyonu vardır.
İlki “getState”tir. Redux store’unun mevcuttaki state’ini getirir.
İkincisi ve en çok kullanılanı “dispatch”tir. Uygulamadaki state’leri değiştirecek action’ları dağıtır.
Üçüncüsü “subscribe”dır. Store’a bir callback ekler. Bir action çalıştığında redux store tarafında çağrılır.

ve devamındaki videolar.

Redux prensipleri

First principle of redux; everything that changes in your application including the data and the ui state is contained in a single object. we call that state or state tree. (store)

Second principle of redux is that the state tree is read only. You cannot modify or write through it.

The pure functions are the functions whose return value depends only on the values of arguments. They do not have any observable side affects. They do not modify the values passed to them.

Impure functions may call the database or the network. They may have side affects. They may operate on the DOM. They may override the values passed to them.

The third principle of redux is some functions that makes the changes on states have to be pure in redux. (Reducer must be pure.)



Redux’ın ilk prensibi, uygulama içindeki herhangi bir data olsun veya ui olsun, olan herhangi bir değişikliğinin tek bir obje içerisinde tutulmasıdır. Buna “state” veya “state tree” denir.

Redux’ın ikinci prensibi, “state”in sadece okunur olması, üzerinde herhangi bir değişiklik yapılamaması veya üzerine yazılamamasıdır.

“Pure functions (Katışıksız fonksiyonlar)” sadece aldığı parametreleri kullanarak değer dönen metotlardır. Bu fonksiyonların herhangi bir yan etkisi yoktur. Fonksiyon, kendisine geçirilen parametreleri değiştirmez.

“Impure functions (karışık fonlsiyonlar)” database’den veya network’ten bilgi çekiyor olabilir. Yan etkileri olabilir, DOM’u yönetebilir. Kendilerine geçirilen parametreleri değiştirebilirler.

Redux’ın üçüncü prensibi state’lerde değişiklik yapan fonksiyonlar “pure function” olmalı. (Reducer pure function olmalı.)


ve devamındaki videolar.

30 Ekim 2016 Pazar

Go'da sıralama işlemleri

Go programlama dilinde bir obje dizisini sıralayabilmek için sort.Interface kullanılabilir. Bu interface 3 basit metoda ihtiyaç duyar: Len, Less ve Swap


// dizideki eleman sayısını döner
Len() int
// Dizideki iki elemanı karşılaştırır. Burada karşılaştırma için // özel kod yazılır
Less(i, j int) bool
// i ve j indekslerindeki elemanların yerini değiştirir
Swap(i, j int)`

Aşağıdaki gibi bir struct tipinde elemanlar içeren bir dizi olsun.

type AboutMe struct {
       Id          int
       Name        string
       Description string
}

type AboutMeList []AboutMe

Aşağıdaki gibi bir fonksiyon ile test için geçici olarak aşağıdaki gibi data listesi oluşturulabilir.

func prepareTestData() AboutMeList {
       aboutList := make([]AboutMe, 0)
       about1 := AboutMe{}
       about1.Id = 3
       about1.Name = "Ali"
       about1.Description = "test1"
       about2 := AboutMe{}
       about2.Id = 3
       about2.Name = "Veli"
       about2.Description = "test2"
       about3 := AboutMe{}
       about3.Id = 1
       about3.Name = "Ahmet"
       about3.Description = "test3"
       about4 := AboutMe{}
       about4.Id = 4
       about4.Name = "Mehmet"
       about4.Description = "test4"
       aboutList = append(aboutList, about1)
       aboutList = append(aboutList, about2)
       aboutList = append(aboutList, about3)
       aboutList = append(aboutList, about4)
       return aboutList
}

Dizideki elemanlar id’ye göre sıralansın. Bunun için Len, Less ve Swap metotları aşağıdaki gibi düzenlenebilir:


func (aboutMe AboutMeList) Len() int {
       return len(aboutMe)
}

func (aboutMe AboutMeList) Less(i, j int) bool {
       return aboutMe[i].Id < aboutMe[j].Id
}

func (aboutMe AboutMeList) Swap(i, j int) {
       aboutMe[i], aboutMe[j] = aboutMe[j], aboutMe[i]
}

Servis çağrıldığında çalışacak handler metodu da aşağıdaki gibi yazılabilir:

func sortHandler(w http.ResponseWriter, r *http.Request) {
       about := prepareTestData()
       sort.Sort(about)
       b, err := json.Marshal(about)
       if (err != nil) {
              panic(err)
       }
       w.Write(b)
}

Main metodu:
func main() {
       http.HandleFunc("/sort", sortHandler)
       http.ListenAndServe(":8080", nil)
}


golang sort


Eğer birden fazla değere göre sıralama yapılmak istenirse, örneğin önce id sonra name gibi, Less fonksiyonu aşağıdaki gibi düzenlenebilir:

func (aboutMe AboutMeList) Less(i, j int) bool {
       if (aboutMe[i].Id < aboutMe[j].Id) {
              return true;
       }
       if (aboutMe[i].Id > aboutMe[j].Id) {
              return false;
       }
       return aboutMe[i].Name < aboutMe[j].Name
}

Go'da bir dizideki elemanların tamamında dönmek (for each)

for key, value := range myArray {
       .....
}
 

myArray --> Tamamı işlenecek olan dizi (array veya slice) 
key --> İşlenen elemanın index'i. (dizide kaçıncı eleman) 
value --> İşlenen eleman (myArray[key])

29 Ekim 2016 Cumartesi

Go’da RESTful microservice yazma

Basit bir microservice yazımı: http://www.eyupdalan.com/2016/10/goda-basit-restful-microservice-yazma.html

İhtiyaca göre daha kompleks handler’lar, function’lar da oluşturulabilir.

type AboutMe struct {
     Name        string
     Description string
}

func aboutHandler(w http.ResponseWriter, r *http.Request) {
     about := AboutMe{}
     about.Name = "eyüp dalan"
     about.Description = "software developer"

     b, err := json.Marshal(about)

     if (err != nil) {
            panic(err)
     }

     w.Write(b)
}

Örneğin yukarıdaki örnek, ilkine nazaran biraz daha kompleks.
İlk olarak bir AboutMe isimli, Name ve Desription adında iki string property’si olan bir struct tanımlanır. “aboutHandler” fonsiyonu da bu struct tipinde bir datayı json’a çevirerek servis üzerinden dönmesini sağlar. Obje json’a “json.Marshal” ile çevrilir. Bir hata oluşması durumunda hata “panic” metodu ile fırlatılır. Son olarak da oluşan json bayte array http.ResponseWriter ile response olarak dönülür.

main fonksiyonunda bu handler için yeni bir endpoint eklenir. Sonuç  olarak maşn fonksiyonu aşağıdaki gibi olur:

func main() {
    http.HandleFunc("/", handler)
    http.HandleFunc("/about", aboutHandler)
    http.ListenAndServe(":8080", nil)
}