nodejs:blocking vs nonblocking

สรุปแบบตามความเข้าใจของผม ผิดถูกก็ขอโทษด้วยนะครับ

blocking mode ก็คือการที่โปรแกรมเราอะไรสักอย่างหนึ่งแล้วจะทำงาน
  เช่น เขียน server ต้องรอรับ client ส่งข้อมูลมาแล้วถึง แล้วจะทำงานต่อไปได้
non-blocking mode ก็จะไม่รอทำงานตามลำดับไปเรื่อยๆเลย แต่จะมีการใช้ callback กลับมา
โปรแกรมฝัง server ส่วนมากก็จะ ทำได้สองแบบคือ multi-thread กับ non-blocking
แต่ nodejs ไม่สามารถทำ multi-thread  ได้แต่มันดีคือทำ  non-blocking และเป็นแบบ event drivenที่ง่าย มาดูตัวอย่างกันเลย

ตัวอย่างส่วนมากที่เค้ายกเห็นชัดเจนก็การอ่านไฟล์

อ่านไฟล์แบบ blocking : ถ้าอ่านไม่เสร็จก็ยังทำอย่างอื่นต่อไม่ได้

-สร้างไฟล์ข้อมูลมาง่ายๆ ก่อน data.txt ข้อมูลแล้วแต่เราจะใส่ทดลอง

สร้างไฟล์ js อ่านข้อมูล

อธิบายโค้ด

เรียกใช้ คลาส readfile >>>>> require เป็นการเรียกใช้คลาส

สร้าง ตัวแปรเก็บเก็บข้อมูล ใช้เมทอดอ่านไฟล์ readFileSync('ตำแหน่งไฟล์','รูปแบบข้อมูล')

แสดงข้อมูลออกมาก

สุดท้ายให้แสดงข้อความออกมา

ผลลัพธ์

ออกมาตามลำดับต้องอ่านไฟล์เสร็จก่อนแล้วค่อนแสดงข้อความ Test read file 

เราลองมาดู แบบ non blocking กันบ้าง 

อ่านไฟล์แบบ non-bloking : อ่านไฟล์ยังไม่เสร็จก็ทำงานอื่นต่อได้

ใช้ไฟล์ข้อมูลเดิมเลย data.txt

สร้างไฟล์ readdata2.js 

อธิบายโค้ด

เรียกใช้คลาส readFile เหมือนเดิม

ใช้ เมดทอด อ่านไฟล์แล้วสร้าง callback อ่านไฟล์ไม่เสร็จทำงานอื่นต่อได้

แล้วให้แสดงข้อมูลที่อ่านไฟล์

แล้วให้แสดงข้อความ Test read file

ผลลัพธ์ จะเหมือนเดิมมั้ยนะ   

  อ้าว ดันแสดงข้อความ Test read File ก่อนหละ อุส่าไว้ด้านล่างแล้วนะ

ก็อย่างที่บอกแหละครับ มันจะท่านงานแบบไม่รอให้งานหนึ่งเสร็จแต่มันจะทำงานต่ออื่นต่อเลย 

เปรียบเทียบอีกครั้ง

อีกสักตัวอย่างนึงละกัน

ลองตั้งเวลาแล้วแสดงข้อมูลออกมา

อธิบายโค้ด

ตั้งให้โปรแกรม นับถอยหลัง 5 วินาทีแล้ว แสดง hello 1 

หลังจากนั้น แสดง  hello 2

แต่ด้วยการเขียนแบบ non-blocking ทำให้แสดงข้อความ hello 2 ออกมาก่อน โดยไม่ต้องรอ 5 วินาที ของ hello 1

NodeJS:ทำความรู้จักนิดหน่อย

ขอออกตัวก่อนนะครับไม่ใช่ผู้ชำนาญอะไรแต่ อยากทำสรุปส่วนตัวและให้ผู้อื่นด้วย ผิดถูกอย่าว่ากันนะทฤษฏีอาจไม่มีมากนะครับ

Nodejs
       สรุปง่ายๆคือ library javascript ที่สามารถให้เราเขียน javascirpt บนฝั่ง server ได้
ที่ผ่านมาเราจะเขียนฝั่ง client รันบนเว็บ ก็จะมี engine V8 ของทาง  google ที่รันบนbrowserได้
ทีนี้เราจะสร้าง server side ด้วย javascritp นั่นเอง

พื้นฐานต้องรู้เรื่อง javascrpit  มาบ้าง ส่วนตัวผมก็ยังไม่เก่งเลย

ส่ิงที่ node ทำได้

• สร้าง Websocket Server
• อัพโหลดไฟล์เร็ว
• real time data app
• เขียน non-blocking ได้ง่าย
• Windows Linux Mac
• single Thread with Event loop 

ไม่สามารถทำ muti-threaded ได้

แล้วเราจะไปทำอะไรได้บ้างหละ  หลายอย่างครับ

