NodeJS’de Pixel Pixel Resim Oluşturma

Bilen biliyor ki NodeJS ısınılası bir bir şey değil. “Şifre yanlış olunca sayfayı yenilemeden, inputbox’a renk vermek ne demek, Javascript ile web sayfası üzerinde koşan oyun yapıyorum, websoket üzerinden Coin borsaları arasında Asenkron arbitraj yaptırttırıyorum” diyecek birisi için güzel olabilir. Ama ortalama bir sunucu için Python ve Flask/Boiler/Django gibi sade ve işlevsel aksiyonlar varken node biraz maliyetli bir araç.

Hem Callback de bi nevi Senkrona zorlama değil mi sonuçta.
Netflix yapıyorsan, aynı ada 100’lerce kişi makinana bağlanıyor ve her biri uzun işlem öbekleri çalıştırıyorsa eyvallah, çok güzel. Ama orta halli ihtiyaçlar için callback cehennemlerinde beyin yakmanın alemi yok 

Node için hislerimi bi kez daha anlattığıma göre devam edebiliriz 😉

Geçen gün etasarim hocamla yorumlaşırken bir site geçmişti: Coolors.co

Çok tatlı ve güzel bir site. Klasik renk paletleri yerine Hue, Saturation ya da tek tıkla ana rengi kaybetmeden tonlarını veriyor olması da hayli kullanışlı.

 

Sitede hayli vakit geçirince, ister istemez üzerinde çalıştığım işe de bir şeyler sirayet etti 🙂

Şöyle Coolors.co tasında, öndeki her bir Rakamın değerine göre Otomatik Arka Plan Resmi oluştursak?

OMG! Çok güzel olabilir! Ama yine bir hafta+ daha atabilir :/S

Ne demişler;

Önemli olan, delin aklına taşı getirmek 🙂

Her bir Pixel’i kontrol edebileceğim bir şeyler lazımdı. Bolca ve bolca npm paketleri baktım.. Çoğunu denedim ve çoğu daha read.me sayfasındaki kodlarda bile hata verdi. Bazıları fazla lüx, bazıları da komplike geldi. Her şey göz önünde,  sade ve kullanışlı bir şey arayışıma en yakın cevabı pngjs-image kütüphanesi verdi.

Node ve nmp kurulu olduğunu varsayarsak,

npm install pngjs-image --save 
yazarak paketi indiriyoruz.

Ve başlayalım

Open’a aslında gerek yok ama biraz fantazi yapıp, resim oluştuğunda hemen bunu göstermesi için bunu da indirelim ve çağıralım.

npm install open --save 

İşin mantığında gelince, çok tatlı bir şekilde şöyle yazıyoruz:

Resmin X olarak 1. ve Y olarak 1. koordinatındaki Pixel’i
şu renk RGB(118,182,77)  yap.

Data Array’lar, Rowlar, satır sonu kontrolleri.. olmadan gayet anlaşılır ve kullanışlı.

Elimde şöyle noktalar var:

∙ ∙ ∙ ∙ ∙ ∙ ∙ ∙

Bunların her birinin yerini ve rengini söylersek istediğimiz resmi pixel pixel oluşturabiliriz 😉

∙ ∙ ∙   ∙ ∙ ∙

       

∙ ∙ ∙   ∙ ∙ ∙ 

Her pixelin (daha doğrusu pixel gurubunun) Rengini de  bahsi geçen Rakam’lara göre ayarladık mı tamamdır, hedefe gidebiliriz 😉

Mesela yukarıdaki gibi Kahve – Su yeşili – Mavi kombini yapmak istiyorsak; pixelleri şöyle ayarlayabiliriz:

Kahve Kahve Kahve Su yeşili Su yeşili Su yeşili Su yeşili  Mavi Mavi Mavi
Kahve Kahve Kahve Su yeşili Su yeşili Su yeşili Su yeşili  Mavi Mavi Mavi
Kahve Kahve Kahve Su yeşili Su yeşili Su yeşili Su yeşili  Mavi Mavi Mavi
Kahve Kahve Kahve Su yeşili Su yeşili Su yeşili Su yeşili  Mavi Mavi Mavi

