ฝึกสร้าง เว็บ ด้วย React อย่างมือโปร

818 students enrolled

ฝึกสร้าง เว็บ ด้วย React อย่างมือโปร

หลักสูตรที่คุณจะได้เรียนสร้าง Web ด้วยเทคโนโลยีล่าสุดของ Reactjs, Redux, React Routing, Next.js, Babel, Webpack และอื่นๆ

818 students enrolled

Created by Olan Samritjiarapon

Last updated 12/2019

Thai

Preview this course

ฝึกสร้าง เว็บ ด้วย React อย่างมือโปร

$128.99 $184.99 30% off

5 hours left at this price!

30-Day Money-Back Guarantee

9.5 hours on-demand video
2 articles
Full lifetime access
Access on mobile and TV

Certificate of Completion

Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business

What you'll learn

สร้างเว็บไซต์สมัยใหม่ ด้วยเทคโนโลยียอดนิยมล่าสุดอย่าง React
เข้าใจ Ecosystem ของ React ที่ประกอบด้วย npm, Reactjs, Redux, React Routing, Nextjs, Babel, Webpack, ES6 และอื่นๆ
สร้างเว็บไซต์แบบ Client Side Rendering (CSR) และ Single Page Applications (SPAs)
สร้างเว็บไซต์แบบ Server Side Rendering ด้วย React
เข้าใจและออกแบบเว็บแอพพลิเคชั่นด้วย React ได้อย่างถูกต้อง
ต่อยอดพัฒนา Cross Platform Mobile Apps ด้วย React Native
รู้จักและสามารถใช้งานเครื่องมือพัฒนาเว็บสมัยใหม่
เข้าใจโค้ด แต่ละตัวที่เขียน และสามารถแก้ไขเมื่อต้องแก้โค้ดของคนอื่น
ฝึกฝนการเขียนโค้ด การสร้างเว็บไซต์ลักษณะต่างๆ
สมัครงานเป็นโปรแกรมเมอร์สายพัฒนาเว็บไซต์
รับงานทำเว็บไซต์แบบฟรีแลนซ์
ฝึกการใช้งานคำสั่งแบบ Command Line

+ – ทำความรู้จัก React

4 lectures 11:50

React คืออะไร ?

Preview 02:25

Component Based Architecture

02:53

ทำไมถึงต้องเลือก React ?

03:39

Single Page Applications (SPAs)

02:53

+ – เตรียมเครื่องให้พร้อมก่อนเริ่มพัฒนาเว็บด้วย React

6 lectures 14:10

ติดตั้ง Visual Studio Code

00:59

ติดตั้ง Node.js

01:29

การติดตั้ง Nodemon

01:24

npm (Node Package Manager)

05:02

คำสั่ง npm พื้นฐาน

05:04

Source Code สำหรับคอร์ส "ฝึกสร้าง เว็บ ด้วย React อย่างมือโปร"

00:12

+ – ปูพื้น Javascript สมัยใหม่ ES5, ES6 ก่อนเขียน React

12 lectures 01:12:22

let & var & const

06:10

Multi-line String & Expression interpolation

05:38

Destructuring assignment

04:09

Rest parameters

03:06

Spread Operators

09:10

Default Parameters

06:55

Class

10:17

Object

02:36

Arrow Functions

05:53

Array Functions

07:33

Modules

05:47

Imports และ Exports

Preview 05:08

+ – เริ่มต้นใช้ React สร้างเว็บไซต์

10 lectures 53:24

สร้างโปรเจคเริ่มต้นด้วย create-react-app

Preview 04:13

ส่วนประกอบต่างๆ ของ React

05:28

โครงสร้างของ Folder ของ React

09:09

JSX

04:46

การสร้าง Functional Components

05:10

การใช้งาน Props

07:27

การสร้าง Class Components

03:30

การใช้งาน State

04:14

Lifecycle ของ Components

06:33

สรุป Components ใน React

02:54

+ – กำหนด Class และ Style ให้กับ React Components & Elements

7 lectures 46:09

React + Bootstrap Framework

Preview 03:22

การติดตั้ง Bootstrap Framework ใน React

06:06

กำหนด Class ด้วย className

09:25

การใช้ Inline Styles

02:57

การ Load ข้อมูล JSON

03:26

ออกแบบ Components แบบ Composition

09:20

Lists และ Keys

11:33

+ – การจัดการ Events ของ React Components & Elements

5 lectures 24:41

Handling Events ด้วย Methods

Preview 03:44

การใช้งาน Handling Events

01:03

Event Object

01:52

Conditional Rendering

05:28

การอ้างอิง Methods ระหว่าง Components

12:34

+ – การรับส่งข้อมูลผ่าน API ด้วย React

6 lectures 31:44

API (Application Programming Interface)

Preview 06:22

สร้าง Rest API ด้วย JSON Server

05:14

การรับข้อมูลผ่าน API ด้วย HTTP GET

04:28

การรับข้อมูลผ่าน API ด้วย Axios

02:54

การส่งข้อมูลผ่าน API ด้วย HTTP POST

07:11

การใส่ข้อความแจ้งเตือน

05:35

+ – สร้างเว็บหลายหน้าและจัดการเส้นทางด้วย React Router

9 lectures 01:08:10

Routing และ Single Page Applications

Preview 03:54

ติดตั้ง React Router และปรับโครงสร้าง Project

