หัดเขียน NodeJS ฉบับ Maker ตอนที่ 1

เรียนรู้โครงสร้าง NodeJS และการเริ่มต้นโปรเจ็คด้วย yeoman

Published in

Chiang Mai Maker Club

2 min readSep 9, 2017

อันที่จริงแล้ว.. การเริ่มต้นเขียน NodeJS เราคงแยกกันไม่ได้หรอกเนอะ ว่าแบบไหนเป็นการเริ่มต้นสำหรับ software developer อันไหนสำหรับ Maker เพราะว่า NodeJS ก็เป็นภาษาโปรแกรม ก็แค่เครื่องมือชนิดหนึ่งเท่านั้นเอง..

หากจะทำให้การหัดเขียน NodeJS สำหรับ Maker มันต่างออกไปนั้น.. มันก็คงจะต่างกันที่บริบทการเริ่มต้นเท่านั้น.. น้องๆที่ Chiang Mai Maker Club จะเรียกพวกนี้ว่าแรงบันดาลใจ… ก้าวแรกเราต้องเริ่มต้นโปรเจ็คด้วยแรงบันดาลใจ.. หรือผีบ้าดลใจก็ได้ไม่ว่ากัน (๕๕๕) สำหรับ CMMC นั้น.. เอาม่วนใจ๋เข้าว่าครับ.. แล้วก็ทำให้สอนคนอื่นต่อไปได้

เริ่มต้นกับ NodeJS หลักสูตร CMMC

สิ่งที่ยากที่สุด ก็อยู่ที่การเริ่มต้น…
ถ้าก้าวแรกเกิดช้า.. คิดแล้วคิดอีก… ก็ไม่มีงานเกิดขึ้นมา
มันก็.. เบื่อ ไม่มี productivity, แต่ถ้าไม่มี best practice ก็อาจจะเริ่มต้นง่าย เริ่มไว ไม่มีโครงสร้าง ทำซ้ำๆๆ อยู่นั่น ... จะเบื่ออีกเหมือนกัน

งั้นเรามาเริ่มต้นกันด้วย yeoman

ไม่ต้องพูดพร่ำทำเพลง.. อธิบายสั้นๆว่า yeoman คือ tools ที่ถูกสร้างขึ้นมาช่วยเริ่มโปรเจ็ค (kickstart/scaffold) ให้สะดวกมากขึ้น.. และแน่นอนครับเราจะ stay simple ครับ เดี๋ยวธาตุไฟจิเข้าแทรกเอาเนอะ…. และแน่นอนบทความนี้ก็ยังไม่ใช้ และยังไม่พูดถึง es6 หรือ typescript, coffee script, flowtype แล้วก็.. ยังไม่ใช้ buildtools อย่างเช่น gulp, grunt, webpack เช่นกัน สบายใจได้ (เริ่มงงแล้วใช่ไหมล่ะ!?)

What’s Yeoman?

Yeoman helps you to kickstart new projects, prescribing best practices and tools to help you stay productive.
To do so, we provide a generator ecosystem. A generator is basically a plugin that can be run with the yo command to scaffold complete projects or useful parts.

เริ่มต้นติดตั้งกันได้เลย!

1. ติดตั้ง NodeJS

หากใครยังไม่ได้ติดตั้ง.. ให้อ่านการติดตั้ง nodeJS กันได้ที่นี่ครับ

2. ติดตั้ง yeoman

สำหรับการ yeoman และ generator-nodeนั้นสามารถทำผ่านคำสั่ง npm ได้เลย โดยการเติม option -g เข้าไปแบบนี้.. (แปลว่าให้ลงแบบ global)

 $ npm install -g yo 
 $ npm install -g generator-node

เริ่มสร้าง project!

เริ่มสร้าง project กันด้วยคำสั่งข้างล่าง พอกด Enter ปุ๊บก็ให้ กรอกข้อมูลของโปรเจ็คให้เรียบร้อย แบบรูปข้างล่าง

$ yo node

โครงสร้างโปรเจ็คจะเป็นแบบนี้.. ไฟล์ที่สำคัญที่สุดคือ package.json ซึ่งจะเก็บที่อย่างที่เรากรอกไว้ตอนเรียกคำสั่ง yo node นั่นเอง

เขียนโค๊ด และรันโปรแกรม!

เปิดโปรเจ็คขึ้นมาด้วย Code Editor ที่โปรดปราน.. ยกตัวอย่างเช่น Visual Code Studio เปิดไฟล์ lib/index.jsขึ้นมาแล้วเขียนโปรแกรมให้สั่งปริ้นออกหน้าจอทุกๆ 100ms โดยคำสั่ง setInterval

setInterval(function() {
    console.log('hello NodeJS...') 
}, 1000)

รันโปรแกรม

และสามารถรันโปรแกรมโดยใช้คำสั่ง node แล้วตามด้วยชื่อไฟล์แบบนี้ครับ

$ node lib/index.js

vdo แสดงขั้นตอนการการใช้งาน yeoman

ตอนต่อไป

หลายท่านอาจจะสงสัย.. แล้วมันจะเป็น NodeJS ยังไง?… คืองี้ครับ.. ผมคิดว่าสำหรับ Maker สาย Nerd แล้ว.. ยังไงคงหนีไม่พ้นการคุยกับ พอร์ตสื่อสารแบบอนุกรม.. หรือ Serial port นั่นเองครับ… รอบหน้าเรามาลองลง library ที่ชื่อว่า serialport กันครับ… บทความหน้าเราก็.. จับ NodeJS คุยกับ Arduino ซะเลยยยยละกันเนอะ!