yani X koordinarlarından yan yana 3-4 tane Kahve, ardından 4-5 tane Su yeşili ve 3-4 Mavi

image.setAt(1, 1, { red:214, green:189, blue:167, alpha:1000 });
image.setAt(2, 1, { red:214, green:189, blue:167, alpha:1000 });
image.setAt(3, 1, { red:214, green:189, blue:167, alpha:1000 });
image.setAt(4, 1, { red:214, green:189, blue:167, alpha:1000 });

sonra 4 defa Su Yeşili  yani: rgb(211,255,244)
image.setAt(5, 1, { red:214, green:189, blue:167, alpha:1000 });
image.setAt(6, 1, { red:211, green:255, blue:244 , alpha:1000 });
image.setAt(7, 1, { red:211, green:255, blue:244 , alpha:1000 });
image.setAt(8, 1, { red:211, green:255, blue:244 , alpha:1000 });

Dikkat:  X koordinatı 5,6,7,8 olurken Y koordinatı hala 1
yani incecik yatay bir çizgi çiziyoruz.

sonra bu yatay çizgilerden 100 tane alt alta koyarsak 100 pixel yüksekliğinde bir resim elde etmiş olacağız 😉

600×600’lük bir resimde 360.000 pixel olduğunu sanırım söylememe gerek yok ve elbette tek tek elle yazmak yerine hayalimizdeki resme göre Döngüler oluşturabilir, içine otomatik artan X değerini ve Y değerini koyabiliriz.

Benim ilk denemelerim şöyle oldu 


Görsel

openSSL echo hatası verirse

SSL’in Open SSL olabiliyor olması windows kullanıcıları açısından pek de iyi olmamış. Zira çoğu durum ya da çoğu program windowsa göre değil Linux’e göre düzenlenmiş ve anlatılmış.

Böyle bir durumda Arama-Bulma Kabiliyeti diye bir şey varsa,
(-ki bence var; ve aranacak terimleri değil, çıkacak sayfada cevap için geçmesi beklenen olası terimleri gogıllamakla gelişen bir kabileyet. tabi yanında zaman aralığı, site: title: eksi- vb.. araçlarla kombin yapmak da buna dahil-)

bu kabileyeti hakkını vererek kullanmak gerekiyor.


Önceki yazılar: HttpS openSSL NodeJS Windows, SSL Sertifikacı Sertaç’a Güven(dir)mek, Görsel


İkinci yazıdaki pek çok şey olduktan sonra ya da ilk bazı da ilk adımlar gerçeleşip sonrakiler gerçekleşmediğinde

subjectAltName = @alt_names

[alt_names]

ile ilgili sorun yaşıyor olabilirsiniz.

Ve genelde konsoldan openSSL komutları verirlen “echo” hatasıyla birlikte kendini gösterebilir.

Bu durumda komut satırına yazılacak komutları da çok uzatmayacak şekilde v3.ext dosyası oluşturmak belki çözüm olabilir.

Bi text editörü açıp içine şunları yazın ve v3.ext adıyla kayıt edin.

authorityKeyIdentifier=keyid,issuer
basicConstraints=CA:FALSE
keyUsage = digitalSignature, nonRepudiation, keyEncipherment, dataEncipherment
subjectAltName = @alt_names
[alt_names]
DNS.1 = localhost

Ardından cmd konsolda şunları yazıp enterlayın;

openssl req -new -sha256 -nodes -out server.csr -newkey rsa:2048 -keyout server.key -config cat server.csr.cnf

 

Sıra geldi az localhost için yukarıda kayıt etmiş olduğumuz v3.ext dosyasını belirerej server.crt dosyasını oluşturmaya. Bunun için yine konsolda şu kodları yazalım:

server.crtopenssl x509 -req -in server.csr -CA rootCA.pem -CAkey rootCA.key -CAcreateserial -out server.crt -days 500 -sha256 -extfile v3.ext

Önceki adımlarda girdiğimiz şifreyi istedikten sonra .crt dosyamız hazır olacak.
yani localhostumuza özel sertifika dosyamız.


Yey!.

Dosyamız var tamam da, webden istek gelen portları dinleyen programımıza da bunu söyleyelim ki,
kullanıcının tarayıcısına bunu bildirsin, karşılıklı doğrulama yapılsın ve Yeşil Kilit simgesi çıksın 😉