03:17

Home Page | /

06:42

About Page | /about

07:09

Orders Page | /orders

16:55

Products Page | /products

13:08

<Link> VS <a>

05:59

404 Not Found

04:57

การใช้ withRouter และ Route Props

06:09

+ – จัดการ State ด้วย Redux

11 lectures 01:02:29

ทำไมต้องใช้ Redux ?

Preview 03:33

โครงสร้างและการทำงาน Redux

07:29

ติดตั้ง Redux

01:28

React + Redux : Store

04:24

React + Redux : Reducers #1

04:52

React + Redux : Actions #1

07:18

React + Redux : Reducers #2

08:20

React + Redux : Actions #2

05:05

React + Redux : connect #1

08:05

React + Redux : connect #2

05:54

React + Redux : สรุป

06:01

+ – จัดการ Form กรอกข้อมูลด้วย Redux Form

13 lectures 01:15:15

การใช้ Form บน React

04:02

Redux Form

05:45

การตั้งค่า Form reducer

01:36

สร้าง Form component

01:55

Product Edit Page | /products/add และ /products/edit/:id

04:34

การใช้ Field Component #1

05:50

การใช้ Field Component #2

09:14

Validating Forms

08:37

การแสดง Errors ให้กับ Users

03:34

อัพเกรด Actions และ Reducers

07:37

การจัดการ Form Submit

11:29

กำหนดค่าเริ่มต้นให้กับ Form

08:02

การใส่ข้อความแจ้งเตือน ให้กับ Users

03:00

3 more sections

Requirements

คอมพิวเตอร์ และ อินเตอร์เน็ต
HTML + CSS + JAVASCRIPT ขั้นพื้นฐาน

Description

เทคโนโลยีที่เปลี่ยนแปลงอย่างรวดเร็วและดีขึ้นตามยุคสมัย คุณพร้อมที่จะก้าวไปอีกระดับในการพัฒนาเว็บแล้ว? หรือจะถูกทิ้งไว้กลางทาง .....

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

โดย React ทำหน้าที่ในการจัดการแสดงหน้าเว็บต่างๆ ในรูปแบบ Client Side Rendering (CSR) ทำให้หน้าเว็บแสดงผลอย่างรวดเร็วเมื่อเปลี่ยนหน้า ใกล้เคียงกับแอพพลิเคชั่นบนมือถือ และไม่มีการกระพริบ แบบเว็บสมัยก่อน หรือเราอาจจะเรียกอีกชื่อหนึ่งว่า Single Page Applications (SPAs)

ความต้องการนักพัฒนาเว็บด้วย React ในตลาดแรงงานสูงมาก รวมถึงค่าตอบแทนก็สูงเช่นกัน เป็นก่อนรวยก่อน หรือ จะเก็บไว้เป็นไม้เด็ดไว้ พัฒนาเว็บของคุณให้เทียบเท่าเว็บชั้นนำอย่าง Netflix, Facebook, Intragram, Uber ต่างเลือกใช้ React รับรองเว็บของคุณจะไม่น้อยหน้าใคร

นอกจากพัฒนาเว็บแอพพลิเคชั่นแล้ว React สามารถต่อยอดทำแอพพลิเคชั่นบนมือถือแบบ Cross Platform ได้อีกด้วยผ่าน React Native พัฒนาทีเดียวได้ทั้ง IOS, Android

และการสร้างเว็บที่ประมวลผลฝั่ง Server ที่เรียกว่า Server Side Rendering (SSR) ร่วมกับ Node.js, express เพื่อให้ได้ SEO ที่ดียิ่งขึ้น

ถ้าคุณเป็นโปรแกรมเมอร์ที่รักการเขียน JavaScript คุณจะรัก React ด้วยเช่นกัน

หลักสูตรมีการอัพเดทอยู่ตลอดเวลา ด้วยเนื้อหาใหม่ๆ คิดซะว่าเป็นการสมัครบริการฝึกอบรมนักพัฒนาเว็บแบบไม่มีที่สิ้นสุด.....

เรียนออนไลน์ได้ 24 ชั่วโมง ทุกทีทุกอุปกรณ์ ไม่มีหมดอายุ และมีทีมคอย Support ให้คำปรึกษาตลอด

ตลอดหลักสูตรครอบคลุมเครื่องมือและเทคโนโลยีมากมายได้แก่

react
react-router
redux
redux-thunk
redux-form
babel
webpack
npm
JavaScript ES5, ES6
Next.js (Server Side Rendering)
และอื่นๆ

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

Who this course is for:

นักพัฒนาเว็บที่ต้องการเพิ่มทักษะด้าน Frontend Framework สมัยใหม่
ผู้ที่ต้องการเปลี่ยนสายงานมาเป็นโปรแกรมเมอร์สายพัฒนาเว็บไซต์
นักเรียน นักศึกษา ที่สนใจทำเว็บไซต์สมัยใหม่
คนที่ต้องการเขียนเว็บ เพื่อหารายได้เสริมหรือรายได้หลัก
คนที่ต้องการสร้างเว็บไซต์ ไว้ใช้เอง
หัวหน้าทีม ที่ต้องการนำเว็บไซต์สมัยใหม่ไปใช้ทำโปรเจคต่างๆ
เจ้าของกิจการ ที่ต้องการนำเว็บไซต์ไปใช้ในธุรกิจ