การศึกษา5 คอร์สสอน Bootstrap ออนไลน์สำหรับการสร้างเว็บไซต์แบบ responsive

5 คอร์สสอน Bootstrap ออนไลน์สำหรับการสร้างเว็บไซต์แบบ responsive

Bootstrap คือ framework ของ HTML, CSS และ JavaScript (ฝั่ง front-end) ที่ใช้ในการสร้างและออกแบบเว็บไซต์แบบ responsive ที่ปรับหน้าตาไปตาม device ของผู้ใช้งาน ดังนั้น Bootstrap จึงเหมาะต่อกับการสร้างเว็บไซต์ยุคใหม่ที่ผู้ใช้งานมักเข้าใช้จาก mobile เป็นอย่างยิ่ง

ภายใน framework นั้นเต็มไปด้วย design templates สำหรับ typography, navigation และ elements อื่นๆ ของเว็บไซต์ให้ใช้งานอีกมากมาย ซึ่งจะเพิ่มความสะดวกสบายให้กับนักพัฒนาเว็บไซต์อย่างยิ่ง ดังนั้นการใช้งาน Bootstrap ได้อย่างคล่องแคล่วจะเพิ่มขีดความสามารถของ web developer ไปอย่างมากเลยทีเดียวครับ

สำหรับใครที่อยากเรียน Bootstrap การไปเรียนที่สถาบันไม่จำเป็นอีกต่อไป เพราะคุณสามารถเรียนความรู้ทุกอย่างได้ทางออนไลน์ เรามาดูกันดีกว่าครับจะมีคอร์สสอน Bootstrap ไหนที่น่าเรียนบ้าง

ข้อควรทราบ:

  • สำหรับทุกคอร์สที่ผมแนะนำ แพลตฟอร์มที่คุณจะได้ใช้เรียนคือ Udemy และ Coursera ดังนั้นถ้าคุณยังไม่คุ้นเคย ไม่ทราบรายละเอียด ผมแนะนำให้อ่านเพิ่มเติมที่บทความแพลตฟอร์มคอร์สออนไลน์ของผมครับ
  • ราคาและเงื่อนไขของแต่ละคอร์สมีโอกาสสูงที่จะเปลี่ยนแปลงไปได้ (โดยเฉพาะการลด 90% ของ Udemy) ดังนั้น โปรดตรวจสอบอีกครั้งกับทางเว็บไซต์เพื่อความชัดเจน
  • คอร์สทั้งหมดที่ผมแนะนำจะเป็นคอร์สสอน Bootstrap 4 ซึ่งคุณไม่จำเป็นต้องเรียนรู้เวอร์ชันก่อนหน้าแต่อย่างใด อย่างไรก็ดีคุณจำเป็นต้องเข้าใจ HTML & CSS มาบ้างครับ

Udemy

คอร์สที่ 1-4 อยู่ในแพลตฟอร์มของ Udemy

Udemy มีการ Sale คอร์สแบบล้างสต็อกที่มีทุกสัปดาห์ ซึ่งจะลดราคาคอร์สกว่า 90% จนเหลือไม่กี่ร้อยบาทเท่านั้น (ต่ำสุดคือ 300 บาท) ทำให้คุณไม่จำเป็นต้องเสียเงินเรียนแพงๆ แต่อย่างใด

สมมติว่าคุณเกิดเปิดลิงค์เข้าไปแล้ว คอร์สอยู่ที่ราคาเต็ม (เหมือนกับรูปในโพสนี้) คุณสามารถสมัครแจ้งเตือนกับ Victory Tale เพื่อรับทราบช่วงเวลาที่คอร์สลดราคา หรือว่านำคอร์สเก็บเข้า Wish List ไปก่อน แล้วค่อยซื้อในอีก 2-5 วันครับ

อย่างไรก็ตามหลายคนอาจจะรู้สึกคอร์สเยอะขนาดนี้จะเลือกคอร์สไหนดี ในส่วนนี้สบายใจได้เลยครับ เพราะผมเลือกมาให้แล้วนั่นเอง

1. Bootstrap 4 Tutorial and 10 Projects Course

คอร์สสอน Bootstrap 4 ชั้นยอดที่สอนโดย John Smilga นักพัฒนาแบบ Front End Developer ประสบการณ์สูงในด้านการใช้ HTML, CSS และ JavaScript รวมไปถึง framework อันมากมายของทั้งสามครับ

