Saladpuk.com
🏆 เนื้อหาหลัก
🏆 เนื้อหาหลัก
  • 💖สลัดผัก
  • 📰มีอะไรใหม่บ้าง
    • 2020
      • 2020-11
      • 2020-10
      • 2020-09
      • 2020-08
      • 2020-03
      • 2020-02
      • 2020-01
    • 2019
      • 2019-12
      • 2019-11
      • 2019-10
      • 2019-09
      • 2019-08
  • 🤔อ่านเรื่องไรดี ?
  • มือใหม่หัดเขียนโค้ด
    • 👶เขียนโค้ดด้วยภาษา C#
      • เกิดมาไม่เคยเขียนโค้ดมาก่อนเบย
      • 👶พื้นฐาน
        • 1.โปรแกรมที่ต้องลง
        • 2.โครงสร้างของโค้ด
        • 3.ชนิดของข้อมูล
        • 4.การสร้างตัวแปร
        • 5.คำสั่งพื้นฐาน
        • 6.การแปลงข้อมูล
        • 7.การเปรียบเทียบค่า
        • 8.การตัดสินใจด้วย IF statements
        • 9.การตัดสินใจด้วย Switch statements
        • 10.การทำงานซ้ำๆด้วย While
        • 11.การทำงานซ้ำๆด้วย Do While
        • 12.การทำงานซ้ำๆด้วย For
        • 13.การแก้โจทย์จากรูป
        • 14.มารู้จักกับ Array กัน
      • 🧑ระดับกลาง
        • 15.Value type vs Reference type
        • 16.ลดงานซ้ำๆด้วย Method
        • 17.มารู้จักกับ Class & Field กัน
        • 18.มารู้จักกับ Constructor กันบ้าง
        • 19.มาเขียน Method ใน Class กัน
        • 20.มารู้จักกับ Property กัน
        • 21.ลองใช้คลาสแบบจริงจังบ้าง
        • 22.การสืบทอด Inheritance
        • 23.Polymorphism
        • 24.Abstract Class
        • 25.Interface
        • 26.Namespace
        • 27.Enum
        • 28.Exception handler
        • 29.ลงลึกกับ string
        • 30.StringBuilder เพื่อนคู่ string
      • 👨⏳ระดับสูง
        • Generic
        • Delegates
        • Action & Func
        • Lambda expression
        • LINQ
        • พระคัมภีร์การใช้คำสั่ง LINQ
      • 💡Tips
        • 💡C# version 8.0
        • 💡Boxing & Unboxing
    • 👶Algorithm
      • 👾Algorithm Big-O
      • 👽Algorithm P & NP
    • 👦OOP
      • 💖Abstraction
      • 💖Encapsulation
      • 🏆Abstraction & Encapsulation
      • 💖Inheritance
      • 💖Polymorphism
      • 🏆Inheritance & Polymorphism
      • 📝ลองเขียน OOP ดูดิ๊
      • 👑OOP + Power of Design
      • 🥰เทคนิคในการออกแบบ
    • 👶บทสรุปฐานข้อมูล
      • เก็บรูปในฐานข้อมูล
      • Database indexing
      • การลบข้อมูล
    • 👦Communication Patterns
    • 👦Design Patterns
      • 🤰Creational Patterns
        • 🏭Factory Method
        • 🏭Abstract Factory
        • ☝️ Singleton Pattern
        • 🏗️ Builder Pattern
        • 🎎Prototype Pattern
      • 🧱Structural Patterns
        • 🔌Adapter Pattern
        • 📪Proxy Pattern
  • Puzzle
    • 🧠Challenges
      • 🐴Google ม้า 25 ตัว
      • 🌉Amazon เสา 2 ต้น
      • 🥇ทองเก๊
      • 💊ยาต้านโควิด
      • 🎩CP หมวก 5 ใบ
      • 🧓Einstein's Riddle 01
  • พื้นฐานที่ควรต้องรู้
    • 🐳Docker
      • 📦Docker Containers
      • 🃏Docker Exercise 01
      • 🛠️ Docker Tools
      • 🗃️ Docker Registry
      • 🖼️ Container Image
      • 📢Docker Push
      • 🔄WSL
    • 👶Clean Code
      • 🧓Uncle Bob - Clean Code
      • 🧓Uncle Bob - Comments
      • 🧓Uncle Bob - Naming
      • 🧓Uncle Bob - Mindset
      • 🧓Uncle Bob - TDD
    • 👶Code Smells
    • 👶สิ่งที่คนเขียนโค้ดมักเข้าใจผิด
    • 👶AI พื้นฐาน
    • 👶Git พื้นฐาน
      • Git branching strategy
    • 👶Cloud พื้นฐาน
    • 👶UML พื้นฐาน
      • Activity Diagram
      • Class Diagram
      • Sequence Diagram
      • Use case Diagram
      • บทสรุปการใช้ UML
    • 👶Data Scientist
      • การเลือก Algorithms ให้ AI (1/5)
      • การเตรียมข้อมูลให้ AI (2/5)
      • หลักการตั้งคำถามให้ AI (3/5)
      • แฉความลับของ AI Model (4/5)
      • หัดเขียน AI จาก AI ของคนอื่น (5/5)
    • 👶DevOps พื้นฐาน
    • 👶Docker ขั้นพื้นฐาน
      • Image and Container
      • แชร์ Docker Image ที่สร้างไว้
    • 👶Microservices พื้นฐาน
      • Microservices ที่ดีมีลักษณะยังไง
      • Microservices Tips
      • จาก Monolith สู่ Microservices
    • 👶ความรู้พื้นฐานในการทำเว็บ
    • 👦Bottlenecks of Software
      • หัวใจที่สำคัญที่สุดของฐานข้อมูล
    • 👦Agile Methodology
      • Agile in a Nutshell
      • Software Development Life Cycle
      • Code Review
    • 👦Security พื้นฐาน
      • การเก็บรหัสผ่านที่ถูกต้อง
      • Security in actions
        • Hash function
      • Security Principles
      • 😎The Matrix 1
      • 😎The Matrix 2
      • HTTPS in a nutshell
    • 👦SOLID Design Principles
      • มารู้จักกับ SOLID กันดีกว่า
      • Single-Responsibility Principle
      • Open/Closed Principle
      • Liskov Substitution Principle
      • Interface Segregation Principle
      • Dependency-Inversion Principle
  • Cloud Computing
    • 👶Microsoft Azure 101
      • สมัคร Microsoft Azure
      • รู้จักกับ Resource Groups
      • สร้างเว็บตัวแรกกัน
      • สร้าง Virtual Machine กัน
      • ประเภทของคลาว์เซอร์วิส
      • มาสร้าง Logic App กัน
      • มาสร้าง Function App กัน
      • คลาว์คิดเงินยังไง ?
      • Cloud Native
      • Guideline for Cloud scaling
      • Auto Scaling
    • 👶Azure App Services
    • 👶App Service Plan
    • 👶Azure Storage
      • Blob storage
        • ลองสร้างที่เก็บไฟล์กันเลย
        • เข้าใจ Blob storage ให้มากขึ้น
        • ลองเขียนโค้ดอัพโหลดไฟล์กันบ้าง
        • สร้างเว็บจากที่ฝากไฟล์บนคลาว์
    • 👶Azure Bot Service
      • Bot เข้าใจเราได้ยังไงกันนะ
    • 👶Azure Cognitive Services
      • การสร้าง Cognitive Services
      • การ Login ด้วยใบหน้า
      • อ่านลายมือจากรูปเป็นตัวอักษร (OCR)
      • เขียน AI แยกของต่างๆทำยังไง?
      • เขียนแอพ ทายอายุ บอกเพศ ง่ายจิ๊ดเดียว
      • เขียนแอพให้ AI อธิบายรูปเป็นภาษาคน
    • 👶Machine Learning Studio
      • มาสร้าง AI ของแท้ตัวแรกของเรากัน
      • สร้าง AI ตัดสินใจอนุมัติบัตรเครดิต 💳
      • ลองเรียกใช้ AI ของเรากัน
    • 👶Azure Service Fabric
      • สร้าง Service Fabric กัน
    • 👶Blockchain
      • Blockchain ทำงานยังไง ?
      • Consensus Algorithm คืออะไร ?
      • สร้าง Blockchain ใช้เองกัน !
      • หัดเขียน Smart Contract กัน
    • 👶Power BI
    • 👶Azure Web App
      • เซิฟเวอร์บนคลาว์ ราคา? ต่าง?
    • 👶Azure DevOps
      • เล่น Azure DevOps กัน
      • เล่นกับ Repository
      • ลองทำ Continuous Integration (CI)
      • ลองทำ Continuous Delivery (CD)
      • เล่น Kanban Board
    • 🤠Cloud Playground
      • การป้องกันความลับหลุดตอนที่ 1
      • การป้องกันความลับหลุดตอนที่ 2
      • การป้องกันความลับหลุดตอนที่ 3
      • การป้องกันความลับหลุดตอนจบ
  • Software Testing
    • 👦Test-First Design
    • 👦Test-Driven Development
      • 1.มารู้จักกับ TDD กันดีกว่า
      • 2.Test cases เขาเขียนกันยังไงนะ
      • 3.เครื่องมือในการทดสอบ
      • 4.การใช้ Theory และ InlineData
      • 5.โค้ดที่ทดสอบได้
      • 6.Mantra of TDD
      • 7.Functional & None-Functional testing
      • 8.Manual vs Automation testing
      • 9.Automation Frameworks in .NET
      • 10.Mock Framework
      • 11.มาเรียนการใช้ Moq กันเถอะ
      • 12.สรุป
  • Web
    • 👦Web API
      • 1.Web API คืออะไร
      • 2.ติดตั้ง .NET Core SDK
      • 3.สร้าง Web API ตัวแรกกัน
      • 4.Verbs
      • 5.Swagger เพื่อคู่ API
      • 6.การใช้ Model
      • 7.เรียก Web API ผ่าน Postman
      • 8.มาจัดกลุ่ม API กัน (1/2)
      • 9.มาจัดกลุ่ม API กัน (2/2)
  • Software Design
    • 🤴Design Patterns
      • 🦈Creational patterns
        • Abstract Factory
        • Builder
        • Factory Method
        • Prototype
        • Singleton
      • 🦈Structural patterns
        • Adapter
        • Bridge
        • Decorator
        • Facade
        • Proxy
      • 🦈Behavioral patterns
        • Chain of Responsibility
        • Command
        • Iterator
        • Mediator
        • Memento
        • Observer
        • State
        • Strategy
        • Template Method
        • Visitor
