Laravel 9 ร่วมกับ Vue.js 3 Tailwind CSS 3 และ Livewire

Module 1: การเตรียมเครื่องมือและความพร้อมทั้งบน Mac และ Windows

• วิธีการติดตั้งเครื่องมือและตั้งค่าบนระบบ Windows
• วิธีการติดตั้งเครื่องมือและตั้งค่าบนระบบ MacOS
• การติดตั้ง Editor สำหรับพัฒนาเช่น VSCode, PhpStorm เป็นต้น
• การติดตั้งตัวจำลอง Web Server เช่น XAMPP, MAMPP, WAMPP เป็นต้น
• การติดตั้ง Composer
• การติดตั้ง Node.JS
• การติดตั้ง Git
• การติดตั้ง Postman
• การสร้างฐานข้อมูลใหม่สำหรับ Laravel

Module 2: แนะนำภาพรวมหลักสูตร

• แนวทางการพัฒนาเว็บแอพพลิเคชั่นในปัจจุบัน
• รู้จักสายงาน frontend developer
• รู้จักสายงาน backend developer
• รู้จักสายงาน devops developer
• เส้นทางการเรียนรู้ที่สำคัญสำหรับสายงาน frontend และ backend developer
• เล่าภาพรวมสิ่งที่จะได้เรียนรู้ทั้งหมดจากหลักสูตรนี้

Module 3: พื้นฐานการทำงานกับ Laravel 9

• การติดตั้ง Laravel 9 ผ่าน Composer
• พื้นฐานการสร้างและจัดการ Routing บน Laravel 9
• พื้นฐานการทำงานกับ Controller บน Laravel 9
• การทำงานกับ View บน Laravel 9
• การวาง Layout เพื่อแยกส่วนโค๊ดให้ทำงานกับเว็บขนาดใหญ่ได้บน Laravel 9
• Laravel 9 กับการเชื่อมต่อและจัดการฐานข้อมูล
• ตัวอย่าง Workshop การเขียน CRUD Application เชื่อมต่อฐานข้อมูล MySQL

Module 4: การสร้าง Rest API ใน Laravel 9

• ขึ้นโปรเจ็กต์ Laravel สำหรับสร้าง Rest API
• ติดตั้ง Laravel Sanctum สำหรับ Authentication API
• การตั้งค่า Authentication ด้วย Sanctum
• การสร้าง Resource สำหรับ Rest API
• การสร้าง Resource Collection
• การสร้างและกำหนด API Operation แบบต่าง ๆ
• การเขียน Validation API ใน Laravel 9
• การ Handling Error
• การตั้งค่าเพิ่มเติมสำหรับการนำ API ไปใช้งานบน Production Server

Module 5: พื้นฐาน Vue.js 3

• ภาพรวม Vue 3
• การสร้าง Vue App
• รู้จัก Attribute Binding
• เรียนรู้ Conditional Rendering
• เรียนรู้ List Rendering
• การทำงานกับ Event Handling
• รู้จักและใช้งาน Class และ Style Binding
• การใช้งาน Computed Properties
• เรียนรู้ Component และ Props
• การใช้งาน Communicating Events
• การจัดการกับ Form และ v-model

Module 6: พื้นฐานการออกแบบด้วย Tailwind CSS 3 ร่วมกับ Vue 3

• รู้จัก Tailwind CSS 3 เบื้องต้น
• การใช้งาน component ต่าง ๆ ใน Tailwind CSS 3
• การ Setup Vue 3 ร่วมกับ Tailwind CSS2
• การออกแบบ Layout ร่วมกับ Tailwind CSS 3
• รู้จัก Vuex และการจัดการ State ใน Vue 3

Module 7: การสร้าง Single Page Application (SPA) ด้วย Vue 3 และ Tailwind CSS

• Install Vue Router
• Vue Layout using Tailwind CSS
• Header & Footer
• Route Links
• Design Login Page using Tailwind CSS
• Install Vuex
• Show Hide Navigation Links
• Navigation Guards.
• Dashboard
• Project Listing Page
• Project Detail Page
• Delete Project Functionality
• Add Project
• Edit Project
• Add/Edit/Delete Task

Module 8: พื้นฐาน Livewire ร่วมกับ Laravel 9

• ติดตั้ง Livewire
• การ Setting Livewire
• AJAX Call using Livewire
• Livewire properties
• Livewire Full Page Component
• Computed Properties
• Child Components
• Redirect & Flash Messages
• Livewire Events

Module 9: Workshop Laravel 9 ร่วมกับ Livewire และ Tailwind CSS

• ขึ้นโปรเจ็กต์ Laravel 9 ร่วมกับ Livewire และ Tailwind CSS
• เชื่อมต่อฐานข้อมูล
• เขียนส่วน CRUD แบบ AJAX Call
• การแบ่งหน้า Pagination
• การทำส่วนค้นหาแบบ AJAX Search
• การจัดเรียงข้อมูล Sorting

Module 10: การ Deployed โปรเจ็กต์บน Cloud hosting เช่น Heroku และ Netlify

• การสมัครเข้าใช้งาน Heroku Cloud hosting
• การเตรียม Project Laravel 9 สำหรับ deploy บน heroku
• การเชื่อมต่อฐานข้อมูล mysql บน heroku
• การ Deploy ส่วน SPA บน Netlify
• การ Config เพื่ออ่าน API Laravel จาก Heroku
• การแก้ปัญหาต่างๆ ที่พบระหว่างการ deployed