The Existing Company — TechStack 2019

Panupak Vichaidit
THE EXISTING COMPANY
5 min readJan 1, 2020

--

สวัสดีกันท้ายปี 2019 ครับทุกคน ปีนี้เป็นปีที่เป็นค่อนข้างมีเทรนใหม่มาค่อนข้างเยอะไม่ว่าการทำ ML, Blockchain, Auto driving cat เนื่องจากคนเรามีความต้องการที่เปลี่ยนไปจากเดิม ยกตัวอย่างเช่น

เมื่อก่อนผู้ใช้ต้องการเว็บไซดที่ใช้ในการหาชื้อสินค้าต่างๆ ความต้องของคนที่ใช้งานก็จะเป็นการที่เข้ามาหาของในเว็บไซต์แล้วก็กดของลงตระกร้า จากนั้นก็จ่ายเงิน เป็นอันจบพิธี แต่เมื่อเวลาผ่านไป ใจคนเราเปลี่ยน ความต้องการของคนก็เปลี่ยนตาม ทำให้เว็บไซต์จากเดิมที่หาของได้เพียงอย่างเดียวก็สามารถที่จะแนะนำสิ่งที่เราต้องการจะชื้อได้ทันที

ซึ่งถ้ามองกันแง่ของการใช้เทคโนโลยีมันก็มีสิ่งพุดขึ้นมามากมายเพื่อใช้ในการตอบโจทย์ความเอาแต่ใจของผู้ใช้ โดยในบทความนี้เราจะมาพูดถึง tech stack ที่เป็นตัวขับเคลื่อน EXISTING กันครับ

Task Management Tools

ทางด้านของ task management tools ที่ทางทีม EXISTING ได้เลือก JIRA มาเป็นตัว ช่วยการบริหารจัดการ task ของบริษัทเราครับ เนื่องจากเหตุที่ว่า JIRA นั้นเป็นเครื่องมือที่ FREE(ถ้าไม่เกิน 10 คน) รวมถึงเป็นเครื่องมือที่ค่อนข้างใช้กันอย่างแพร่หลาย ทำให้ทางเราตัดสินใจเลือกตัวนี้มาทันที

JIRA software with task

Source Code Repository

เนื่องจากเราใช้ JIRA เป็นตัว task management ทางเราเลยมองหาตัวที่เก็บ source code ที่สามารถใช้ร่วมกับตัว task management ได้ เราเลยเลือกใช้ bitbucket ในทันที ซึ่งตัว bitbucket นั้นสามารถทำงานร่วมกับ task ใน JIRA ได้ โดยเราสามารถใส่เลข task ของ Jira ลงไปใน commit message จากนั้นก็ push ขึ้นไปที่ bitbucket ตัวของ Jira นั้นก็จะดึง commit message นั้นมาไว้ตรง task เพื่อบอกว่า task นี้มีการ commit กี่ครั้งแล้ว มีเรื่องอะไรบ้าง ซึ่งทำให้คนที่เป็น Scrum Master หรือ Developer สามารถ tracking ได้ง่ายว่า progress ของงานไปถึงไหนบ้างแล้ว

bitbcuket — source code repository

Frontend Stack

https://www.codeinwp.com/blog/angular-vs-vue-vs-react

ถ้าพูดถึงของฝั่งหน้าบ้านก็คงไม่พูดเกี่ยวกับ framework สุดร้อนแรงทั้ง 3 เจ้าก็คงไม่ได้ ไม่ว่าจะเป็น React, Angular และ Vuejs ซึ่งแต่ละเจ้าก็มีข้อดีข้อเสียแตกต่างกันออกไป ไม่ว่าจะเป็น

  • React ที่มี community ในการพูดคุยในวงกว้าง
  • Angular ที่มีข้อดีที่เป็น framework เหมาะสำหรับกับทีมเล็กและทีมใหญ่ที่ต้องการเขียน code ในรูปแบบเดียวกัน
  • VueJs ซึ่งเขียนง่ายเหมาะสำหรับคนที่อยากเริ่มเรียนรู้ในการเขียน website

คำถามคือ ถ้าทั้ง 3 มีข้อดีที่แตกต่างกันขนาดนี้

แล้วทาง EXISTING นั้นเลือกอะไรกัน ?