// Tabi bu genel mantık olarak, güvenli bir şeyler yapmaya çalıştığımız için küçük de olsa bazı nüsanslarda hata çıkması gayet olası.

var fs = require('fs')
var https = require('https')
var express = require('express')
var cOptions = {
key: fs.readFileSync('server.key'),
cert: fs.readFileSync('server.crt')
}
var app = express()
var server = https.createServer(cOptions, app).listen(443)

Bu örnekteki sunucu programımız NodeJS. O yüzden app.js ya da root için hangi ismi kullanıyorsanız o dosyaya yukarıdaki kodları eklediğinizde -ve her şey yolunda gittiyse-;

http://locolhost adresine girdiğinizde hem Kilit hem de SSL sertfikanız görünüyor olacak 😉

Hala NodeJS Sevmiyorum

Bazen bir şarkı, çoğu her yerde çalar. Sonra unutulur gider. Hatırlamaya çalışınca, tam olarak hatırlayamayız. Ancak denk geldiğinde “Aa evet.. asdf..” deriz.

 

 

 

 

Bi ara pilli network’ten ceviz.net  forumlarına çoğu yerde Ruby (on-rail) popüler olmuştu. Sonra saman alevi gibi söndü gitti.

Bir öngörüde bulunmak istiyorum:
Belli bir azınlık haricinde genel için, NodeJS de bu şarkılar ve Ruby gibi bir gün zor hatırlanacak, “dilimin ucunda” denilecek.

StakOverflow

 

@hakancelik ve @tolgahanuzun  ne der bilmiyorum ama bir de dilekte bulunmak istiyorum:
NodeJS de bu şarkılar ve Ruby gibi, kaybolup gitsin lütfen. Bir an evvel.

-Bir dilde RETURN’ün doğru zamanda çalışmama ihtimalinden bahsedilebilir mi arkadaş?
-Callback var ki ama
-Yav He he 🙂

 

Neymiş, hız için ikinci işlem, birinciden de önce çalışabilirmiş.
E ama herkes;  ikincisi normal bi şekilde birinciden sonra çalışsın diye taklalar atıyor, hem sistemi hem kendini zorlayıp duruyor.

Çok güzel bir projeye NodeJs ile başladığımız için en azından yayınlanabilir ilk beta ayağa kalkana kadar böyle devam ederiz sanırım.. Ama belli ki NodeJs ile olan ilişkimiz, önce kavga edip sonra aşık olanlara hiç benzemeyecek. İlk fırsatta yollarımızı ayıracağız.

 

Anyway…

İlk kısımlar DIY sunucular için bilindik ama yine de NodeJS ile Kendi PC’mizi Sunucu olarak kullanmak için, -farklı aşamaları da barındıran- “Türkçe notlar” tadına bir yazı nette bulunsun 😉

===========

Modem’den Port Yönlendirme yapıyoruz.

80 Nolu porta gelen istekleri
kendi PC’mizin Local IP adresine (Örn: 192.168.1.55) yönlendiriyoruz.

İsim: UzakToLocal
Lan yönetici: 192.168.1.55
Wan port: 80
Lan port: 80

modemin PC’ye otomatik olarak verdiği Yerel IP adresini öğrenmek için
Başlat > cmd > ipconfig

Local Ip’nin otomatik değişmemesi için
Ağ ayarlarından, şu IP’yi kullan denilebilir.

=================================

Herhangi bir web sitesine bağlanır gibi uzaktan bağlanmak için
Whatismyip.com benzeri bi yerden public IP adresimize bakıyoruz

diyelim 74.85.175.126

Chrome adres satırına bu ip’yi yazdığımızda
kendi PC’mizi server olarak kullanmış,
ve Sitemize [ ? ;)) ] webten ulaşmış olacağız.

=================================

Yerel IP adresimizin sabit olmasından bağımsız olarak bi şekilde Modem açılıp kapandığında Public IP adresimiz değişeceği için
ve 74.85.175.126 yerine okunabilir bir Domain girmek için

