Merge branch 'main' into develop

.github/workflows/build.yaml

@@ -0,0 +1,24 @@
+name: Build Doc
+
+on:
+  pull_request:
+    branches:
+      - main
+      - develop
+
+jobs:
+  # Build job
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0 # Not needed if lastUpdated is not enabled
+      - uses: oven-sh/setup-bun@v1 # Uncomment this if you're using Bun
+
+      - name: Install dependencies
+        run: bun install
+
+      - name: Build with VitePress
+        run: bun run docs:build

.vitepress/config.mts

@@ -15,6 +15,7 @@ export default defineConfig({
         items: sidebarASPNetCore(),
       },
       "/paths/devops": { base: "/paths/devops/", items: sidebarDevOps() },
+      "/paths/typescript": { base: "/paths/typescript/", items: sidebarTypeScript() },
       "/paths/java": { base: "/paths/java/", items: sidebarJava() },
       "/paths/azure": { base: "/paths/azure/", items: sidebarAzure() },
       "/paths/cloud-computing": {
@@ -37,6 +38,14 @@ export default defineConfig({
         base: "/paths/mobile-development/",
         items: sidebarMobileApplicationDevelopment(),
       },
+      "/paths/practices": {
+        base: "/paths/practices/",
+        items: sidebarPractices()
+      },
+      "/paths/software-architecture": {
+        base: "/paths/software-architecture/",
+        items: sidebarSoftwareArchitecture()
+      }
     },
     socialLinks: [
       { icon: "github", link: "https://github.com/ThaiProgrammer/tpa-path" },
@@ -408,3 +417,91 @@ function sidebarMobileApplicationDevelopment(): DefaultTheme.SidebarItem[] {
     },
   ];
 }
+
+function sidebarPractices(): DefaultTheme.SidebarItem[] {
+  return [
+    {
+      text: "Software Development Practices",
+      items: [
+        {
+          text: "Design Practices",
+          collapsed: true,
+          base: "/paths/practices/design/",
+          items: [
+            { text: "Design Patterns", link: "design-patterns" }
+          ]
+        },
+      ]
+    }
+  ]
+}
+
+function sidebarSoftwareArchitecture(): DefaultTheme.SidebarItem[] {
+  return [
+    {
+      text: "Software Architecture",
+      items: [
+        {
+          text: "Introduction",
+          collapsed: true,
+          base: "/paths/software-architecture/introduction/",
+          items: [
+            { text: "What is software architecture?", link: "software-architecture-intro" },
+            { text: "Styles & Patterns", link: "styles-n-patterns" },
+          ]
+        }
+      ]
+    }
+  ]
+}
+
+function sidebarTypeScript(): DefaultTheme.SidebarItem[] {
+  return [
+    {
+      text: "TypeScript",
+      items: [
+        {
+          text: "Types ที่ใช้งานเป็นประจำ",
+          collapsed: true,
+          base: "/paths/typescript/everyday-types/",
+          items: [
+            { text: "Type คือข้อมูลชนิดหนึ่ง", link: "type-is-data" },
+            { text: "การจัดการกับ Object", link: "object-manipulation" },
+            { text: "Type Assertions", link: "runtime-type" },
+            { text: "จัดการ Try-Catch Error", link: "catch-error" },
+            { text: "จัดการ Runtime Type", link: "runtime-type" },
+          ],
+        },
+        {
+          text: "คู่มือ TypeScript",
+          collapsed: true,
+          base: "/paths/typescript/handbook/",
+          items: [
+            { text: "Generics", link: "generics" },
+            { text: "Utility Types", link: "utility-types" },
+            { text: "conditional types (แบบมีเงื่อนไข)", link: "conditional-types" },
+            { text: "Function Overload", link: "function-overload" },
+            { text: "Enum", link: "enum" },
+            { text: "Keyof", link: "keyof" },
+            { text: "Narrowing Type", link: "narrowing-type" },
+            { text: "Mapped Types", link: "mapped-types" },
+            { text: "การปรับแต่ง Type", link: "type-manipulation" },
+          ]
+        },
+        {
+          text: "Cookbook",
+          collapsed: true,
+          base: "/paths/typescript/cookbook/",
+          items: [
+            { text: "สร้าง enum ใช้เอง แบบที่ Key กับ Value เหมือกัน", link: "create-own-enum-string" },
+            { text: "เลือกบาง Property จาก Record", link: "filter-some-property-of-record" },
+            { text: "สร้าง Builder Pattern แบบ Type-Safe ", link: "type-safe-builder-pattern" },
+            { text: "สร้าง union type from array", link: "create-union-type-from-array" },
+            { text: "เพิ่ม Prefix ในแต่ละ Property Key ใน Object", link: "append-prefix-object-property-key" },
+            { text: "Data Validation ด้วย Zod ใช้คู่กับ TypeScript ได้", link: "zod-typescript-integration" },
+          ]
+        }
+      ],
+    },
+  ];
+}

index.md

@@ -20,6 +20,12 @@ hero:
   }
 
 features:
