10 ช่อง YouTube สำหรับการเรียนรู้การพัฒนาส่วนหน้าขั้นพื้นฐาน

เผยแพร่แล้ว: 2021-01-14

การเรียนรู้การเขียนโปรแกรมตอนนี้ง่ายกว่าที่เคย

คุณสามารถหาบทช่วยสอนฟรีมากมายที่ครอบคลุมพื้นฐานของการพัฒนาส่วนหน้า และนั่นทำให้เหลือเพียง 3 ภาษาเท่านั้น: HTML, CSS และ JavaScript

และนอกจากการสอนแบบเป็นลายลักษณ์อักษรแล้ว คุณยังสามารถค้นหา วิดีโอสอนการใช้งานฟรี มากมายบน YouTube สิ่งเหล่านี้ส่วนใหญ่ซ่อนอยู่ในช่องที่ยอดเยี่ยมที่คุณต้องค้นหา

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

DevTips

DevTips YouTube

ถามเกี่ยวกับชุมชนนักพัฒนาเว็บและคุณจะเห็นการกล่าวถึงแชนเนล DevTips อยู่เสมอ

เต็มไปด้วยบทช่วยสอนที่มีความยาวครอบคลุมหัวข้อส่วนหน้ามากมาย สิ่งเหล่านี้รวมถึงพื้นฐานเช่น vanilla JS หรือคุณสมบัติ CSS3 ที่ใหม่กว่า

แต่บทช่วยสอนอื่น ๆ จะเข้าสู่เฟรมเวิร์กขั้นสูงเช่น Vue, React และ Ember

ฉันขอแนะนำอย่างยิ่งให้สมัครรับข้อมูลที่นี่เป็นจุดแรกในการผจญภัยบน YouTube ของคุณ วิดีโอเหล่านี้มีคุณภาพสูงสุดและควรค่าแก่การดูหากคุณพบหัวข้อที่คุณอยากรู้

LearnCode.academy

LearnCode Academy YouTube

นี่เป็นอีกหนึ่งช่องทางการสอนที่ฉันคิดว่าเป็นประโยชน์ต่อฟรอนต์เอนด์โค้ดเดอร์เหนือสิ่งอื่นใด

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

ซึ่งรวมถึงบทช่วยสอนการจัดการแพ็คเกจ เช่น npm & Bower พร้อมด้วยหัวข้อที่เน้นเซิร์ฟเวอร์พร้อมเครื่องมืออย่าง Docker & AWS

ทุกสิ่งที่ยอดเยี่ยมพร้อมความหลากหลายมากมายที่มีวิดีโอย้อนหลังไปมากกว่าสี่ปี

LevelUpTuts

ช่อง LevelUpTuts

ฉันเป็นแฟนตัวยงของบทช่วยสอนแบบทีละขั้นตอนเพราะพวกเขาแสดงให้คุณเห็นว่าต้องทำอะไรและทำไมคุณถึงทำอย่างนั้น

นั่นคือสิ่งที่คุณจะพบใน LevelUpTuts เป็นช่องฟรีที่สร้างขึ้นสำหรับหัวข้อ dev และเน้นที่การพัฒนาเว็บเป็นหลัก

บทช่วยสอน YouTube ของ LevelUpTuts ทั้งหมดเป็นคู่มือฉบับสมบูรณ์ตั้งแต่ต้นจนจบ และจะให้บริการฟรีตลอดไป

นินจาเน็ต

นินจาเน็ต

Net Ninja เป็นช่องทางขนาดใหญ่ที่นำเสนอหัวข้อการพัฒนาส่วนหน้าที่หลากหลาย มันกระตุ้นเว็บไซต์หน่อที่มีรายการแบบฝึกหัดฟรีที่จัดตามหัวเรื่อง

วิดีโอฟรีทั้งหมดเหล่านั้นจะคงอยู่ฟรีตลอดชีวิต และเหมาะอย่างยิ่งสำหรับการเข้ารหัสส่วนหน้า

คุณสามารถเลือก TypeScript, Angular, Vue, ES6 และ Bootstrap ได้อย่างรวดเร็วจากที่เดียว

วิดีโอมีคุณภาพสูงด้วยสไตล์การบรรยายที่ยอดเยี่ยม ดังนั้นคุณจะไม่มีวันเบื่อ

Traversy สื่อ(TechGuyWeb)

Traversy Media YouTube

ช่อง Traversy Media YouTube ไม่ต้องสงสัยเลยว่าเป็นหนึ่งในช่องที่ดีที่สุดสำหรับนักพัฒนา

ด้วยผู้ติดตามมากกว่า 350,000 คน วิดีโอเหล่านี้จึงมีสิ่งที่น่าสนใจมากมาย จริงอยู่ที่ว่าพวกเขาครอบคลุมหัวข้อแบ็คเอนด์มากมายในภาษาต่างๆ เช่น PHP & Python ดังนั้นจึงไม่ใช่แค่ส่วนหน้าเท่านั้น

โปรดจำไว้ว่ามีวิดีโอมากมายเกี่ยวกับเทคนิคส่วนหน้าเช่นกัน ซึ่งรวมถึงวิดีโอบางรายการที่รวมส่วนหน้าและส่วนหลังเข้ากับเฟรมเวิร์กอย่าง Angular