dynu.com gibi servis’e üye olup client Programını kuruyoruz.
Login oluyoruz
https://www.dynu.com/en-US/ControlPanel/DDNS
adresinden ADD’e tıklayarak
Yeni bir Dynamic DNS Service oluşturuyoruz.

örneğin:
sg.theworkpc veya gercekdomain.com

indiriğimiz program arka planda bizim her yeni ip’mizi servise bildirdiği için her seferinde IP adresi yazmak yerine

http://sg.theworkpc.com/ adresine girdiğimizde
kendi sunucumuza ulaşmış olacağız.

======

Genelde NodeJs ile localhost isteklerine cevap verirken şöyle bir dinleme yapıyoruz
.listen(3000,function(){})

//Her yer gereksiz yere gerekli kılınan callback’lerle dolu olduğu için takılmaya gerek yok.
//Müsait zamanda Node’a bilahare kızarız 🙂

Bu dinleme yerine şu şekilde dinliyoruz:

..
app.listen(80,"0.0.0.0",function(){
console.log("Dinliyorum");
});

80 nolu portu dinliyoruz ve bunun üzerinden yanıt gönderiyoruz
//ki default web/http portu bu port
// http”S” için 443

IP olarak “0.0.0.0” yazma sebebimiz ise; Node’un dışarıdan gelecek isteklere de yanıt verebilmesi için

=================================

NodeJS’nin A-senkron çalışma fanatizisi ve callback tripleri ile vakit kaybetmek istemiyorsanız // ki hiç uğraşmayın gerekirse makinaya RAM ilave edin, işinize bakın. Kaybettiğiniz zaman ya da vereceğiniz maaştan kat-kat hesaplıya gelecektir.
Ki Bottle, Flask (Django) gibi; Daha iyisini, Daha keyifli olarak sunan teknolojiler mevcut 😉


görsel

100 Satırda ŞeyterNET

IoT: Internet of Things; Şeylerin interneti demek. Yani hemen her şeyin internete bağlandığı ağın adı. Bildiğimiz internet,  bunun bir alt kümesi.

Bu tabir kullanılmaya başladığında, zannediyorum(?) ilk Intel Türkiye’nin karşılık bulma çabasıyla, herŞEYin inTERNETi sözünden yola çıkarak, Türkçeye “Şeyternet” olarak çevirmişlerdi.

Kulağa eğlenceli geldiği için şahsen ben sevmiştim. Ancak zamanla yaşan dil içinde Nesnelerin İnterneti tabiri daha çok kullanılmaya başladı ve  artık oturmuş karşılığı da sanırım bu olacak.

Bir süredir beklediğimiz siparişlerimiz geldi. Ve minik de olsa ilk Nesnelerin İnterneti projemizi yaptık.

Hem kendimi pekiştirmek için hem de Türkçe olarak açıklamalı kaynak zenginliği olması için, mevcut kaynaktaki açıklama kısımlarını genişlettim ve yeni açıklamalar ekledim.

Açık söylemek gerekirse ancak 2 Kilobayt‘lık paketlerle iletişim kurabilen bozuk para kadar cihazın, Node.js’ye 10 bastığını söyleyebilirim. // Harbiden.

Steemit’in kafası karışacak uzunlukta olduğu için, Steempress’te bu kodlara yer verince Steemit’e bozulur mu kestiremiyorum. Okuma zorluğu olursa aşağıdaki linkten murattatar.xyz üzerinden göz atabilirsiniz.

 

#define ag_adi "Telekom_Zyxel_HG13W" // wifi ağınızın adı
#define ag_sifresi "34ist1453" // wifi şifreniz 

#include <Stepper.h>  //  standart Arduino Adım Motor kütüphanesi eklenir. 

byte m; // Mototun kaç defa döneceğini m değeri ile söylüyoruz. 256'dan küçük olduğu için byte olarak
const int birTuruKacAdimlaDonecek = 360;
Stepper stepMotorumuz(birTuruKacAdimlaDonecek, 8, 9, 10, 11);


