Course Online

ติดสปีดเว็บไซต์ด้วย
React & Next JS

  • React Hooks และการจัดการสถานะ 
  • Server-side Rendering ด้วย Next.js
  • ออกแบบ UI Components ด้วย React
  • การใช้งาน React ร่วมกับ Next.js และ API.  

พิเศษ แถมฟรีคอร์ส Node.js ให้เรียนเพิ่ม !    

มาทำความรู้จักกับ 3 เครื่องมือ

ที่ออกแบบมาเพื่อการเป็นนักพัฒนาเว็บไซต์

React

ไลบรารีสำหรับสร้าง UI บนเว็บไซต์ มีแนวคิด component-based และ virtual DOM ในการเพิ่มประสิทธิภาพ และมีการนำ JSX มาใช้ในการเขียนโค้ด ใช้งานง่าย สนับสนุน functional programming และมี ecosystem ที่ใหญ่มาก

Next.js

เป็น full-stack framework สำหรับ React สำหรับพัฒนาเว็บไซต์ที่รองรับ server-side rendering และ static site generation ซึ่งช่วยให้เว็บไซต์มีประสิทธิภาพและเป็นมิตรกับ SEO มากขึ้น มีคุณสมบัติสำคัญ เช่น file-based routing, code splitting, bundling และการ optimize ต่างๆ

Node.js

ระบบปฏิบัติการโอเพนซอร์สที่ใช้ JavaScript ในการรันบนเซิร์ฟเวอร์ มีจุดเด่นที่ event-driven, non-blocking I/O ทำให้มีประสิทธิภาพสูง เหมาะกับแอปเรียลไทม์ มี package manager ขนาดใหญ่ รันบนหลายแพลตฟอร์ม โดยใช้ JavaScript ทั้ง frontend/backend

เรียนหลักสูตร React & Next JS จบแล้ว ทำอะไรได้บ้าง ?

เรียนหลักสูตร React & Next JS
จบแล้ว ทำอะไรได้บ้าง ?

พัฒนา Performance ได้ถึง 2 เท่า

จากสถาปัตยกรรม Component-based ของ React และคุณสมบัติ Server-side Rendering ของ Next.js

ด้วยการแบ่งองค์ประกอบต่างๆ เป็น Components ใน React

ด้วยสถาปัตยกรรมแบบ Event-driven ของ Node.js

ใช้ภาษา JavaScript ตลอดทั้งกระบวนการ ตั้งแต่ Front-end ถึง Back-end ช่วยลดความซับซ้อน
และ Next.js มีเครื่องมือ Bundling, Compiling และ Deployment มารวมไว้ในตัว

ด้วยการใช้ Virtual DOM และการโหลดหน้าเว็บที่รวดเร็วของ Next.js

React & Next JS for front End Dev

หลักสูตรสอนอะไรบ้าง

บทเรียน
0
Workshop
0
ผู้สอน
0
ชั่วโมง
0

พื้นฐานที่ต้องมี

HTML / CSS / JavaScript

รายละเอียดโปรแกรม (ฟรีทั้งหมด)
Visual Studio Code / Postman / NodeJS / tailwind CSS / MongoDB (on cloud)
Google Chrome Web Browser / Git Version Control / Web browser

Learning Outcome

  • Basic Javascript for Frontend Developer
  • Setup และสร้าง React เบื้องต้นได้
  • สามารถแยกแยะระหว่าง Uncontrolled/
    Controlled/Stateful และ Stateless Components ได้
  • มีความเข้าใจในการ Render ข้อมูล Array ใน JSX และสามารถใช้งานฟังก์ชัน Map ได้เป็นอย่างดี
  • เข้าใจถึงความสำคัญของการใช้ Keys ในการ Render Arrays ใน JSX และสามารถใช้ Keys ในโค้ดของตนเองได้
  • เข้าใจ Event ใน React รู้วิธีการใส่ Event สามารถเชื่อมต่อ Event กับ Function
  • เข้าใจ Form Input ใน React และเทคนิคอื่นๆที่ใช้ สามารถสร้างและใช้ Form Input ใน React ได้และรับข้อมูลจาก User Input ไปใช้ต่อได้
  • สามารถใช้ Event และ State ร่วมกันใน React ได้
  • เข้าใจฟังก์ชัน Map ของ Array ประโยชน์ของมัน และ นำไปใช้งานได้
  • เข้าใจความหมายและวิธีการใช้งาน React Context ในการส่งค่าไปยัง Component อื่นๆ ในลักษณะที่เปลี่ยนแปลงได้
  • เข้าใจ Hooks เช่น Forward Refs และกฏของการใช้ Hooks และสามารถนำไปใช้ในการพัฒนา React application ได้อย่างถูกต้อง
  • ได้ Project “บันทึกรายรับรายจ่าย”
  • ได้ทำ Project Web form

ดูวีดีโอ / เนื้อหาคอร์ส / ผู้สอน คลิกปุ่มด้านล่าง

Learning Outcome

  • ผู้เรียนได้ทำเว็บไซด์อย่างง่าย 4 หน้า คือ หน้า Home / About / Blog และ Contact
  • ได้เรียนรู้การทำ Frontend Project ด้วย NextJS และเทคนิคต่างๆ สำหรับการพัฒนาเว็บ Frontend เช่น การจัดหน้า การทำฟอร์ม การค้นหาข้อมูล
  • มีทักษะการแปลงรูปภาพจากการออกแบบเว็บ Mockup ให้ขึ้นเป็นหน้าเว็บโดยใช้ Next.js
  • ได้เรียนรู้การทำ Full-Stack Project ด้วย NextJS และเทคนิคต่างๆ สำหรับการพัฒนาเว็บ Full-Stack
  • สามารถทำ Authentication ได้
  • สร้าง API โดยใช้ Node.js ได้
  • สามารถเชื่อมต่อ Backend และ Frontend ได้
  • Deploy Web application ที่ใช้ Next.js ทั้งส่วนของ Frontend และส่วนของ Backend
  • ได้ทำเว็บไซด์อย่างง่าย เป็นระบบค้นหา Pokemon
  • ได้ทำหน้า UI ของ Dashboard