คำตอบคือทั้งหมดครับ

อย่างที่รู้กัน EXISTING เรานั้นแบ่งออกเป็น 2 ทีมคือ

  1. Spacecrafter (Software house)
  2. Pilot ( Startup )

ฝั่งของ Spececrafter มีความหมายตามตัวเลยคือเป็นคนสร้างยาน ดังนั้นสิ่งที่ทำให้ยานให้เราแข็งแรงนั้นต้องเป็นวัตถุที่มีคุณภาพดี แต่วัสดุไม่จำเป็นต้องเป็นโลหะเสมอไป อาจจะเป็นพวกอลูมิเนียม สังกะสี หรืออะไรก็ตามแต่ ซึ่งเราต้องหาวัตถุดิบให้เหมาะกับสถานการนั้นๆ นั้นหมายความว่า ถ้าเราอยากจะทำ Software เราก็เลือกตามความชอบของเรา + ความต้องการของลูกค้าด้วย ยกตัวอย่างเช่น

  • ถ้าตัวของลูกค้าเป็นองค์กรใหญ่มีนักพัฒนาหลายร้อยคนเราอาจจะต้องเลือก Angular มา เพราะว่าวิธีการเขียน code จะไม่หลุดออกจากกรอบที่วางเอาไว้มากนัก
  • หรือ ในทางกลับกัน ทางลูกค้าไม่ได้ต้องการภาษาอะไรมาเป็นพิเศษก็จะเลือกเป็น React ไป เพราะทางนักพัฒนาของเรานั้นชอบเขียนมากที่สุด

อีกด้านหนึ่งในส่วนของ Pilot ที่ทำหน้าที่เป็นพลขับ ตัวของนักบินต้องมี mindset ที่ว่าทำอย่างไรให้ตัวเองและผู้โดยสารนั้นไปถึงที่หมายให้เร็วและปลอดภัยที่สุด ดังนั้นตัวของ library ที่เลือกใช้ก็จะเป็น React หรือ Vue ที่ทางนักพัฒนาค่อนข้างเชี่ยวชาญที่สุดนั้นเอง เน้นให้ทันความต้องการของผู้ใช้ และความเร็วในการทำมากกว่า เมื่อพูดในแง่ของ bussiness ไปแล้วมาพูดในเชิง technical กันบ้างครับ

ในด้าน technical ได้แบ่งข้อดีของการใช้ framework ทั้ง 3 ตัวได้แก่

  • Support Server Side Rendering (SSR) library ทั้ง 3 ตัวทางทีม dev สามารถเขียนให้ตัว application สามารถใช้ server ในการ render ตัว website แทนของฝั่ง client ได้ โดยตัวของ React ก็จะใช้ Nextjs ส่วน Angular จะเป็น Angular Universal ส่วนตัวของ VueJs ก็จะเป็น Nuxt.js ครับ
  • State Management ตัว State Management เป็นสิ่งที่ค่อนข้างจำเป็นมากๆ ในการทำ website ในปัจจุบันเนื่องจากตัวของ web ไม่ได้มีแค่ state ในการซ่อนหรือแสดง แต่ยังมีทั้งการ state ทั้งการดึงข้อมูล, รอข้อมูล, Error Handling และอื่นๆ อีกมากมาย
  • Web Component ตัว web component คือเป็นการเขียน website ให้ออกมาเป็น component ต่างๆ ให้อยู่ในรูปแบบของ html5 โดยตัว component เหล่านั้นจะไม่ขึ้นกับ library หรือ framework ใด เหมาะกับ project ที่เราต้องการ reuse ตัว component นั้นบ่อยๆ โดยเราสามารถเขียนผ่านทั้ง React, Angular แล้วก็ VueJs จากนั้นก็ compile เป็น web component อีกทีได้ครับ
React, Angular And VueJS

Backend Stack

https://www.quora.com/Which-do-you-prefer-Node-js-or-GoLang-Why

