สอน VueJS / NuxtJS / Javascript วีดีโอ ตั้งแต่เตรียมเครื่อง ยันเขียนเป็น

สวัสดีครับ ผมศักดิ์ เปิดบริษัท Softwarehouse มากว่า 10 ปี ประสบการณ์ด้าน Programming 10 ปี รับเขียนโปรแกรมมามากมายหลายภาษา/Framework ครับ

สำหรับคนที่พึ่งเริ่มเขียนโปรแกรมแบบไม่มีพื้นฐาน ผมแนะนำให้ลองอ่านหนังสือที่ผมแต่งเองขึ้นมา สำหรับผู้เริ่มต้นก่อนนะครับ ช่วยอุดหนุนหน่อยครับ

กดที่นี่เพื่อเข้าไปซื้อหนังสือครับ

ผมพยายามทำและรวบรวมวีดีโอที่ผมทำเอง และ ถ้าเป็นไปได้จะพยายามเอาวีดีโออื่นๆที่เกี่ยวข้องมารวมด้วยครับ (ข้ามไปดูวีดีโอด้านล่างสุดได้เลยครับ สำหรับคนใจร้อน)

Youtube Channel SaKKosama 🐶 กดติดตามหน่อยนะครับ

เป้าหมายคือ อยากให้เป็นประโยชน์กับทุกๆคน ไม่ว่าจะพนักงานของผมเอง หรือ จะเป็นคนที่มีความสนใจศึกษา VueJS / NuxtJS และอยากให้มี Developer ชาวไทยเยอะขึ้นครับ

List ข้อดีของ VueJS + NuxtJS

1. เขียนง่าย เขียนเร็ว ขอแค่เขียน Javascipt เป็น
2. Support SSR, SPA, PWA
3. ไม่ต้องเขียน JSX แต่จะเขียนก็ได้
4. Library / Components ช่วยเยอะแยะมากมาย
5. Doc อ่านเข้าใจง่ายมาก

แถมนิดนึงสำหรับคนอยาก deploy nuxtjs โดยใช้ Google Cloud Run (Serverless ครับ)

Deploying Nuxtjs on Google Cloud Run (Serverless)

วีดีโอเริ่มต้นครับ สำหรับคนได้เครื่องใหม่มา หรือว่าอยาก clean up เครื่อง

• วิธีเตรียม MACOS Catalina จากเครื่องใหม่ จนพร้อมใช้งาน
• วิธีเตรียมเครื่องสำหรับ NodeJS อย่างเดียว
• สอนลง NodeJS บน Windows 10 ด้วย NVM สลับ Version Node ได้ไม่จำกัด

วีดีโอ

• Full Playlist ครับ

แยกร่างครับ

• Nuxt+Vue EP1: Creating NuxtJS Project
• Nuxt+Vue EP1.1: Atom Text editor guide (มือใหม่ต้องดูครับ)
• Nuxt+Vue EP2: Basic VueJS
• Nuxt+Vue EP3: Creating Components
• Nuxt+Vue EP4: Vue Instance
• Nuxt+Vue EP5: Vue Template Syntax
• Nuxt+Vue EP6: Compute and Methods
• Nuxt+Vue EP7: Vue Watch + NuxtJS install/import library
• Nuxt+Vue EP8: Adding Class and Styles
• Nuxt+Vue EP9: $EMIT, Listen to component custom events
• Nuxt+Vue EP10: Call API + Vuetify Framework on NuxtJS
• Nuxt+Vue EP10.1: Call API + iView UI Framework on NuxtJS
• Nuxt+Vue EP11: Nuxt Route, vue-router, Named route (Vuetify)
• Nuxt+Vue EP12: Javascript Async Await
• Nuxt+Vue EP13: Nuxt Store, Vuex, Vuetify Drawer State
• Nuxt+Vue EP14: Vuetify Layout Tutorial (Clean up code)
• Nuxt+Vue EP15: Workshop - Nuxt Auth Login and Vuetify preparation for CRUD
• Nuxt+Vue EP16: Workshop - CRUD+REST API after Login
• สร้าง API EP15,EP16 ด้วย Ruby on Rails
• Nuxt+Vue EP17: Import Components && Plugins
• Nuxt+Vue EP18: How to use asyncData?
• Nuxt+Vue EP19: How to use fetch?
• Nuxt+Vue EP20: Create Card Component and Using Vue Slots
• Nuxt+Vue EP21: Add Global Configs / Settings to Nuxtjs ENV

วิธี deploy NuxtJS ไป Google Cloud Run ครับ

• Introduction
• ลงทะเบียน Google Cloud Platform
• ลง Google Cloud CLI / Login ผ่าน Command Line (ต้องทำนะครับ)
• สร้าง Nuxt Project, Dockerfile, Cloud-build, และ deploy ไป Cloud run

Comments

[mouthdog]

ผมพึ่งหัด vue.js มาสองสัปดาห์ กำลังเรียนเรื่อง vuex จากเว็บ veumastery.com แต่ว่าหมดเวลาไปก่อน ผมสามารถมาเริ่มเรียนจากคอร์สตรงนี้ได้เลยไหมครับ. สิ่งที่ได้เรียนมาในสองสัปดาห์นี้คือ
1.Intro to Vue.js
2.Real World Vue.js
3.Mastering Vuex <- ยังไม่จบ
รบกวนด้วยครับ.

[SaKKo]

vuex ผมว่ายังไม่ใช่เรื่องใหญ่ครับ
แนะนำให้ดูเรียงที่ผมสอนก็ดีครับ ผมว่าผมเรียงไว้พอสมควร ปรกติพนักงานผมจะต้องทำเรียงตามนี้ครับ
แต่ถ้าสนใจก็ดูเรื่อง state ในวีดีโอของผมได้ครับ EP13 ครับ

[KanexKane]

ดูไป 5 ตอน คลิปเสียงเบาไปหน่อยครับ แต่สอนได้เข้าใจง่ายมากๆ ขอบคุณครับ

[SaKKo]

หลังๆดังขึ้นแล้วครับ แรกๆมันเร่งเสียงไม่ได้ นอกจากอัดใหม่เลยครับ

[Maprangsoft]

ขอบคุณครับ

[Mr.Somkid]

ใช้ Vuetify สอนอัพโหลดรูปภาพแบบหลายรูปหน่อยครับ สามารถแสดงรูปภาพก่อนอัพโหลดได้ด้วยครับ

[Tak]

ถ้าต้องใช้ nuxtjs ร่วมกับ typescript เวลาเขียนมาแล้วจะออกมาเป็นแบบไหนครับ
นึกไม่ออกว่าต้องแบ่ง folder ยังไงครับ