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

ภาพรวมหัวข้อการอบรม

• Module 1: การเตรียมเครื่องมือและความพร้อมทั้งบน Mac และ Windows
• Module 2: แนะนำภาพรวมหลักสูตร
• Module 3: พื้นฐานการทำงานกับ Laravel 8
• Module 4: การสร้าง Rest API ใน Laravel 8
• Module 5: พื้นฐาน Vue.js 3
• Module 6: พื้นฐานการออกแบบด้วย Tailwind CSS 3 ร่วมกับ Vue 3
• Module 7: การสร้าง Single Page Application (SPA) ด้วย Vue 3 และ Tailwind CSS
• Module 8: พื้นฐาน Livewire ร่วมกับ Laravel 8
• Module 9: Workshop Laravel 8 ร่วมกับ Livewire และ Tailwind CSS
• Module 10: การ Deployed โปรเจ็กต์บน Cloud hosting เช่น Heroku และ Netlify

รายละเอียดหลักสูตร

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 8

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

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

• ขึ้นโปรเจ็กต์ Laravel สำหรับสร้าง Rest API
• ติดตั้ง Laravel Sanctum สำหรับ Authentication API
• การตั้งค่า Authentication ด้วย Sanctum
• การสร้าง Resource สำหรับ Rest API
• การสร้าง Resource Collection
• การสร้างและกำหนด API Operation แบบต่าง ๆ
• การเขียน Validation API ใน Laravel 8
• การ 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 2 ร่วมกับ Vue 3

• รู้จัก Tailwind CSS 2 เบื้องต้น
• การใช้งาน component ต่าง ๆ ใน tailwind css 2
• การ Setup Vue 3 ร่วมกับ Tailwind CSS2
• การออกแบบ Layout ร่วมกับ TailWind CSS 2
• รู้จัก 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 8

• ติดตั้ง 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 8 ร่วมกับ Livewire และ Tailwind CSS

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

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

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

แจกฟรีเทมเพลตระบบหลังบ้าน (Admin Template) Laravel 8 with Vue 3 ร่วมกับ Tailwind CSS

คุณสมบัติของ Template:

• Laravel 8
• TailwindCSS 2
• Authentication
• Well Organized Frontend Structure
• Helper Functions
• Fully Responsive Layout
• SASS Powered
• Modular JS & CSS Code
• Webpack Compiler with Laravel Mix
• 100+ HTML5 Templates
• 3 Menu Variants
• 3 Form Wizard Layouts
• 3 Blog Layouts
• 2 Pricing Layouts
• 2 Invoice Layouts
• 3 FAQ Layouts
• Unique Login Page
• Unique Register Page
• Unique Error Page
• Update Profile Page
• Change Password Page
• 3 Users Layouts
• 3 Profile Settings Layouts
• Post News Applications
• Inbox Applications
• File Manager Applications
• Chat Applications
• POS Applications
• CRUD Applications
• Regular & Datatable Grid
• Accordion Components
• Button Components
• Modal Components
• Alert Components
• Progressbar Components
• Tooltip Components
• Dropdown Components
• Toast Components
• Typography Components
• Tons of Icon
• Regular Form
• Datepicker Components
• Select2 Components
• Dropzone Components
• Sumernote Editor Components
• Validation Form Components
• Chart Widget
• Slider Widget
• Image Zoom Widget
• Addon Utilities and Helper Classes