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