Powered by GitBook
On this page
  • 🔥 Build Pipeline
  • สร้าง Continuous Integration
  • ผลลัพท์
  • แก้ไข Continuous Integration
  • 🔥 ลองแก้โค้ด

Was this helpful?

Export as PDF
  1. Cloud Computing
  2. Azure DevOps

ลองทำ Continuous Integration (CI)

Previousเล่นกับ RepositoryNextลองทำ Continuous Delivery (CD)

Last updated 5 years ago

Was this helpful?

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

คำเตือน ถ้าเพื่อนๆต้องการทำตามบทความนี้ จะต้องมีโปรเจคใน Azure DevOps ที่มีการนำ source code ตัว asp.net core mvc ขึ้นมาไว้บน repository เสียก่อน แต่ถ้าใครยังไม่มีก็สามารถไปทำตามได้จากบทตัวนี้ก่อน แล้วค่อยกลับมาทำตามบทความนี้ก็ได้ครัช

หลังจากที่เราได้นำ source code ของเว็บ asp.net core mvc ขึ้นมาไว้บน Azure DevOps เรียบร้อยแล้ว ถัดมาเราก็จะทำการสร้าง Build pipeline เพื่อทำให้โปรเจคของเรามันทำการตรวจสอบความถูกต้องของโค้ดที่เรานำขึ้นมาต่อ โดยเป้าหมายของการทำ Build pipeline คือการทำให้ของทุกอย่างมันกลายเป็น Automation ไปทั้งหมดเพื่อลดการเสียเวลาของคนนั่นเอง ดังนั้นเราไปดูกันต่อเบย

