ในวันที่ต้อง Mock API แบบด่วน ๆ สำหรับทดสอบ Front-end (แต่ Back-end จริง ๆ มันยังอยู่แค่ในร่างออกแบบ) งั้นก็เริ่มกันเลย

เราใช้ json-server เป็นตัวช่วยทำ Mock API ซึ่งก็ตอบโจทย์และเร็วสุดละ สิ่งที่เราต้องทำเพิ่มคือสร้างชุดข้อมูลสำหรับทดสอบเท่านั้นเอง

npm install -g json-server

ส่วนการสร้างชุดข้อมูลก็ใช้ faker.js (เราใช้ lodash เพิ่ม ก็ติดตั้งเข้าไปพร้อมกันเลย)

npm install faker lodash

สร้างชุดข้อมูลแบบ random ด้วยไฟล์ชื่อ generator.js เข้าไป

// generator.js
module.exports = function () {
    var faker = require("faker");
    var _ = require("lodash");
    return {
        customers: _.times(Math.floor((Math.random() * 1000) + 1), function (n) {
            return {
                id: n+1,
                firstname: faker.name.firstName(),
                lastname: faker.name.lastName(),
                birthdate: faker.date.past(50, new Date("Sat Sep 20 1992 21:35:02 GMT+0700 (ICT)")),
                address: faker.address.streetAddress(),
                city: faker.address.city(),
                country: faker.address.country(),
                email: faker.internet.email(),
                avatar: faker.internet.avatar()
            }
        })
    }
}

หลังจากที่เรา Start Server ด้วยคำสั่ง json-server generator.js ข้อมูลที่เรา generate ขึ้นหน้าตาก็ประมาณนี้

ท้ายสุดเราก็แพ็คลง Container เลย โดยสร้าง Dockerfile ไว้ใช้งานยาว ๆ  (เป็นลางว่า Back-end จะยังไม่เสร็จในเร็ววันใช่ไหม 55555)

FROM node:10-alpine

LABEL author="mf"
LABEL version="latest"

ENV NPM_CONFIG_LOGLEVEL info
ENV TZ Asia/Bangkok

RUN apk add --no-cache tzdata \
    && cp /usr/share/zoneinfo/Asia/Bangkok /etc/localtime \
    && echo "Asia/Bangkok" >  /etc/timezone \
    && rm -rf /var/cache/apk/*

# Create application directory
RUN mkdir -p /data \
    && npm install -g json-server lodash faker
WORKDIR /data

VOLUME [ "/data" ]
EXPOSE 3000

# Default command
ENTRYPOINT ["json-server"]
CMD ["--help"]

หลังจาก build Dockerfile แล้วก็ลองรันกันเลย ถ้าไม่ทำอะไรผิดพลาดผลลัพธ์มันก็ควรจะเป็นดังรูป

docker run -d -p 3000:3000 -v `pwd`/app:/data mf/mockup-api --watch generator.js --host 0.0.0.0

จบปิ๊งง ^_^

Published by Man Friday

Application Developer, Photographer and WordPress aficionado. Particularly interested in relational database design, In usability, UX and accessibility on software development. I just wear glasses, Lives in Ubonratchathani, Thailand.