เมื่อพูดถึงด้านสวยๆงามๆ อย่าง frontend ไปแล้ว ลองมามองที่ตัว backend ที่เป็นเสมือนมันสมองของ website กันบ้างครับ ตัวของ backend นั้นทาง EXISTING จะเลือกไว้ 2 ตัว นั้นก็ Golang และก็ Nodejs (expressjs, hapi, nestjs and etc) สาเหตุที่เลือก 2 ตัวนี้มีอยู่ 3อย่างนั้นก็คือ

  • Easy to write - อย่างที่เรารู้ๆกันเวลาเราเขียน javascript เป็น เราก็สามารถเขียน ได้ทั้ง frontend แล้วก็ backend ซึ่ง nodejs เป็นอะไรที่ตอบโจทย์มากๆ developer สามารถเรียนภาษาเดียว แล้วเอาไป implement งานต่างๆ ได้ทันที
    ส่วนของ golang เนื่องจากเป็นภาษาที่ค่อนข้างคล้ายๆ กับ OOP นักพัฒนาที่ผ่านการเขียนจาก java, C# หรือแม้กระทั่ง type script ก็สามารถเรียนรู้ Golang ได้ค่อนข้างง่ายอยู่พอสมควร
  • Community อีกเหตุผลหนึ่งที่เลือกทั้ง 2 ภาษาเนื่องจาก community ของทั้งสองภาษาค่อนข้างใหญ่ (ถึงแม้ของ golang จะใหญ่ไม่เท่า nodejs ก็ตามเถอะ)
  • Tools เมื่อ community ใหญ่แล้วเครื่องมือที่ตามมา support ก็เยอะตามมาด้วยไม่ว่าจะเป็น IDE เทพๆ อย่าง webstorm และ goland ที่ all in one ทำทุกอย่างของ web ได้ในที่เดียว หรือแม้กระทั่ง text editor ก็ออกมา support การเขียนของทั้งภาษา

ซึ่งเหตุผลด้านบนที่ยกมานั้นพูดในแง่ของการใช้งานง่ายกับการที่มี community ในการ support developer แต่ถ้าในแง่ของ performace และด้านการ scaling ทาง EXISTING จะมองไปทาง Golang ซะมากกว่าซึ่งมีหลายเหตุผลไม่ว่าจะเป็น

  • Performance ด้าน performance ตัว golang สามารถ execute ตัว program ได้ทันที เพราะว่าตัวภาษาไม่ได้ต้องการพวก virtual machine (เช่น V8 ของ nodejs) ในการ compile ไปเป็นภาษาเครื่อง
  • Scaling/Concurrency ด้านของตัว scaling หรือ concurrency ก็สามารถทำได้อย่างดี เนื่องจาก go support การเขียนแบบแตก thead ของ CPU ทำให้ตัวโปรแกรมไม่จำเป็นต้องใช้ thead ตัวเดียวในการ process คำสั่งต่างๆ
nodejs and golang

Automation Test Stack

ด้านของฝั่ง automation tester ก็มีเครื่องมือต่างๆ เอาไว้ทดสอบพวก website ที่พวกเราเขียนกันมา โดยเครื่งอมือจะแบ่งออกเป็น 2 แบบคือ

  1. E2E (end-to-end-test)
  2. Integration test

1. E2E Test Tools ด้านของ E2E ทาง EXISTING ได้เลือกใช้ Robot framework เนื่องจากมี 2 เหตุผลหลักๆครับ

  • Easy to write ตัวของ robot Framework นั้นมีทั้งแบบ GUI ที่เราสามารถเลือกคลิกตรงหน้า web แล้วเอา x-Path มาใช้ในการเขียน test case ได้ หรือถ้าไม่ชอบการกดของ GUI ก็จะมีแบบการเขียนที่เป็น BDD (Behavior Driven Development ) ใน file text ได้ทันที และเนื่องจากตัวของ robot framework support การเขียนด้วยภาษา programming เช่น groovy หรือ python ทำให้ automated tester ของเราเขียน python เพื่อที่เปิดไฟล์, เขียนไฟล์ หรือ งานอื่นๆ ที่ช่วยในการ test นั้นง่ายขึ้น
  • Community ตัว community ของ robot Framework นั้นค่อนข้างกว้างมากๆ ทำให้ automated tester ของเรานั้นหาข้อมูลที่ใช้ในการเขียน test ได้ไม่ค่อยลำบาก
  • Tools ตัวเครื่องมือที่ support การเขียน Robot Framework มีค่อนข้างมากไม่ว่าจะเป็น plugins ที่อยู่ใน visual studio code ที่ใช้ในการตรวจสอบว่า test case ที่เราเขียนลงมีความถูกต้องมากขนาดไหน