อย่างในรูป คอร์สจะอยู่ที่ราคาเต็ม ผมแนะนำให้คุณรอ 2-5 วัน สมมติว่าเปิดลิงค์เข้าไปเจอราคาคอร์สแบบนี้ครับ

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

อย่างไรก็ดีสำเนียงของเขาจะอู้อี้ฟังยากอยู่บ้าง ผมแนะนำให้คุณดู Preview ก่อนเพื่อดูว่าคุณมีปัญหาหรือไม่ ถ้าคำตอบของคุณคือไม่ ผมบอกได้เลยว่าคอร์สนี้จะเป็นคอร์สสอน Bootstrap คอร์สเดียวที่คุณต้องการครับ

รูปแบบการสอนในคอร์สนี้จะเป็นแบบ project-based ซึ่งหมายความว่าเน้นภาคปฏิบัติล้วนๆ นั่นคือคุณจะได้ลองสร้างเว็บไซต์ที่ใช้งานได้จริงโดยใช้ Bootstrap จำนวน 10 เว็บด้วยกัน สรุปแล้วสิ่งที่คุณจะได้เรียนในคอร์สนี้คือ

  • พื้นฐานของ Bootstrap อย่างเช่นการใส่ Bootstrap ลงไปใน Project ของคุณ, การใช้สีและ Typography, Bootstrap Grid, Container, Flexbox ฯลฯ
  • ทบทวน CSS Flexbox Tutorial
  • ทำโปรเจคแรกเพื่อประยุกต์ใช้ความรู้ Bootstrap 4 ที่เรียนไป (ใช้ CSS เพียงเล็กน้อย)
  • ทำโปรเจคอื่นๆ อีก 9 โปรเจคซึ่งจะบูรณาการความรู้ Bootstrap กับ HTML & CSS อาทิเช่นสร้างเว็บไซต์ e-commerce สำหรับบริษัทเฟอร์นิเจอร์, เว็บไซต์สำหรับร้านขนมหวาน, Music App ฯลฯ

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

รวมทั้งหมดแล้วคอร์สนี้มีเนื้อหาทั้งหมด 44 ชั่วโมง หลายคนอาจจะรู้สึกว่ายาวเกินไป แต่ Udemy สามารถเรียนด้วยความเร็ว 1.25-2 เท่าได้ ทำให้เวลาที่ใช้เรียนสามารถย่นย่อไปได้อย่างมากเลยครับ

คอร์สนี้ได้คะแนนรีวิวสูงมากถึง 4.7/5.0 จากนักเรียนกว่า 4,200 คน

2. Bootstrap 4 From Scratch With 5 Projects

คอร์สสอน Bootstrap 4 ชั้นยอดที่จัดทำโดย Brad Traversy นักพัฒนาแบบ Full Stack Developer ที่มีประสบการณ์กว่า 12 ปี และเป็นเจ้าของช่อง Youtube เกี่ยวกับการพัฒนาเว็บที่ได้รับความนิยมอีกด้วย ในคอร์สนี้เขาจะมาสอนการใช้ Bootstrap พัฒนาเว็บไซต์ให้คุณเข้าใจอย่างละเอียดครับ

ตัวคอร์สจะแบ่งออกเป็น 2 ส่วนอย่างชัดเจน นั่นคือส่วนของทฤษฎีและภาคปฏิบัติ โดยคุณจะได้เรียนเนื้อหาต่อไปนี้

  • แนะนำ Bootstrap 4
  • การจัดการในส่วนของ Typography และ Utilities
  • CSS Components อย่างเช่น Navbar, List Groups, Forms ฯลฯ
  • Grid System & Flexbox
  • การใช้ JavaScript Widgets
  • สร้างโปรเจค 5 ชิ้นโดยใช้ Bootstrap อาทิเช่น Book Theme, Social Theme, Multi Page Theme, Admin UI

ทั้งนี้ผู้สอนได้แนะนำว่าถ้าคุณเคยเรียน Bootstrap มาแล้วบ้าง คุณสามารถเริ่มต้นที่ภาคปฏิบัติเลยก็ได้ครับ ซึ่งจะเป็นเนื้อหาหลักของตัวคอร์สอยู่แล้ว

