← Back to list

สร้าง API server แบบง่าย ๆ ด้วย Node.js พร้อม deploy บน Heroku

การเริ่มต้นทำ server ง่าย ๆ ด้วย Node.js และส่งขึ้น Heroku

YuttYL · 2020-05-11 10:47 · 0 claps · 3.3 min read
#api-server #nodejs #heroku #สร้าง-server #nodejs-server
Open on Medium ↗
Wiki topics: 🌐 · Web Development

สร้าง API server แบบง่าย ๆ ด้วย Node.js พร้อม deploy บน Heroku

การเริ่มต้นทำ server ง่าย ๆ เพื่อให้เห็น concept หรือวิธีการเขียนที่จะสามารถนำไปใช้งานได้จริง

1..2..3…เริ่ม!!!

แต่ก่อนที่เราจะเริ่มกัน ต้องติดตั้งสิ่งเหล่านี้ลงบนคอมพิวเตอร์ให้เรียบร้อยนะครับ

  1. Node.js & npm
  2. git
  3. Heroku CLI ⤵

เอาหละมาเช็คความพร้อมด้วย 3 คำสั่งด้านล่างกันครับ ในการจะใช้งาน Heroku นั้นจะต้องมี Node.js เวอร์ชั้น 8 ขึ้นไป `>node --version v10.15.0

npm --version 6.12.0 git --version git version 2.20.1.windows.1`

เช็คความพร้อมเรียบร้อย

ขั้นต่อไปเป็นการ login เข้าสู่ Heroku (สมัครได้ที่ Link) บน command line ด้วย command นี้ครับ > **heroku login** heroku: Press any key to open up the browser to login or q to exit:

ในขั้นนี้ Heroku จะพาเราไป login บน browser กด enter เลยครับ

เมื่อ browser แสดงหน้านี้ขึ้นมา ให้ทำการคลิก Log In ได้เลย หลังจากนั้นใน command line จะแสดงข้อความ Logging in... done

Logged in as me@example.com

เป็นอันเสร็จสิ้นการ log in