🔥 Build Pipeline

ในการทำ Build Pipeline นั้นมันมีให้เราเล่นหลายส่วนเลย ซึ่งเนื้อหาของรอบนี้จะสอนการทำ Continuous Integration หรือที่เราเรียกย่อๆว่า CI ก่อนส่วนเรื่องที่เหลือจะแยกเอาเป็นบทถัดไปนะจ๊ะ ซึ่งเราสามารถเข้าไปจัดการ Build pipeline ได้จากเมนูด้านซ้ายมือในหมวดของ Pipeline นั่นเอง ดังนั้นจิ้มมันไปซะ

Continuous Integration โดยการทำงานของ CI คือ เมื่อคนในทีมทำงานเสร็จแล้ว มันก็จะมีระบบที่เอามาตรวจสอบว่างานของเขาเรียบร้อยดีหรือเปล่า เช่น มี error ที่ทำให้ build ไม่ผ่านหรือเปล่า เทสเคสทำงานได้สมบูรณ์ไหม การตั้งค่าต่างๆเป็นไปตามที่ทีมตกลงกันหรือเปล่า บลาๆ หรือพูดง่ายๆว่า เป็นการตรวจสอบว่างานที่ทำเสร็จตัวนี้สามารถทำงานได้ตามที่ทีมตกลงกันไว้