ดูวีดีโอ / เนื้อหาคอร์ส / ผู้สอน คลิกปุ่มด้านล่าง

Learning Outcome

  • เข้าใจพื้นฐานการสร้าง Backend ด้วย Node.js เบื้องต้น
  • รู้จักเครื่องมือที่นิยมใช้ในปัจจุบัน เพื่อการพัฒนาด้วย Node.js มากขึ้น
  • เพิ่มความเข้าใจในวิธีการพัฒนาระบบหลังบ้านด้วย Node js แบบพื้นฐาน
  • เพื่อให้ผู้เรียน จะได้รู้จักเครื่องมือที่สำคัญ VScode และ Postman ในการพัฒนาระบบหลังบ้าน
  • เพื่อช่วยให้ผู้เรียนเข้าใจพื้นฐานการสร้างระบบหลังบ้านด้วย Nodejs และ ExpressJs
  • เพื่อช่วยให้ผู้เรียนเข้าใจการเชื่อมข้อมูลกับ Database (Mongodb)
  • การติดตั้ง Environment Setup และ รู้จักกับเครื่องมือที่ใช้ในการพัฒนาระบบหลังบ้าน
  • พื้นฐานเบื้องต้นสำหรับการพัฒนา Back-end ด้วย Node.js และ expressjs
  • การเชื่อมต่อกับ Database (MongoDB)
  • พัฒนาระบบหลังบ้านให้สามาถเขียนโปรแกรมได้สั้นและรวดเร็วมากยิ่งขึ้น
  • ผู้เรียนสามารถนำ Workshop หรือ Project เพิ่มใน Portfolio ได้

ดูวีดีโอ / เนื้อหาคอร์ส / ผู้สอน คลิกปุ่มด้านล่าง

ผลงานที่คุณจะได้รับ

ตัวอย่างผลงานจากผู้เรียนจริง

เรียนรู้พร้อมลงมือทำจริง

บอกเล่าประสบการณ์จากผู้เรียน

ขอบคุณความไว้วางใจ และความตั้งใจในการพัฒนาทักษะ

Excellent

Based on Learner Review

taweesak
2024-02-18
Read More
สอนดีครับเข้าใจง่ายครับ
Thanakorn
2024-03-08
Read More
สอนดีครับ เริ่มจากพื้นฐานเลย
เด่นเดือน
2023-04-20
Read More
ดีเยี่ยมเข้าใจง่าย สอนแบบละเอียดทำได้จริงค่ะ
Poramat
2023-06-16
Read More
ได้ความรู้เพิ่มเติมกับ เทคนิคมาเยอะเลยคับ
Kriangkai
2023-06-30
Read More
พูดชัดเจนดีเลยครับ ยกตัวอย่างเข้าใจง่าย
Previous
Next

Special Bonus

Free

Certificate
รับรองถึง 6 ใบ
ใช้อัปโปรไฟล์ได้จริง

แลกซื้อคอร์สต่อยอด

พัฒนาเว็บ React Portfolio ตั้งแต่เริ่มต้นจนขึ้น Deploy

รับสิทธิ์แลกซื้อคอร์สนี้
ในราคา 990 บาทเท่านั้น

จากปกติ 2,190 บาท

Free

PDF เอกสารประกอบการเรียนให้โหลดฟรีทุกคอร์สมูลค่า 1,890 บาท

สมัครคอร์สนี้แถมฟรี !
คอร์ส UI Design ด้วย Figma

React & Next.js
For Front-End Developer

คอร์สที่จะช่วยเพิ่มประสิทธิภาพให้กับเว็บไซต์ของคุณ

แถมฟรีคอร์ส Node.js มูลค่า 3,500 บาท

ราคา 2,590 บาท

จากราคาเต็ม 5,570 บาท

Template Form Landing SGC – Upsell

โดยการสั่งซื้อจะถือว่าคุณยอมรับใน ข้อตกลงการใช้บริการ ,นโยบายความเป็นส่วนตัวและ นโยบายการคืนเงิน เรียบร้อยแล้ว

ช่องทางการชำระเงิน

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

ชำระได้ทันทีผ่านบัญชีธนาคาร

สามารถชำระได้ผ่านบัตรเครดิตที่ร่วมรายการ
บัตรเครดิตที่ร่วมรายการ citibank / bangkok bank / central the 1 card /First choice / krungsri / KTC /SCB / TMB thanachart / UOB / K Bank

แพลทฟอร์มการเรียนรู้ทักษะธุรกิจ เทคโนโลยี และครีเอทีฟได้อย่างไม่จำกัดทุกที่ทุกเวลา ในราคาที่คุ้มค่าและมีคุณภาพที่สุด

ติดต่อ: 126/5 อาคาร ไทย ศรี ชั้น 2, ถนน กรุงธนบุรี แขวง บางลำภูล่าง เขต คลองสาน กรุงเทพมหานคร 10600
อีเมล: [email protected]

LINE ID: @futureskill
Facebook: futureskill.co

© 2019 Like me Co., Ltd. All Right Reserved