void setup()
{
  stepMotorumuz.setSpeed(100); // motor hizi

  Serial.begin(115200); // Seriport'u açıyoruz.
  // ESP modülünün baudRate değeri 115200 olduğu için bizde Seriport'u 115200 şeklinde seçiyoruz
  Serial.println("AT"); // ESP modülümüz ile bağlantı kurulup kurulmadığını kontrol ediyoruz.
  pinMode(13, OUTPUT);
  delay(3000); //ESP ile iletişim için 3 saniye bekliyoruz.

  if (Serial.find("OK")) {       // esp modülü ile bağlantıyı kurabilmişsek modül "AT" komutuna "OK" komutu ile geri dönüş yapıyor.
    Serial.println("AT+CWMODE=1"); // esp modülümüzün WiFi modunu STA şekline getiriyoruz. Bu mod ile modülümüz başka ağlara bağlanabilecek.
    delay(2000);
    String baglantiKomutu = String("AT+CWJAP=\"") + ag_ismi + "\",\"" + ag_sifresi + "\"";
    Serial.println(baglantiKomutu);
    delay(5000);
  }

  Serial.print("AT+CIPMUX=1\r\n");
  delay(200);
  Serial.print("AT+CIPSERVER=1,80\r\n");
  delay(1000);
}


void loop() {
  if (Serial.available() > 0) {
    if (Serial.find("+IPD,")) {
      String icerik = "<head> Wifi ile Kablosuz Motor ve Led Kontrolu </head>";
      icerik += "<br><a href=\" ?led=ac\"><button type='button'>LED AC</button></a> ";
      icerik += " <a href=\" ?led=kapat\"><button type='button'>LED KAPAT</button></a>";
      icerik += "<br><br><a href=\" ?aksiyon=motor\"><button type='button'>MOTOR</button></a>";

      String gonder = "AT+CIPSEND=0," + icerik.length() + "\r\n";
      Serial.print(gonder);
      delay(500);
      // CIPSEND ile ESP Sunucumuza data gönderimini başlatıyoruz.
      // AT+CIPSEND=0, 140
      // 0. iletim, 140 karekter gibi..

      Serial.println(icerik);
      // yukarıdaki HTML sayfamızı gönderiyoruz.
      // Tarayıcıda adres satına 192.168.42.13 yazdıdığımızda, ESP karşımıza bu sayfayı sunacak.

      atraksiyonlar();
      // Loop'un içinde olduğu için, Emirlerinizi bekliyoruz merkez ;) modunda sürekli çalışıyor olacak

      Serial.println("AT+CIPCLOSE=0"); // Bağlantıyı kapat

    }
  }
}


void atraksiyonlar() {

  String gelen_istek = "";
  char okunan;
  while (Serial.available() > 0) {
    okunan = Serial.read();
    gelen_istek += okunan;
  }
  // Serialden bir şey okunana kadar While dönecek, okunan değeri "gelen_istek" değişkenine atayacak

  Serial.println(gelen_istek);
  if ((gelen_istek.indexOf(":GET /?led=ac") > 1)) {
    digitalWrite(13, HIGH);
    // LED AC butonuna basıldığında adres satırı 192.168.42.13/?led=ac şeklinde olacak, yani severa GET isteği gelecek
    // bunun içinde led=ac varsa ilgili pine elektrik gönderecek, bağlı olan bileşene (bu örnekte lede) güç verecek.
  }


  if ((gelen_istek.indexOf(":GET /?led=kapat") > 1)) {
    digitalWrite(13, LOW);
    // LED AC butonuna basıldığında adres satırı 192.168.42.13/?led=kapat şeklinde olacak, yani severa GET isteği gelecek
    // bunun içinde led=ac varsa ilgili pine elektrik gönderecek, bağlı olan bileşene (bu örnekte lede) güç verecek.
  }


  if ((gelen.indexOf(":GET /?aksiyon=motor") > 1)) {
    for (m = 0; m < 20; m++) {
      stepMotorumuz.step(1 * (birTuruKacAdimlaDonecek));
      // MOTOR butonuna basıldığında adres satırı 192.168.42.13/?aksiyon=motor şeklinde olacak, yani severa GET isteği gelecek
      // bunun içinde aksiyon=motor varsa step motorumuz 20 tur dönecek.
      // ters yönde dönmesi için -1 ile çarpabilirsiniz
    }
  }


}

 


Kaynak: sametsavas55 , instructables, coeleveld
Görsel: viktak