อย่างที่บอกว่าการทำ Build pipeline มันมีให้เราเลือกเล่นหลายอย่าง ซึ่งบทความนี้จะเน้นไปที่ CI ดังนั้นการตั้งค่าต่างๆจะอยู่ในหมวดย่อยที่ชื่อว่า Builds นั่นเอง

สร้าง Continuous Integration

เจ้าโปรเจคของเราพอดีว่ามันพึ่งถูกสร้างขึ้นมาใหม่ มันก็จะยังไม่มี Build อะไรเลย ดังนั้นที่ด้านขวามือกดจงกด New pipeline ลงไปซะ

ถัดมาเขาก็จะถามว่าตัว source code ที่เราจะเอามา Build นั้นมันอยู่ที่ไหน โดยเราสามารถเอา source code มาจากที่อื่นที่ไม่ได้อยู่ใน Azure DevOps ก็ได้นะ แต่ในตัวอย่างรอบนี้ขอเล่นท่าพื้นฐานก่อนนั่นก็คือเอา source code มาจาก Azure repository ยังไงล่ะ ก็จิ้มมันลงป๊ายย

ถัดไปเขาก็จะถามว่าจะให้มันเอางานมาจาก Repository ตัวไหน ซึ่งในตัวอย่างผมมี repo เดียว ดังนั้นก็เลือกมันไปซะ

Azure Repository อย่างที่บอกว่าภายใน 1 project ที่อยู่ใน Azure DevOps นั้น เราสามารถสร้าง Repository ขึ้นมาได้มากกว่า 1 ตัวนะจ๊ะ จะเป็น private ทั้งหมดเลยก็ได้

ถัดมาเขาก็จะถามว่าจะกำหนดการ Build เจ้า source code เรายังไงดี ซึ่งในตัวอย่างผมอยากโชว์ของบางอย่างเพิ่มหน่อยนึง ดังนั้นกด Show more ไปโลด

เขาก็จะโชว์ออกมาให้เห็นทั้งหมดเลยว่าเราสามารถ build source code แบบไหนได้บ้าง และต่อให้ไม่มีในรายการพวกนี้ เราก็ยังสามารถ custom build ได้อีกนะ (ชอบมากเพราะมัน build Xcode ให้ผมได้ด้วย 😍)

กลับมาเข้าเรื่องของเรากันต่อ ใน source code ของผมคือ asp.net core mvc ดังนั้นผมก็จะเลือกตัว build เป็น ASP.NET Core ไปจ๊า

เขาก็จะเตรียมอะไรต่างๆนิดหน่อย พอเสร็จแล้วก็จะได้หน้าตาออกมาประมาณนี้ ซึ่งในตอนนี้ผมยังไม่อยากลงรายละเอียดว่ามันคืออะไร แต่เอาเป็นว่ามันพร้อมที่จะ build source code เราเรียบร้อยละ ดังนั้นกด Save and run โลด

เขาก็จะให้เราบันทึกการตั้งค่านี้ลงไป (การบันทึกของพวกนี้ก็เหมือนกับการ commit การทำ build นั่นแหละ) ซึ่งจากตรงนี้ถ้ากำหนดค่าเสร็จแล้วก็กด Save and run ด้านล่างขวาสุดอีกที

เรียบร้อยตัว Azure DevOps ก็จะเริ่มนำ source code ของเราไป build ให้เราละ ตอนนี้ก็ได้แต่สวดมนต์อย่าให้มันมี error ไม่ก็ไปหากาแฟมาดื่มซักแก้ว

ผลลัพท์

เรียบร้อยละพอมัน build เสร็จเขาก็จะออกรายงานผลออกมาให้เรา ซึ่งในตัวอย่างของผมนั้นมัน build ได้ผ่านหมดไม่มีข้อผิดพลาดตรงไหนเลยก็จะออกมาราวๆนี้

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

ถัดมาในหมวดของ Summary เขาก็จะสรุปให้เราดูว่าไอ้ที่ build ไปนั้นผลเป็นยังไง มี commit ไหนบ้างที่เกี่ยวข้อง และสุดท้ายเคยถูกเอาไป deploy สักครั้งหรือเปล่า (ในส่วนของการ deploy จะอยู่ในเรื่อง Continuous Delivery ของบทถัดไปครัช)

ส่วนในหมวด Test จะเป็นการสรุปว่า test cases ต่างๆของเราผ่านครบหมดหรือเปล่า ซึ่งในโปรเจคของเรายังไม่มีในส่วนนี้ ดังนั้นพอกดเข้าไปมันก็จะบอกว่ายังไม่มีนะจ๊ะ ลองไปสร้างเล่นแล้ว push ขึ้นมาใหม่ดูสิ