+  - title: Practices
+    details: กระบวนการ วิธีการ และหลักการที่ใช้ในการพัฒนาและดูแลรักษาซอฟต์แวร์ที่ใช้กันอย่างแพร่หลายในปัจจุบัน
+    link: /paths/practices
+  - title: Software Architecture
+    details: เนื้อหาเกี่ยวกับ Software Architecture รูปแบบต่างๆที่ใช้ในการพัฒนาซอฟต์แวร์
+    link: /paths/software-architecture
   - title: Web Development Guideline
     details: รวบรวมเนื้อหาที่คิดว่าเป็นประโยชน์ให้เห็นภาพกว้างในการเข้ามาทำงานในสาย Web Developers
     link: /paths/web-guideline
@@ -32,6 +38,9 @@ features:
   - title: Source Code Control
     details: แนวทางการดูแลและควบคุม Source Code ที่เราทำงานกันเป็นทีมได้อย่างมีประสิทธิภาพครับ
     link: /paths/sourcecodecontrol 
+  - title: TypeScript
+    details: เนื้อหาที่เกี่ยวกับ TypeScript การใช้งาน Type ในชีวิตจริง และคู่มือการใช้งานและ Cookbook
+    link: /paths/typescript
   - title: ASP.Net Core
     details: ขั้นตอนแนะนำในการเตรียมความพร้อมเพื่อพัฒนา Website ด้วย ASP.NET Core ในปี 2024
     link: /paths/aspnet-core
@@ -47,5 +56,4 @@ features:
   - title: Azure
     details: รวบรวมเนื้อหาที่เกี่ยวกับการใช้งาน Microsoft Cloud - Azure ในการพัฒนาระบบ
     link: /paths/azure
----
-
+---

paths/practices/design/design-patterns.md