เพื่อความรวดเร็วในการสร้าง server ผมจะใช้โปรแกรมที่ทาง Heroku พัฒนาไว้ให้แล้ว ให้ทำการ clone project > **git clone [https://github.com/heroku/node-js-getting-started.git](https://github.com/heroku/node-js-getting-started.git)**

>** cd node-js-getting-started**

ก่อนจะ deploy เราจะต้องสร้าง app บน Heroku เสียก่อน > **heroku create** Creating sharp-rain-871... done, stack is heroku-18 http://sharp-rain-871.herokuapp.com/ | [https://git.heroku.com/sharp-rain-871.git](https://git.heroku.com/sharp-rain-871.git)

ตอนนี้เราได้ app มาแล้ว เหลือเพียงแค่ deploy โปรแกรมที่ clone ไว้ขึ้นไปบน Heroku `> git push heroku master Counting objects: 488, done. Delta compression using up to 8 threads. Compressing objects: 100% (367/367), done. Writing objects: 100% (488/488), 231.85 KiB | 115.92 MiB/s, done. Total 488 (delta 86), reused 488 (delta 86) remote: Compressing source files... done. remote: Building source: remote: remote: -----> Node.js app detected remote: remote: -----> Creating runtime environment remote: remote: NPM_CONFIG_LOGLEVEL=error remote: NODE_VERBOSE=false remote: NODE_ENV=production remote: NODE_MODULES_CACHE=true remote: remote: -----> Installing binaries remote: engines.node (package.json): 12.x remote: engines.npm (package.json): unspecified (use default) remote: remote: Resolving node version 12.x... remote: Downloading and installing node 12.13.0... remote: Using default npm version: 6.12.0 .... remote: -----> Build succeeded! remote: -----> Discovering process types remote: Procfile declares types -> web remote: remote: -----> Compressing... remote: Done: 19M remote: -----> Launching... remote: Released v3 remote: http://sharp-rain-871.herokuapp.com deployed to Heroku remote: remote: Verifying deploy... done. To https://git.heroku.com/nameless-savannah-4829.git

  • [new branch] master -> master`

ในตอนนี้ app ของเราทำงานเป็นที่เรียบร้อย มาทดลองเปิดไปพร้อมกันครับ > **heroku open**

จะได้หน้าตาแบบนี้ขึ้นมาครับ

wep app บน Heroku server

wep app บน Heroku server

เพื่อให้ตรง concept ว่าเราจะสร้าง API server เข้าไปที่ folder นี้เลยครับ node-js-getting-started (ที่ clone ไว้เมื่อสักครู่) เปิดไฟล์ index.js เพื่อทำการแก้ไข

index.js

index.js

API server จะเขียนในรูปแบบของ RESTful API โดยจะใช้งานร่วมกับ HTTP request methods (GET, POST, PUT, DELETE และอื่นๆ) เพื่อพอเป็นแนวทาง ผมจะขอยกตัวอย่างการทำงาน GET กับ POST นะครับ

POST method ใช้ส่งค่าขึ้นไปยัง server เพื่อเพิ่มข้อมูล

เพิ่ม code ส่วนนี้ไปใน index.js ซึ่งผมจะยกตัวอย่างว่าเป็นการส่งค่า username ไปเก็บที่ฐานข้อมูล แต่แสดงเพียงแค่นำค่าที่ได้จากการส่ง POST methods มาเก็บไว้ในตัวแปรชื่อ usr_val

.post('/username/:usr', (req, res) => { var usr_val = req.params.usr //ตัวแปรที่เก็บค่า username res.writeHead(200, { 'Content-Type': 'text/html' }); res.write("post value /username/" + usr_val) res.end() })

เพิ่ม post methods ใน index.js บรรทัดที่ 10–15

เพิ่ม post methods ใน index.js บรรทัดที่ 10–15

ทุกครั้งเราต้องอัพเดตโปรแกรมขึ้นไปยัง Heroku ด้วย git command มีลำดับ command ดังนี้ (อย่าลืม Save ไฟล์ ก่อนนะครับ)

  1. git add .
  2. git commit -m “Add post methods”
  3. git push heroku master

ทดสอบด้วย Postman

post methods ในโปรแกรม Postman

post methods ในโปรแกรม Postman

หาก server ได้รับ จะส่ง status 200 (วงกลมสีแดงในรูป) และในกรอบสี่เหลี่ยมจะเห็นว่า มีข้อความที่เราเขียนสั่งไว้ในโปรแกรม (res.write(“post value /username/” + usr_val)) โดย usr_val นั้นเก็บค่าที่เราส่งมาจาก Postman ซึ่งผมส่งคำว่า test มา

GET method ใช้ขอข้อมูลจาก server

ในส่วนของ get methods ผมก็จะใช้การส่งค่าแบบเดิมนะครับ คือส่งค่า username ขึ้นไปให้ server ตามโปรแกรมด้านล่างครับ

.get('/username/:usr', (req, res) => { var usr_val = req.params.usr //ตัวแปรที่เก็บค่า username res.writeHead(200, { 'Content-Type': 'text/html' }); res.write("get value /username/" + usr_val) res.end() })

เพิ่ม post methods ใน index.js บรรทัดที่ 16–20

เพิ่ม post methods ใน index.js บรรทัดที่ 16–20

ทำการอัพเดตโปรแกรมเราไปยัง Heroku ด้วยขั้นตอนเดิมครับ

  1. git add .
  2. git commit -m “Add get methods”
  3. git push heroku master เพิ่มเติมครับ ในข้อ 2. git commit -m “Add get methods” หลัง -m เราสามารถใส่ข้อความอะไรไปก็ได้ครับ

ทดสอบที่ Postman เช่นเดิม

ส่ง get methods จาก postman ไปยัง server

ส่ง get methods จาก postman ไปยัง server

ก็จะเห็นว่า server status 200 และในส่วนของ Body ก็มีการแสดงค่าที่เราเขียนไว้นะครับ (res.write("get value /username/" + usr_val)) จริง ๆ แล้ว get method ควรจะใช้สำหรับขอข้อมูลจาก server ยกตัวอย่างเช่น การขอข้อมูลทั้งหมดของ user ที่ใช้ชื่อว่า นาย ก (เอ๊ะหรือจะ นายก 555😂) เป็นต้นนะครับ เนื่องจากผมไม่ได้เขียนในส่วนของฐานข้อมูลจึงแสดงให้เห็นเฉย ๆ ว่าเราสามารถใช้งาน http methods ต่าง ๆ ได้

โอเคครับ ผมขอจบบทความนี้ไว้เพียงเท่านี้นะครับ และในบทความถัดไปจะเป็นการนำ Microcontroller ส่งค่าขึ้นมายัง Server ของเรานะครับ แต่!!ยังเหมือนเดิมครับ ผมจะยังไม่มีการส่งค่าใด ๆ ไปเก็บไว้ยังฐานข้อมูลครับ 😂


메타데이터
post_id
5e24e5e6b45d
slug
การพัฒนา-api-server-แบบง่าย-ๆ-ด้วย-node-js-พร้อม-deploy-บน-heroku-5e24e5e6b45d
url
https://medium.com/@yutt.yl/%E0%B8%81%E0%B8%B2%E0%B8%A3%E0%B8%9E%E0%B8%B1%E0%B8%92%E0%B8%99%E0%B8%B2-api-server-%E0%B9%81%E0%B8%9A%E0%B8%9A%E0%B8%87%E0%B9%88%E0%B8%B2%E0%B8%A2-%E0%B9%86-%E0%B8%94%E0%B9%89%E0%B8%A7%E0%B8%A2-node-js-%E0%B8%9E%E0%B8%A3%E0%B9%89%E0%B8%AD%E0%B8%A1-deploy-%E0%B8%9A%E0%B8%99-heroku-5e24e5e6b45d
canonical_url
https://medium.com/@yutt.yl/%E0%B8%81%E0%B8%B2%E0%B8%A3%E0%B8%9E%E0%B8%B1%E0%B8%92%E0%B8%99%E0%B8%B2-api-server-%E0%B9%81%E0%B8%9A%E0%B8%9A%E0%B8%87%E0%B9%88%E0%B8%B2%E0%B8%A2-%E0%B9%86-%E0%B8%94%E0%B9%89%E0%B8%A7%E0%B8%A2-node-js-%E0%B8%9E%E0%B8%A3%E0%B9%89%E0%B8%AD%E0%B8%A1-deploy-%E0%B8%9A%E0%B8%99-heroku-5e24e5e6b45d
author_url
https://medium.com/@yutt.yl
status
ok
fetched_at
2026-07-29 02:57:49