แก้ไข Continuous Integration

หลังจากที่เราได้ลองสร้าง CI และลอง Run จนเสร็จเรียบร้อยแล้ว คราวนี้ถ้าเราอยากจะไปแก้ไข CI ที่เรามีอยู่ก็สามารถทำได้โดยการกดที่เมนู Builds เจ้าเก่าตามรูปด้านล่าง

หลังจากกดไป เขาก็จะเปิด Build ทั้งหมดที่เรามีออกมาให้ ซึ่งจากขั้นตอนทั้งหมดเรามี 1 ตัวที่ทำงานเสร็จแล้ว ดังนั้นเราก็จะเห็นหน้าตาประมาณนี้

ซึ่งจากจุดนี้ถ้าอยากแก้ไขตัว build อันไหนก็ให้เลือก build ที่ต้องการจะแก้ แล้วกดปุ่ม Edit ด้านบนขวาเอาเด้อ

🔥 ลองแก้โค้ด

จากตรงนี้ผมก็จะลองไปแก้ไขโค้ดในเครื่องผมนิดหน่อยแล้วทำการ push งานขึ้นมาใหม่อีกครั้ง โดยแก้ไขไฟล์

saladpuk\Views\Home\Index.cshtml

โดยแก้โค้ดบรรทัดที่ 2 เป็นแบบนี้

ViewData["Title"] = "Saladpuk Home Page";

แล้วก็ทำการ commit + push งานขึ้นไปอีกครั้งด้วยคำสั่ง

git add .
git commit -am "Changed the home title"
git push

พอเรา push งานได้เรียบร้อย ลองกลับไปดูที่ตัว Azure DevOps ของเราอีกครั้งในเมนู Builds เหมือนเดิม เราจะพบว่า มันกำลัง build source code ที่เราพึ่ง push ขึ้นไปให้เราอยู่นั่นเอง นี่แหละพลังแห่ง Automation ที่จะช่วยตรวจสอบโค้ดต่างๆให้เราอัตโนมัติทันทีที่งานมีการแก้ไข

จากตรงนี้เราก็น่าจะเห็นภาพคร่าวๆกันแล้วนะว่า การทำ Build pipeline ในส่วนของ Continuous Integration หรือที่เราเรียกกันติดปากว่า CI นั้นมันทำง่ายแค่ไหน ซึ่งเจ้านี่แหละจะช่วยลดเวลาของเหล่า developer ลงได้เยอะเลยถ้าเราใส่ กฎกติกา ของทีมเราลงไปในการทำ build เช่น ถ้า test cases พวกนี้ไม่ผ่านไม่ให้ไปต่อ หรือ ถ้าเรื่องนี้ยังไม่ได้ก็ต้องมีการ report บลาๆนั่นเอง

ซึ่งจากจุดนี้ในบทถัดไปเราจะไปดูในเรื่องของการทำ Build pipeline ในส่วนที่ 2 กันบ้างนั่นคือการทำ Continuous Delivery หรือ CD นั่นเอง เพื่อช่วยให้เราเอางานขึ้น Environments ต่างๆได้โดยที่ไม่เกิดข้อผิดพลาดนั่นเอง ดังนั้นกดปุ่ม Next ด้านล่างเพื่ออ่านบทถัดไปเบย

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

Failed to push ถ้าทำตามขั้นตอนที่ผมเขียนไว้เป๊ะๆจะพบว่ามัน push ไม่ได้นะครับ เราต้องใช้คำสั่ง git pull ลงมาก่อน แล้วเราจะเห็นว่ามันมี commit ที่เราไปตั้งค่า build pipeline อยู่ด้วยนั่นเอง นั่นแสดงว่าทุกอย่างที่อยู่บน Azure DevOps นั้นก็มี git state อยู่นั่นเองครัช คราวนี้ก็หวานหมูเราเลยเพราะทุกอย่างเราสามารถย้อนหน้าถอยหลังได้หมดอย่างแท้จริง เพราะเขาเตรียมให้เราทำสิ่งที่เรียกว่า Infrastructure as Code ไวเรียบร้อยแบ๊ว ส่วนมันคืออะไรก็ไปอ่านคร่าวๆได้จากลิงค์นี้ครัช

👶
Microsoft document - Build, test, and deploy .NET Core apps
👶 DevOps พื้นฐาน - (IaC)
👶 Azure DevOps
เล่นกับ Repository
มองไม่เห็นก็กดที่รูปเอาละกันนะ
เสียใจด้วยรูปโปรไฟล์หล่อๆอันนี้เป็นของผมนะจุ๊