2. Integration Test ด้านของ integration test ก็จะเลือกใช้เครื่องมือตัวหนึ่งที่มีชื่อว่า postman เพื่อใช้ในการทดสอบตัว API ที่เขียนมา โดยเลือกมาเพราะเหตุผลดั้งนี้

  • Support เนื่องจากตัวของ postman มีสิ่งที่เรียกว่า RUNNER ที่ใช้การ test API โดยเราสามารถเชตได้ว่าอยากยิงตอนไหน เวลาไหนบ้าง มีหน่วงเวลาก่อนที่ยิงไปหาฝั่งของ API ก่อนหรือป่าว ซึ่งผมมองว่ามันค่อนข้างดีมากสำหรับ tester ที่ชอบหาวิธี test แปลกๆ
  • Easy to implement ตัว test script ของ postman เป็นอะไรที่ต้องใช้เวลาในการศึกษาหน่อยครับ เพราะว่าตัว script จะคล้ายๆกับ bash script แต่ถ้าเขียนเป็นแล้ว เขียน test case ได้คล่องขึ้นมากๆ ครับ
Robot framework Test Report

DevOps Stack

ส่วนของด้าน infrastructure ซึ่งเป็นดั่งกระดูกสันหลังของ tech ของทั้งหมดที่กล่าวมา ซึ่งถ้าเชิง concept ของการท่องอวกาศแล้ว DevOps คงเป็นเสมือนโรงงานประกอบยาน หรือ workshop ที่ให้นักพัฒนามาสรรค์สร้างสิ่งใหม่ๆได้นั้นเองครับ โดยทางเราเลือกใช้เป็น Google Cloud Platform (GCP) ในการพัฒนาเป็นหลัก เนื่องจากตัวของผมเองคุ้นเคยกับ service ของ Google มากกว่ารวมถึงตัว service ที่ให้ใช้ก็ค่อนข้างหลากหลาย นอกจาก provider พูดถึงไปแล้ว ก็มาพูดถึงการทำ infrastructure กันโดยเริ่มจาก

  • CI/CD ทาง EXISTING จะมี CI/CD เพื่อใช้ในการ build project ให้การเป็น docker image เพื่อใช้การ deploy ต่อไป โดยทางเราได้เลือกใช้เป็น Jenkins เพราะเนื่องจากมี plugins ที่ support ตัวมันเองค่อนข้างเยอะมากๆ รวมถึงตัวมันเองสามารถเขียนเป็น build pipeline ได้ด้วย และมีอีกตัวนั้นก็คือ cloud build ที่เราสามารถดึง source code จาก bitbucket แล้วนำมา build ได้ทันที
  • Container Orchestration เนื่องจากตัว application ของเราใช้ docker เพื่อใช้ในการ deployment ดังนั้นจึงต้องหาตัว management ที่ดีเพื่อใช้การคุม infrastructure ทั้งหมด โดยทางเราได้ไปเลือกใช้ kubernetes อันโด่งดัง โดยเหตุผลที่ใช้ kubernestes เพราะว่าตัวของมันสามารถทำ zero — downtime เวลาเรา deploy feature ใหม่ๆ ขึ้นไปได้ รวมถึงการทำ autoscaling ทั้งในด้านของตัวเครื่องและ container ก็สามารถทำได้ง่ายเช่นกัน
Google Cloud Platform (GCP) Services

สรุป

สิ่งที่เราเน้นย้ำกับทีมตลอดคือ เราจะส่งต่อเทคโนโลยีที่ดีที่สุดให้ให้กับลูกค้า นั่นก็คือ tech stack ที่เราใช้ และ reseach กันอยู่ตลอดเวลา ทำให้เราตอบโจทย์เรื่อง ¹ความรวดเร็วในการปิดโปรเจกต์ (Time to market) ²โครงสร้างของซอร์ฟแวร์ที่รองรับการเปลี่ยนแปลงในอนาคตไม่พันกันเป็นสปาเก็ตตี้และประสิทธิภาพ (High-quality) ³ความชำนาญที่มีมากกว่า 10++ โปรเจกต์ไม่ว่าจะเป็น Internal software / Royalty software / Customize software และอีกหลายตัว (Knowhow)

--

--