หากคุณต้องการทำงานนักพัฒนาเว็บอย่างมืออาชีพ การเรียนรู้การเขียนโค้ดแบ็กเอนด์ไม่ใช่เรื่องยาก

นั่นคือเหตุผลที่ Traversy Media ควรเป็นช่องทางย่อยสำหรับทุกคนในการเขียนโค้ดเว็บโดยไม่คำนึงถึงระดับทักษะ

โค้ดคอร์ส

Codecourse youtube

ช่อง Codecourse มีวิดีโอฟรีมากมายเช่นเดียวกับที่กล่าวถึงในรายการนี้

สิ่งที่ฉันชอบเกี่ยวกับ Codecourse คือการที่พวกเขาให้ทุนวิดีโอผ่านเว็บไซต์หลักของพวกเขา ซึ่งหมายความว่าคุณจะพบเนื้อหาฟรีมากมายบน YouTube พร้อมตัวเลือกการอัปเกรดหากคุณต้องการ

ฉันคิดว่ามีหลายสิ่งให้ค้นหาบน YouTube เพียงอย่างเดียว นั่นคือจุดเริ่มต้นที่ดีที่สุด

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

เวส บอส

Wes Bos YouTube

นักพัฒนา Wes Bos ได้สร้างชื่อให้กับตัวเองด้วยบทเรียนออนไลน์ที่ยอดเยี่ยมมากมาย

บางอันก็ฟรี บางอันก็เสียเงิน แต่ของฟรีก็ยังให้คุณค่ามากมาย

นั่นคือสิ่งที่คุณจะพบในช่อง YouTube ของเขาซึ่งนำเสนอวิดีโอการเข้ารหัสฟรอนท์เอนด์ฟรีสำหรับผู้ชมทุกคน และจริงๆ แล้ว โค้ดเหล่านี้เป็นเหมือนโค้ดส่วนหน้าทั้งหมด 99%

แต่ด้วยวิดีโอเหล่านี้ คุณจะเน้นที่เค้าโครง CSS และเทคนิคการจัดการ JS ทั้งสองหัวข้อมีค่ามากสำหรับผู้เชี่ยวชาญ และมีฟีเจอร์ใหม่ๆ ออกมาอยู่เสมอ

ฉันชอบวิดีโอของเขาเป็นพิเศษในคุณสมบัติ CSS Grid เนื่องจากหัวเรื่องนั้นสามารถดูรายละเอียดได้อย่างรวดเร็ว

LearnWebCode

LearnWebCode channel

ช่องที่ค่อนข้างง่ายที่นี่ซึ่งคุ้มค่ากับการย่อยหากคุณต้องการบทช่วยสอน dev ที่ใช้งานง่าย

LearnWebCode พูดถึงการเข้ารหัสส่วนหน้าโดยเฉพาะ ซึ่งรวมถึงหัวข้อที่มีรายละเอียดบางอย่าง เช่น การจัดการโปรเจ็กต์ Git และอ็อบเจ็กต์ SVG ที่เข้ารหัสแบบกำหนดเองด้วยองค์ประกอบผ้าใบ แต่ท๊อตหลายคนเป็นระดับเริ่มต้นซึ่งก็ดี

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

เหมาะสำหรับทุกคนในทุกพื้นเพ เพราะแม้แต่นักพัฒนามืออาชีพก็อาจสะดุดกับหัวข้อที่พวกเขาไม่เคยศึกษามาก่อน

รหัสเว็บ (Garrett Love)

Garret Love YT

ช่อง YouTube ของ Garrett Love “CodeTheWeb” มีขนาดเล็กแต่เติบโตอย่างรวดเร็ว

คุณสามารถตรวจสอบหน้าวิดีโอเพื่อดูสิ่งที่เขานำเสนอและคุณภาพที่คุณคาดหวังได้ที่นี่

โดยรวมแล้วฉันพอใจกับหน้านี้มากเพราะมันยอดเยี่ยมมาก มันเจาะลึกในหัวข้อนอกการเข้ารหัสส่วนหน้า แต่ยังพูดคุยมากในด้าน HTML/CSS/JS ของสิ่งต่าง ๆ

นอกจากนี้ยังมีบทแนะนำที่ยาวกว่า (20-60 นาที) ควบคู่ไปกับวิดีโอแนะนำสั้น ๆ เกี่ยวกับงานฟรีแลนซ์และงานลงจอด

ขอแนะนำอย่างยิ่งให้อ่านไลบรารีวิดีโอนี้แบบคร่าวๆ หากคุณต้องการเขียนโค้ดในอาชีพการงานของคุณ

Fun Fun Function

FunFunction youtube

สุดท้ายเป็นรายการโปรดส่วนตัวของฉันที่สมาชิก 144k: Fun Fun Function

Mattias Petter Johansson โฮสต์ช่องของคุณเผยแพร่วิดีโอที่มีรายละเอียดเกี่ยวกับการเข้ารหัส JavaScript ตั้งแต่ต้น หลักสูตรนี้เป็นหลักสูตรเริ่มต้นที่สมบูรณ์ สำหรับการเรียนรู้ JavaScript จนถึงระดับสูงอย่างแท้จริง ฟรีทั้งหมด

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

คุณจะไม่พบ HTML/CSS tuts มากมายที่นี่ แต่สิ่งนี้เหมาะสำหรับทุกคนที่ต้องการใช้ JavaScript สำหรับเว็บ