• web application
• websocket server
• proxy server
• streaming server
• real time data app
• แล้วแต่จะเอาไปประยุกต์ละกัน ง่ายๆ ทำเป็น server แหละครับ

เมื่อไหร่จะถึงตอนลง ?

ติดตั้ง

เข้าเว็บโดยตรงเลยครับ nodejs.org 

ถ้ากด  Install เว็บจะให้โหลดอัติโนมัติ

แต่ถ้า Downloads ก็จะมี ให้เลือกหลาย os ครับ  ในเว็บก็สอนเยอะครับลองเข้าไปอ่านดูครับ

หลังจากติดตั้งเสร็จ เราเปิด command พิมพ์ node -v จะแสดง เวอร์ชั่นของ node ถ้าขึ้นแสดงว่าใช้ได้แล้วครับ

ว่าด้วยเรื่องของ npm

ตัว node จะมีตัวจัดการที่ติดมาพร้อมกันคือ  npm เป็นที่จะมาช่วยติดตั้ง packet เสริมให้ nodejs

npm install  ..............  ชื่อ packet ที่จะลงเพิ่ม

เช่นลง express 

npm remove  ............ ชื่อ packet ที่จะลบออก

npm ls ดู packet ที่ติดตั้ง

ตอนนี้เรายังไม่ใช้ packet เสริมยังไม่ต้องลงก็ได้ครับ

ทดสอบเขียนแสดงข้อความเล็กน้อย

node จะสามารถมีตัวเขียนโปรแกรมให้แล้วรันเลย คล้าย python ถ้าใครเคยเขียน พิมพ์แล้ว enter จะรันได้เลย แต่มันจะลำบากหากเขียนโค้ดเยอะ 

ในที่นี้ก็มันเขียนฝั่ง server  อย่างที่ผมเข้าใจ การแสดงค่าก็จะใช้ console.log จริงมีหลายค่า

แบบที่จะเก็บข้อมูลในserver ที่ใช้แสดงข้อความได้ ก็จะมีคำสั่ง

แต่น่าจะตามประเทภมากกว่า

เราก็เขียนเป็นไฟล์ไว้ครับ save เป็น .js 

สร้างไฟล์  test.js

เวลารัน เราต้องอยู่ที่ path ไฟล์ที่เก็บด้วยนะ ของผมอยู่ใน folder node

จะรับก็พิมพ์ node ตามด้วยชื่อไฟล์ของเรา    >>> node test.js  

สร้าง server

ต่อไปลงสร้าง server อย่างง่ายดีกว่า เด๊วบอกว่าเขียน server แล้วไหนละ server

สร้างไฟล์ testserver.js
ตัวอย่างโค้ด

1. สร้างตัวประเรียกใช้ http 
2. สร้าง servev แบบเรียกใช้ non-blocking (เด๊วจะอธิบายบทความหน้าให้เห็นความเท่ของ nodejs             non-blocking ง่ายขึ้น)
3. ตั้ง status code 200 ก็แบบเว็บ 200 ok
4. ใส่ body ข้อความจะแสดงเมื่อ client เชื่อมต่อเข้ามา
5. ปิดการทำงาน
6. รับการเชื่อมต่อ port 8080 แล้วแสดงข้อความ

รัน ไฟล์ได้เลย สอนรันไปแล้วนะครับ

ต่อไปลองเข้า จาก browser 127.0.0.1:8080

หรือจะลองใช้คำสั่งเข้าก็ได้นะ  คำสั่งเข้าเว็บ curl http://127.0.0.1:8080

รู้เรื่องบ้างไม่รู้เรื่องบ้าง ต้องขออภัยด้วยครับ ^___^

การใช้ JSON ใน android เบื้องต้น สุดๆ

เริ่มต้นการใช้ JSON ใน Android

บทความนี้จะไม่อธิบายว่า JSON ไว้ใช้ทำอะไร หลายๆคนคงรู้อยู่แล้วครับ สรุปสั้นๆไว้รับส่งข้อมูลรูปแบบนึง
JSON เก็บได้หลายรูปแบบ ทั้ง object string และ objectArray
>>การแปลง ข้อมูลที่เป็น JSON  มาใช้งาน
ตัวอย่างข้อมูลที่เป็น JSON  แบบมิติเดียว

{"name":"wachira"}
เก็บในรูปแบบตัวแปร
String js = "{\"name\": \"wachira\"}";

สร้าง Object จาก string
 JSONObject jsob = new JSONObject(js);

แล้วก็เรียกใช้json ที่เป็น string
String myname = jsob.getString("name");

ตัวอย่างการใช้งานเต็มๆ ไฟล์ ของ MainActivity.java

ส่วนหน้า desinge ผมเอา Textveiw มาลองแสดงค่าดูครับ

ลองรันดูครับ