โดยรวมผมมองว่าคอร์สนี้คล้ายกับคอร์สแรกมาก แต่จะกระชับกว่า เหมาะกับใครที่มีเวลาไม่มากนัก แต่อยากหาคอร์สสอน Bootstrap ที่สามารถนำไปใช้งานได้จริง อย่างไรก็ดีโปรเจคของคอร์สนี้จะสร้างแค่ theme และ UI เท่านั้นครับ

ตัวคอร์สนี้ได้คะแนนไป 4.7/5.0 จากผู้เรียนกว่า 53,400 คนครับ

3. The Bootstrap 4 Bootcamp

คอร์สสอน Bootstrap 4 ที่จัดทำโดย Colt Steele หัวหน้าครูผู้สอนของ Bootcamp ชื่อดังอย่าง Galvanize ที่เคยสอนนักพัฒนาหน้าใหม่คนแล้วคนเล่า คอร์สของเขามีคุณภาพสูงมาก เห็นได้จากคะแนนรีวิวเฉลี่ยสูงถึง 4.7/5.0 และจำนวนนักเรียนที่มากเกือบ 900,000 คนครับ

ผมเองเคยเรียนกับเขาแล้วเช่นกัน บอกได้เลยว่าการสอนของเขานั้นเยี่ยมยอดจริงๆ ทุกอย่างชัดเจน ไม่มีเร่งรัดจนเกินไป สำเนียงของเขาฟังง่าย เข้าใจง่าย ผมรับรองเลยว่าไม่ผิดหวังอย่างแน่นอนครับ

สำหรับราคาในรูปด้านล่าง หลายคนอาจจะตกใจ แต่นี่เป็นราคาเต็มครับ ถ้าคุณซื้อในช่วงลดราคาจะเหลือแค่ประมาณ 500 บาทเท่านั้นเองครับ

วิธีการสอนสำหรับคอร์สนี้จะเน้นในส่วนของทฤษฎีและวิธีการใช้งานเป็นหลัก ในส่วนของปฏิบัตินั้นก็จะมีบ้าง แต่จะไม่เน้นเท่ากับคอร์สที่ 1-2 ครับ โดยเขาจะสอนคุณในเนื้อหาต่อไปนี้

  • Intro + Setup Bootstrap 4
  • พื้นฐาน Bootstrap 4 อย่างเช่น Colors, Buttons, Typography
  • Utilities อย่างเช่น Borders, Shadows, Margin and Padding
  • การสร้าง Forms อย่างเช่น Checkboxes, Inline Forms
  • การสร้าง Navbar และ Flexbox
  • Grid System + List Groups + Pagination + Breadcrumbs
  • JavaScript Components อย่างเช่น Dropdowns, Modals, Carousels
  • ใช้ SASS ในการ customize Bootstrap
  • Project

แม้ว่าภาคปฏิบัติจะไม่เน้นเท่ากับคอร์สอื่น แต่ในคอร์สคุณจะมีแบบฝึกหัดและ Coding Challenges ที่ท้าทายคุณไปตลอดทาง เช่นคุณอาจจะได้ลองสร้างโน่นสร้างนี่ตามคำสั่งของผู้สอน หรือว่าแก้ไข code ที่ผิดให้ถูกต้อง ซึ่งจะเป็นการฝึกทักษะเหมือนกับได้เรียนกับครูแบบสอนสดเลยครับ

คะแนนรีวิวคอร์สนี้ได้ไป 4.7/5.0 จากนักเรียนมากกว่า 10,800 คนครับ

4. Learn Bootstrap 4 By Creating An Advanced Bootstrap Theme

คอร์สนี้จะสอน Bootstrap แนวปฏิบัติ แต่จะเน้นไปที่การสร้าง Bootstrap Theme ระดับสูงที่สามารถนำไปใช้ได้จริง ซึ่งทั้งคอร์สจะสอนวิธีการทำโปรเจคใหญ่โปรเจคนี้เลยครับ ดังนั้นตัวโปรเจคจะยาวกว่าโปรเจคในคอร์สอื่นๆ อย่างชัดเจน ผู้สอนคอร์สนี้คือ Drew Ryan นักพัฒนาเว็บไซต์ที่เรียนรู้ทุกสิ่งด้วยตนเองจนเป็นระดับมืออาชีพครับ

