สอนใช้ Bootstrap 3 ร่วมกับ Sass
คอร์สเรียนการเขียน CSS ด้วย Sass ร่วมกับ Bootstrap 3
โดย ทัพพ์วริศ ชิณศิริรัตน์กุล
สวัสดีครับยินดีต้อนรับเข้าสู่ cloud-tutorial.com นะครับทั้งหน้าเก่าหน้าใหม่ ในคอร์สนี้เป็นคอร์ส สอนใช้ Bootstrap 3 ร่วมกับ Sass ถ้าใครยังไม่รู้จักทั้ง 2 ตัวนี้แนะนำให้กลับไปเรียนปูพื้นฐานจากคอร์สที่ผมได้ทำไว้ก่อนนะครับ เพื่อความเข้าใจในการเรียน
1. Bootstrap Basic สอนใช้ Bootstrap 3 ฉบับเริ่มต้น
2. สอนใช้ Bootstrap 3 Workshop
3. สอนเขียน CSS ด้วย Sass
4. สอนเขียน CSS ด้วย Sass และ Compass
สามารถเข้าไปเรียนคอร์สก่อนหน้าได้จากลิ้งด้านบนเลยนะครับ แล้วในคอร์สนี้เราจะได้เรียนอะไรกันบ้าง ภายในคอร์ส สอนใช้ Bootstrap 3 ร่วมกับ Sass นี้ผู้เรียนจะได้เรียนถึงการสร้างโปรเจ็ค Sass สำหรับใช้งานร่วมกับ Bootstrap 3 การคอมไพล์ การ Import เข้ามาใช้งาน ในส่วนสุดท้ายจะเป็นเรื่องของการประยุกต์ใช้งานจริงๆโดยใช้ Bootstrap 3 ร่วมกับ Sass และ Compass เพื่อนำมาสร้างเว็บไซต์นะครับ
ทำไมต้องใช้ Bootstrap 3 และ Sass ?
ก่อนที่จะเรียนเราก็มาทำความรู้จักกันก่อนนะครับว่าทำไมเราต้องใช้ Sass และ Bootstrap 3 ในการสร้างเว็บไซต์ อันดับแรกเลยถ้าผู้เรียนเข้ามาอ่านถึงบทความตรงนี้แล้วผมคิดว่าผู้เรียนต้องรู้จักเจ้าตัว Bootstrap 3 นี้ และ Sass มาบ้างแล้วถ้ามือใหม่ แนะนำให้กลับไปเรียนอีกรอบนะครับเพื่อทำความรู้จักมันมากขึ้น จากนั้นเราจะใช้มันร่วมกันได้อย่างไร ? ถ้าเข้าไปที่เว็บไซต์getbootstrap.com ในส่วนของ Download จะเห็นว่ามีส่วนของ Sass ซึ่งถ้าคนใช้มานานแล้วก็น่าจะเห็นว่า แต่ก่อนมีแค่ส่วนของ Less CSS แต่ปัจจุบันทาง Bootstrap เองก็ได้เห็นถึงความนิยมในการเขียน CSS ด้วย Sass จึงได้เพิ่มในส่วนของ Source Files ตรงนี้มาให้ด้วย เห็นแล้วใช่มั้ยครับว่า Sass นั้น เป็นที่นิยมขนาดไหน และด้วยเหตุผลที่ยกมาทั้งหมด ทั้งความสามารถของ Bootstrap เอย ของ Sass เอย ทำให้เราสามารถปรับแต่งเว็บไซต์ของเราได้แบบง่ายๆเลยทีเดียว
จุดเด่นของการใช้ Bootstrap 3 ร่วมกับ Sass
เราได้เห็นถึงเหตุผลต่างๆนาๆไปแล้ว ในส่วนนี้ผมจะยกตัวอย่างจุดเด่นของ คอร์สสอนใช้ Bootstrap 3 ร่วมกับ Sass นี้นะครับว่าเรียนไปแล้วจะได้อะไร
- สามารถปรับแต่งไฟล์ของ Bootstrap 3 ได้
- เห็นถึงความสามารถของ Sass มากขึ้น
- เห็นถึงการประยุกต์ใช้งานมากขึ้นจากตัวอย่างในเรื่องของ Workshop
- รู้จักวิธีการสร้างโปรเจ็ค Sass และ Bootstrap
- รู้จักวิธีการแก้ไขและปรับแต่งไฟล์ของ Bootstrap 3 Sass ไม่ว่าจะเป็นส่วนของ Variables และ Mixins
- สามารถประยุกต์ใช้งานร่วมกับ Compass ได้
นี่เป็นตัวอย่างคร่าวๆที่ผมยกมาให้ได้ดูกันส่วนที่เหลือ ผู้เรียนต้องไปลองสัมผัสด้วยตัวเองแล้วครับ ขอให้สนุกกับการเรียนคอร์สนี้นะครับ
| ตอนที่ 1 - แนะนำ Sass และ Bootstrap | 2.50 นาที | |
| ตอนที่ 2 - ดาวน์โหลด และ ติดตั้ง Sass and Bootstrap | 3.29 นาที | |
| ตอนที่ 3 - การสร้างโปรเจ็คใหม่ | 10.29 นาที | |
| ตอนที่ 4 - Bootstrap 3 Variables | 4.27 นาที | |
| ตอนที่ 5 - Bootstrap 3 Mixins | 4.51 นาที |
| ตอนที่ 6 - Getting Start Bootstrap and Compass | 9.21 นาที | |
| ตอนที่ 7 - Navbar and Background Images | 20.56 นาที | |
| ตอนที่ 8 - Button Link and Popover | 6.21 นาที | |
| ตอนที่ 9 - Ghost Button and Header | 22.18 นาที | |
| ตอนที่ 10 - Footer and Conclusion | 20.25 นาที |
รีวิวคอร์สจากผู้เรียน
ยังไม่มีรีวิวค่ะ
ยังไม่มีรีวิวค่ะ
ยังไม่มีรีวิวค่ะ
ยังไม่มีรีวิวค่ะ
| เกี่ยวกับคอร์สนี้ |
|---|
| เนื้อหาคอร์สทั้งหมด 1 ชั่วโมง 45 นาที |
| 10 วิดีโอ |
| เรียนคอร์สนี้ได้ 365 วัน |
เกี่ยวกับผู้สอน
Cloud Tutorial
