💡 เมื่อเราได้เรียนรู้วิธีการเขียนเว็บมาสักพักแล้ว ไม่ว่าจะเป็นพื้นฐานที่สำคัญ เช่น HTML, CSS และ JavaScript แล้วเราอยากจะอยากไปลองใช้ Library หรือ Framework เจ๋ง ๆ ที่ช่วยในการเขียนเว็บ อย่าง React ต้องรู้อะไรบ้าง ??
.
👉 ซึ่งไอเจ้า React เนี่ยมันมีพื้นฐานจาก JavaScript นั่นเอง เราจึงจำเป็นต้องรู้ Concept ที่สำคัญ ๆ ก่อนจะไปใช้งานเจ้า React นั่นเอง
.
มีอะไรบ้าง?? ไปดูกันเลยจ้า 🔥
.
⚙️ Basic Data Structure
Data Structure เป็นหัวใจหลักในการเขียนโปรแกรม ดังนั้นเราต้องเรียนรู้ Data Structure ประเภทต่าง ๆ ให้เข้าใจก่อน ตัวอย่างเช่น การรับ-ส่ง Request จาก API มายัง JS เราก็ต้องมีวิธีที่จะจัดการกับโครงสร้างของข้อมูลที่ดึงมาจาก API เพื่อให้เราสามารถนำข้อมูลนั้นไปใช้ได้ตามต้องการ
.
🌟 DOM
DOM หรือ Document Object Model เป็นการปรับเปลี่ยนโครงสร้าง HTML ให้เป็นแบบ Object โดยให้ JavaScript สามารถจัดการกับ HTML ผ่านโครงสร้างของ DOM ได้นั่นเอง ซึ่งเจ้า React จะใช้โครงสร้าง DOM เป็นหลัก เพื่อสร้างการโต้ตอบบนหน้าเว็บที่สะดวกยิ่งขึ้น ตัวอย่างเช่น เมื่อคลิกปุ่มสามารถแสดงข้อความ หรือเปลี่ยนสีของข้อความนั่นเอง
.
🚚 API
API ย่อมาจาก Application Program Interface ซึ่งเราต้องมีพื้นฐานการใช้งาน API เพื่อนำข้อมูลมาใช้บนหน้าเว็บนั่นเอง อาจจะไม่ต้องถึงกับสร้าง API ใช้ก็ได้นะ เพียงแค่รู้โครงสร้าง และวิธีการดึงมาใช้งานพื้นฐานก็พอแล้ว !!
.
🔧 Axios / Fetch
เครื่องมือสำคัญที่ช่วยให้เราดึง API ต่าง ๆ มาใช้งานได้ง่ายมากขึ้นนั่นเอง !! ซึ่งเป็นสิ่งสำคัญมาก ๆ ในการพัฒนาหน้าเว็บ เพราะมันจะช่วยให้เราสามารถรับ-ส่งข้อมูลแบบไดมามิก และเชื่อมต่อระหว่าง Back-end ได้ง่าย
.
📚 ES6+
สิ่งสำคัญคือเราต้องเรียนรู้วิธีเขียน JavaScript มาตรฐานใหม่ ซึ่งจะช่วยให้โค้ดของเรามีรูปแบบที่อ่านง่ายมากขึ้น !! ซึ่งใน React ที่จะนิยมใช้ ได้แก่ Template Literals, Arrow Functions, Promise, Async / Await, const & let vs var และ Spread Operator นั่นเอง
.
🗂️ JS Array Methods
เมื่อเราสามารถดึงข้อมูลจาก API มาใช้ได้แล้วนั้น เราก็ต้องรู้จักวิธีจัดการกับข้อมูลนั้น ๆ ด้วยนะ ซึ่งมันจะง่ายขึ้นถ้าเรารู้จักใช้ความสามารถของ Array Methods ต่าง ๆ ซึ่งที่นิยมใช้กัน ได้แก่ map(), forEach(), find(), และ filter() เป็นต้น บอกเลยว่าถ้าใช้พวกนี้เป็น ทำให้ชีวิตง่ายขึ้นแน่นอน!! 5555
.
อะทั้งหมดนี้คือ Concept JavaScript พื้นฐานที่สำคัญที่คนเขียน React ต้องมีนะ หวังว่าเพื่อน ๆ จะชอบกันน้าาาา ใครมีอะไรเพิ่มเติมคอมเมนต์ไว้ได้เลย 🥰
.
📑 Source : https://lorenzejay.hashnode.dev/javascript-concepts-you-should-know-before-jumping-into-react-or-any-other-frontend-framework
.
borntoDev - 🦖 สร้างการเรียนรู้ที่ดีสำหรับสายไอทีในทุกวัน
同時也有1部Youtube影片,追蹤數超過338萬的網紅Tina Yong,也在其Youtube影片中提到,This makeup transformation video was inspired by CL from the KPOP group 2NE1. Please subscribe for more videos! Also comment & let me know what else y...
let var 在 BorntoDev Facebook 的最佳解答
🔥 var, let, const จะประกาศอันไหนดีล่ะเนี่ยยย สบสันไปหมดดด ???
.
❓ หลาย ๆ คนที่เพิ่งเป็นมือใหม่หัดเขียน JavaScript หรืออาจจะเขียนมาสักพักแล้วแต่ก็ยังไม่รู้ความแตกต่างของเจ้า 3 ตัวนี้ หรือตอนนี้อาจคิดว่าจะประกาศยังไงโค้ดก็ทำงานได้หมดนี่หว่าา
.
👉 วันนี้เรามาดูกันให้กระจ่างเลยดีกว่า ว่าเจ้า var, let, const เนี่ยมันต่างกันยังไง ?
.
borntoDev - 🦖 สร้างการเรียนรู้ที่ดีสำหรับสายไอทีในทุกวัน
let var 在 BorntoDev Facebook 的最佳解答
🔥 “การประกาศตัวแปร Var, Let และ Const ใช้แบบไหนกันนะ ?”
.
เพื่อน ๆ ทราบมั้ยว่าในการเขียนโค้ด การประกาศตัวแปรก็เป็นสิ่งแรกๆ ที่เราน่าจะเจอในการเริ่มต้นศึกษาภาษานั้นๆ ใน “JavaScript” ก็เช่นกันสำหรับคนที่เริ่มศึกษา JavaSctipt น่าจะเคยเห็นผ่านตามาบ้างก็คือ var, let และ const <3
.
🚀 ในวันนี้แอดจะมาแนะนำการประกาศเจ้าตัวแปรทั้ง 3 ตัวนี้กัน เพื่อการนำไปใช้งานอย่างถูกต้อง ลองมาดูกันว่าการประกาศแต่ละแบบนั้นแตกต่างกันอย่างไรบ้าง !? ถ้าพร้อมแล้ว ไปดูพร้อมกันได้เลยคร้าบ
.
#borntoDev - 🦖 สร้างการเรียนรู้ที่ดีสำหรับสายไอทีในทุกวัน
let var 在 Tina Yong Youtube 的最讚貼文
This makeup transformation video was inspired by CL from the KPOP group 2NE1. Please subscribe for more videos! Also comment & let me know what else you would like to see on my channel! :)
Follow me on:
Instagram: http://instagram.com/tina_yong
SnapChat: tina_yong
Facebook: http://www.facebook.com/Tinayongfanpage
Twitter: https://twitter.com/tina_yong
Website: http://www.tinayong.com
Products Used:
- Hourglass Veil primer
- Makeup Forever Ultra HD Foundation #123
- NARS Creamy Concealer Custard
- MAC Mineralized Skinfinish Medium
- Eye of Horus Medium Brown Brow Pencil
- MAC Groundwork Paint Pot
- MAC Antiqued, Embark, Honey Lust Eyeshadows,
- MAC Blacktrack Gel Liner
- Modelrock Lashes Wispie Flower
- Cosmos Lower Lashes VM411(sasa.com)
- MAC Melba Blush
- MAC Half n Half lipstick
Grey Lace Wig Link:
http://www.ebay.com/itm/321946814751?_trksid=p2057872.m2749.l2649&var=510888329098&ssPageName=STRK%3AMEBIDX%3AIT
Music "B-3" Boxcat Games
"The Piano Tune" Beat Doctor