ขอติดเรื่อง json  แบบ objectArray ไว้ก่อน ครับเด๊วจะมาแก้ไขเพิ่ม

เริ่มต้นการใช้ google map api v2 บน android studio

เริ่มใช้ GOOGLE MAP API V2 แบบเริ่มต้นสุดๆ

ให้สร้างโปรเจคขึ้นมาใหม่ แบบทั่วไปขอไม่อธิบายอะไร
ก่อนอื่นเราต้องติดตั้ง Google Play services APIs ในส่วนของที่เราลง SDK ครับ

 หลังจากนั้นให้เปิดไฟล์ build.gradle  เพื่ิมเพิ่มการเรียกใช้ google play serivce 

ให้หา tag dependencies แล้วเพิ่ม โค้ด เข้าไป ในที่นี้ขึ้นตัวเลขของ play-services ขึ้นอยู่กับ version ที่ใช้นะครับ

เสร็จแล้วบันทึกแล้วกดปุ่ม Sync Project with Gradle Files ที่เครื่องมือข้างบน  

ลำดับต่อเป็นเราต้องหา  certificate fingerprint key จากเครื่งของเราเสียก่อน ในแต่ละเครื่องจะใช้ไม่เหมือนกัน ต้องใช้ค่า SHA1 
-สำหรับ Linux หรือ Mac เปิด terminal แล้วพิมพ์คำสั่ง ตามด้านล่างแล้วจะได้ค่า SHA 1
keytool -list -v -keystore ~/.android/debug.keystore -alias androiddebugkey -storepass android -keypass android
- สำหรับ window เปิด command line พิมพ์
keytool -list -v -keystore "%USERPROFILE%\.android\debug.keystore" -alias androiddebugkey -storepass android -keypass android

ตัวอย่าง จะได้ค่าออกมา SHA 1 ให้copy ไว้ก่อนครับ เลขที่ได้จะเอาใส่ในการสร้าง key จาก google

เข้าไปที่ Google Developers Console ถ้าไม่มีก็สมัคร user แล้วให้สร้าง Project ใหม่ขึ้นมา

มันจะให้เราตั้งชื่อ อะไรก็ได้ลงไปครับ

รอสักครู่จะได้เข้าได้โปรเจค เสร็จแล้ว
หาเมนู APIs&auth เข้า APIs ให้หา Google Maps Android API v2

หลังจากนั้นให้เข้าเมนู Credentials เพื่อจะสร้าง key
ให้เลือก create new Key แล้วจะถามให้คลิก Key Android

แล้วจะได้หน้านี้ครับ ก็คือหน้าที่เอาค่า SHA 1 ตอนแรกที่ให้หา มาใส่ครับ 

จะมีตัวอย่างในการใช่อยู่ครับ ให้ใส่ค่า SHA 1 ให้เรานี่ค่า SHA1 แล้วตามด้วยเครื่องหมาย ; แล้วด้วยชือไฟล์Project เช่น 

• A4:DF:1C:37:2D:E6:BB:38:C6:4D:26:33:EF:B1:C1:A3:BB:F6:08:7E;pae.com.wa.mapi แล้วกดสร้าง ครับ

ก็จะได้ค่ามาแบบนี้ครับ เก็บไว้ก่อน

หลังจากได้ค่า API KEY เรียบร้อยแล้ว ก็นำค่ามาใส่กันครับ
เปิดไฟล์ AndroidManifest.xml เข้าเพิ่มโค้ดนี้ ให้อยู่ในtag <application> </application>
ตรงส่วนของ API_KEY ให้เราใส่ Key ที่เราได้สร้างไว้แล้วลงไป

จากกนั้นให้ ใส่ค่า permission ด้านบน พิมพ์โค้ดนี้เพิ่มเข้าไป
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>

ต่อไปเป็นการเพิ่ม การใช้ OpenGL ES 2 เข้าไป ต่อจากการเพิ่ม permission

<uses-feature
        android:glEsVersion="0x00020000"
        android:required="true"/>

ตัวอย่าง ไฟล์ AndroidManifest.xml ที่เสร็จแล้ว

ต่อไปแก้หน้า activity_main.xml  เป็น layoutแบบ fragment

<?xml version="1.0" encoding="utf-8"?>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/map" android:layout_width="match_parent"
android:layout_height="match_parent"
android:name="com.google.android.gms.maps.MapFragment"/>

ต่อไปแก้ไขไฟล์ java main ในที่นี้ไฟล์ผมชื่อ main

import android.app.Activity;
import android.os.Bundle;
public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
}

หลังจากนั้น ก็ทำการัน ตัวจำลองของ android studio ไม่สามารถใช้งาน google map ได้
ตัวจะใช้เครื่องจริง กับ Genymotion จำลองครับ (Genymotion เป็นตัวจำลองที่ใช้ดีฟรีครับแนะนำ)