@@ -0,0 +1,22 @@
+# Design Patterns
+Design Patterns เป็นชุดของวิธีการแก้ไขปัญหาที่ใช้บ่อยในวิศวกรรมซอฟต์แวร์ ซึ่งออกแบบมาเพื่อเพิ่มความสามารถในการนำกลับมาใช้ใหม่และความยืดหยุ่นของโค้ด โดยเฉพาะในการแก้ปัญหาที่มีลักษณะเดียวกันและมีความซับซ้อน โดยมีรูปแบบการใช้งานที่เป็นไปตามหลักการที่ได้รับการยอมรับว่าเป็นวิธีการที่ดีในการแก้ปัญหาลักษณะนั้นๆ
+
+## ประเภทของ Design Patterns
+Design Patterns ที่ออกแบบโดย Gang of Four ประกอบด้วย 23 รูปแบบ ซึ่งแบ่งออกเป็น 3 กลุ่มหลักๆ ดังนี้:
+
+1. **Creational Patterns**: เกี่ยวข้องกับวิธีการสร้าง object
+2. **Structural Patterns**: เกี่ยวข้องกับการจัดโครงสร้าง class และ object
+3. **Behavioral Patterns**: เกี่ยวข้องกับการสื่อสารและการทำงานร่วมกันระหว่าง object
+
+ซึ่ง patterns ทั้งหมดมีการอธิบายอย่างละเอียดรวมทั้งมีภาพประกอบในเวบไซต์ [Refactoring Guru](https://refactoring.guru/design-patterns)
+แต่ถ้ายังไม่มีเวลาศึกษาทั้งหมด สามารถเริ่มต้นจาก Cheat sheet ด้านล่างนี้ได้เลย
+
+## Design Pattern Cheat Sheet
+ผู้เขียน: คุณ [เปิ้ล](https://medium.com/@rachanee)
+
+ในบทความ [Design Pattern Cheat Sheet](https://medium.com/@rachanee/design-pattern-cheatsheet-8a8ea94e3777) มีสรุป Design Patterns ทั้ง 23 รูปแบบให้สั้นกระชับ เข้าใจง่าย มีรูปภาพประกอบพร้อมคำอธิบาย รวมทั้งข้อดีและข้อควรระวังของแต่ละ pattern ไว้ให้ด้วย แนะนำให้พิมพ์เก็บไว้ใช้อ้างอิงเวลาออกแบบ class และ object ได้เลย
+
+## ตัวอย่างการใช้ Design Patterns
+- ใช้ Singleton Pattern ในการจัดการการเข้าถึงทรัพยากรที่ใช้ร่วมกัน เช่น การเชื่อมต่อฐานข้อมูล เพื่อหลีกเลี่ยงการสร้างหลาย instance ที่ไม่จำเป็น
+- ใช้ Observer Pattern ในการออกแบบระบบที่ต้องการการแจ้งเตือนและการตอบสนองต่อการเปลี่ยนแปลงของสถานะ เช่น ในระบบการแจ้งเตือน (notification system)
+- ใช้ Factory Method เพื่อสร้างอ็อบเจ็กต์ในลักษณะที่ทำให้การสร้างอ็อบเจ็กต์นั้นยืดหยุ่นและสามารถปรับเปลี่ยนได้ตามความต้องการ

paths/practices/index.md

@@ -0,0 +1,43 @@
+---
+outline: deep
+title: 'Software Development Practices'
+description: กระบวนการ วิธีการ และหลักการที่ใช้ในการพัฒนาและดูแลรักษาซอฟต์แวร์
+---
+
+# Software Development Practices
+**Software Development Practices** คือ แนวคิด กระบวนการ วิธีการ และหลักการที่ใช้ในการพัฒนาและดูแลรักษาซอฟต์แวร์ให้มีคุณภาพสูง สามารถตอบสนองความต้องการของผู้ใช้ได้อย่างดี และช่วยให้ทีมพัฒนาทำงานได้อย่างมีประสิทธิผลเพื่อบรรลุเป้าหมายที่กำหนดไว้
+
+## ความสำคัญของ Software Development Practices
+1. **คุณภาพของซอฟต์แวร์**: การใช้วิธีการที่เหมาะสมช่วยให้ซอฟต์แวร์มีความเสถียร ปลอดภัย และทำงานได้ตรงตามความต้องการของผู้ใช้
+2. **ประสิทธิภาพการทำงาน**: การมีแนวทางและขั้นตอนที่ชัดเจนทำให้ทีมสามารถทำงานร่วมกันได้อย่างมีประสิทธิภาพ ลดความสับสน และช่วยให้โครงการเสร็จทันตามกำหนดเวลา
+3. **การจัดการความเสี่ยง**: การใช้แนวทางปฏิบัติที่ดีช่วยในการตรวจสอบและลดความเสี่ยงที่อาจเกิดขึ้นในการพัฒนาซอฟต์แวร์ในทุกขั้นตอน ตั้งแต่การวางแผน การจัดลำดับความสำคัญ การเขียนโค้ด การทดสอบ ไปจนถึงการ deploy และ maintenance
+
+## ตัวอย่าง Software Development Practices
+### Ways of Working
+- **Agile Methodologies**: เช่น Scrum และ Kanban ที่เน้นการพัฒนาแบบ Iterative Development และการปรับปรุงอย่างต่อเนื่อง
+- **Pair Programming**: การทำงานคู่กัน 2 คน(หรือมากกว่า) เพื่อเพิ่มคุณภาพและลดข้อผิดพลาด
+
+### Coding Practices
+- **Automated Testing**: การเขียนเทสอัตโนมัติเพื่อตรวจสอบความถูกต้องแทนการใช้การทดสอบด้วยมือเพื่อทดสอบระบบอย่างต่อเนื่องและมีประสิทธิภาพ
+- **Test-Driven Development (TDD)**: การเขียนเทสก่อนแล้วจึงเขียนโค้ดเพื่อให้เทสนั้นๆ ผ่าน ช่วยให้โค้ดที่เขียนมีคุณภาพและทดสอบได้ง่ายขึ้น (testable code) รวมทั้งทำให้มั่นใจว่าเทสที่เขียนสามารถจับข้อผิดพลาดได้จริง (red-green-refactor)
+- **Version Control**: การใช้ระบบควบคุมเวอร์ชัน เช่น Git เพื่อจัดการการเปลี่ยนแปลงของโค้ด และทำให้ทีมสามารถทำงานร่วมกันได้ง่ายขึ้น
+- **Code Refactoring**: การปรับปรุงโค้ดเพื่อเพิ่มความเข้าใจ ลดความซับซ้อน และเพิ่มประสิทธิภาพของโค้ดอย่างต่อเนื่อง
+- **Code Review**: การตรวจสอบโค้ดโดยเพื่อนร่วมทีมเพื่อเพิ่มคุณภาพและลดข้อผิดพลาดก่อนการ merge โค้ดเข้า main branch
+
+### Design Practices
+- **Design Patterns**: ใช้รูปแบบการออกแบบที่ได้รับการยอมรับว่าเป็นวิธีการที่ดีในการแก้ปัญหาที่คล้ายกัน
+- **Domain-Driven Design (DDD)**: การออกแบบระบบโดยให้ความสำคัญกับโดเมนของระบบ และแบ่งระบบออกเป็นโดเมนย่อยๆ
+- **Microservices Architecture**: การออกแบบระบบเป็นส่วนย่อยๆ ที่เป็นอิสระกัน ทำให้ง่ายต่อการปรับปรุง และลดความซับซ้อนของระบบ
+
+### Deployment Practices
+- **Continuous Integration (CI)**: การ integrate โค้ดที่พัฒนาใหม่เข้าสู่ระบบหลัก หรือ main branch บ่อยๆ เพื่อตรวจสอบความถูกต้องและลดปัญหาการ merge conflicts
+- **Continuous Deployment (CD)**: การ deploy โค้ดใหม่เข้าสู่ production อยู่เรื่อยๆ โดยไม่รอ deploy ที่เดียวเยอะๆ (big-bang release) เพื่อลดความเสี่ยงและช่วยให้เห็นปัญหาได้เร็วขึ้น
+
+### Other Practices:
+- **Containerization**: การใช้เทคโนโลยี container เช่น Docker เพื่อแยกแยะและจัดการทรัพยากรอย่างมีประสิทธิภาพ
+- **Infrastructure as Code (IaC)**: การจัดการ infrastructure ในรูปแบบของโค้ดซึ่งมี version control และสามารถ deploy ได้โดยอัตโนมัติ
+- **Living Documentation**: การอัปเดตเอกสารประกอบการพัฒนาซอฟต์แวร์อยู่เสมอเพื่อให้สอดคล้องกับโค้ดปัจจุบันจะช่วยให้ทีมพัฒนาและผู้มีส่วนเกี่ยวข้องสามารถเข้าใจระบบและการเปลี่ยนแปลงของระบบได้ตลอดเวลา
+- **Error Handling and Logging**: จัดการข้อผิดพลาดในระบบและการบันทึกข้อมูลเพื่อการ investigate ปัญหาอย่างมีประสิทธิภาพ
+- **Continuous Monitoring**: การมีระบบตรวจสอบและ monitor ระบบที่มีประสิทธิภาพ เพื่อให้สามารถเห็นและแก้ปัญหาได้อย่างรวดเร็ว
+- **Security Best Practices**: การปฏิบัติตามแนวทางที่ดีในเรื่องความปลอดภัยของระบบเพื่อป้องกันปัญหาด้านความปลอดภัย เช่น การโจมตีหรือการเข้าถึงข้อมูลที่ไม่เหมาะสม
+- **Performance Optimization**: การปรับปรุงประสิทธิภาพของระบบเพื่อความพอใจของผู้ใช้งานและการประหยัดทรัพยากรของระบบ