ฟังก์ชันต่างๆ ที่คุณจะได้เรียนในคอร์สนี้คือ

  • Bootstrap Website Layouts
  • Scrollspy & CSS Reset Styling
  • Navbar Menu
  • การสร้าง Landing Page
  • Heading & Buttons
  • Jumbotron Features
  • Portfolio Image Gallery
  • Pricing Columns
  • สร้างหน้า Meet The Team และ Clients Section
  • และอื่นๆ อีกมากมาย

ภายในเวลา 8 ชั่วโมง คุณจะได้เรียนการสร้าง Bootstrap Theme จาก scratch มาจนถึงระดับที่สามารถนำไปใช้จริงได้อย่างสมบูรณ์ ในการเรียนจะเร็วกว่าคอร์สอื่นๆ ทำให้เหมาะกับใครที่มีพื้นฐานในสร้างเว็บไซต์อยู่แล้วครับ คอร์สนี้ได้คะแนนรีวิว 4.7/5.0 จากนักเรียนกว่า 3,500 คน

นอกจาก 4 คอร์สนี้แล้ว Udemy ยังมีคอร์สสอน Bootstrap อื่นๆ อีกมากมายที่อาจจะตอบโจทย์คุณได้มากกว่า ถ้าสนใจลองดูเพิ่มได้ที่ Bootstrap Courses ครับ

Coursera

คอร์สที่ 5 อยู่ในแพลตฟอร์มของ Coursera

5. Front-End Web UI Frameworks and Tools: Bootstrap 4

คอร์สนี้เป็นคอร์สย่อยที่อยู่ในหลักสูตรที่จัดทำโดย The Hong Kong University of Science and Technology เนื้อหาส่วนใหญ่ในคอร์สนี้จะเน้นไปที่ Bootstrap 4 แต่อาจจะมีส่วนอื่นมาเสริมบ้าง อาทิเช่น Node.js ครับ

เนื้อหาในคอร์สประกอบด้วย

  • เรียนรู้พื้นฐานของ Bootstrap อาทิเช่น Responsive Design, Bootstrap Grid System
  • Bootstrap CSS Components อย่างเช่น Navigation Bar, Buttons, Forms, Tables, Cards, Images and Media
  • Bootstrap JavaScript Components อย่างเช่น tabs, pills, collapse, scrollspy, modals ฯลฯ
  • Web Tools อย่างเช่น CSS Preprocessors, Less and Sass ฯลฯ

สำหรับคอร์สนี้จะใช้เวลาเรียนประมาณ 31 ชั่วโมง (รวมทั้งการเรียนด้วยวีดิโอ, การอ่านบทความ, การประเมินผล ฯลฯ) ครับ ซึ่งถือว่าเนื้อหาแน่นทีเดียวสำหรับคอร์สใน Coursera ครับ

เนื่องจากคอร์สนี้อยู่ในหลักสูตร 2 หลักสูตร คุณจะต้องเลือก 1 หลักสูตรเพื่อเข้าถึงเนื้อหาทั้งหมดในคอร์สนี้ โดยหลักสูตรแรกจะโฟกัสที่ React ส่วนหลักสูตรที่สองจะโฟกัสที่การสร้าง mobile app โดยใช้ Angular และ Ionic หลังจากสมัครไปแล้วคุณจะเข้าถึงเนื้อหาคอร์สนี้ รวมไปถึงคอร์สย่อยๆ อื่นได้ทั้งหลักสูตรครับ

ค่าเรียนของสองหลักสูตรนี้ไม่ต่างกันนั่นคือ $49 หรือประมาณ 1,470 บาทต่อเดือนครับ

Pun Anansakunwat
Pun Anansakunwathttps://victorytale.com/about-victorytale/
ผู้ก่อตั้งเว็บไซต์ Victory Tale ผมชื่นชอบในหลากหลายสาขาตั้งแต่ประวัติศาสตร์ การท่องเที่ยว เทคโนโลยี ไปจนถึงการลงทุน หลังจากที่จบการศึกษาจากมหาวิทยาลัยโคลัมเบีย (Columbia University) ผมก็ได้เป็นนักลงทุนในหุ้น, ติวเตอร์, นักเขียน (ตีพิมพ์ไปแล้ว 3 เล่ม) และในปัจจุบันก็เป็นเจ้าของเว็บไซต์ครับ

บทความการศึกษา

Victory Tale ไม่อนุญาตให้คัดลอกบทความไปโพสที่ใดทุกกรณี การฝ่าฝืนมีโทษทางกฎหมาย

error: Content is protected !!