Site icon บริษัท โค๊ดบี จำกัด

Bootstrap คืออะไร รู้จักเครื่องมือทำเว็บไซต์ยอดนิยม

bootstrap-คืออะไร

bootstrap-คืออะไร

<h3>Bootstrap คืออะไร รู้จักกับ Framework ทำเว็บไซต์ยอดนิยม<&sol;h3>&NewLine;<p><&sol;br><br &sol;>&NewLine;ในช่วงหลายปีที่ผ่านมามีเฟรมเวิร์คมากมายเกิดขึ้นทั้ง Front-end Framework และส่วน Back-end Framework และนั่นทำให้เราเริ่ม<br &sol;>&NewLine;รู้จักเฟรมเวิร์คที่ชือว่า Bootstrap ในวงกว้าง ไม่ไช่เฉพาะกลุ่ม front-end programmer และรวมไปถึงกลุ่มลูกค้า Customer&comma; AE<br &sol;>&NewLine;ล้วนมีคำถามหรือมีความรู้เบื้องต้น หรืออย่างน้อย ๆ ก็เคยได้ยินคำ ๆ นี้มาบ้างแล้วแทบทั้งสิ้น นั่นทำให้เฟรมเวิร์คตัวนี้น่าสนใจมากขึ้นเรื่อย ๆ<br &sol;>&NewLine;<&excl;--more--><&sol;p>&NewLine;<p><&sol;br><&sol;p>&NewLine;<h4>Bootstrap คืออะไร &quest;<&sol;h4>&NewLine;<p>Bootstrap คือชุดคำสั่งที่ประกอบด้วยภาษา CSS&comma; HTML และ Javascript เป็นชุดคำสั่งที่ถูกพัฒนาขึ้นมาเพื่อกำหนดกรอบหรือ<br &sol;>&NewLine;รูปแบบการพัฒนาเว็บไซต์ในส่วนของการปฏิสัมพันธ์กับผู้ใช้งานเว็บไซต์ &lpar; User Interface &rpar; เราจึงสามารถเรียก Bootstrap<br &sol;>&NewLine;ว่าเป็น Front-end framework คือใช้สำหรับ พัฒนาเว็บไซต์ส่วนการแสดงผล ซึ่งแตกต่างจากภาษาประเภท Server Side Script<br &sol;>&NewLine;อย่าง PHP&comma; Python หรือภาษาอื่น ๆ<br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;<h4>รู้จักทีมผู้พัฒนา<&sol;h4>&NewLine;<p>Bootstrap ถูกพัฒนาขึ้นโดย Mark Otto และ Jacob Thornton ทีมพัฒนาของ Twitter Inc&period; ก่อนหน้านี้ใช้ชื่อว่า Twitter Blueprint<br &sol;>&NewLine;และเปิดให้นักพัฒนาสามารถนำไปใช้งานพัฒนาเว็บไซต์ได้แบบฟรี &lpar; Open Source &rpar; ในชื่อว่า Bootstrap Framework<br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;<h4>จุดเด่นของของ Bootstrap Framework<&sol;h4>&NewLine;<ul>&NewLine;<li>มี UI เริ่มต้นแบบที่สวยงามและใช้งานง่าย<&sol;li>&NewLine;<li>มีการปรับปรุงและพัฒนาอย่างต่อเนื่อง ปัจจุบันเป็นเวอร์ชั่น 3&period;3&period;0<&sol;li>&NewLine;<li>เป็นที่นิยมของนักพัฒนาทั่วโลก ทำให้สามารถเรียนรู้และแก้ปัญหาได้ง่าย<&sol;li>&NewLine;<li>โค๊ดหรือชุดคำสั่งต่าง ๆ ค่อนข้างสะอาดมีโฟลเด้อต้นแบบแค่ 3 ส่วนคือ js&comma; css&comma; fonts<&sol;li>&NewLine;<li>ประหยัดเวลาในการพัฒนาเว็บไซต์และนำไปพัฒนาต่อได้ง่าย<&sol;li>&NewLine;<li>เป็น Responsive Framework พัฒนาเว็บไซต์ที่รองรับการแสดงผลได้หลากหลาย Device<&sol;li>&NewLine;<&sol;ul>&NewLine;<p><&sol;br><&sol;p>&NewLine;<h4>โครงสร้างไฟล์<&sol;h4>&NewLine;<p>หลังจากที่ดาวน์โหลด Boostrap framework มาแล้วเราจะได้มา 3 โฟลเด้อสำหรับใช้งานหลัก ๆ ดังนี้<&sol;p>&NewLine;<ul>&NewLine;<li><strong>CSS<&sol;strong> เป็นโฟลเด้อเก็บไฟล์ CSS ทั้งหมด วิธีใช้งานให้เรียกใช้งาน bootstrap&period;css เข้าไปใน html ไฟล์หลัก&NewLine;<pre class&equals;"lang&colon;default decode&colon;true " >&lt&semi;link rel&equals;"stylesheet" href&equals;"css&sol;bootstrap&period;min&period;css"&gt&semi;<&sol;pre>&NewLine;<&sol;li>&NewLine;<li><strong>JS<&sol;strong> เป็นโฟลเด้อเก็บไฟล์ Javascript ทั้งหมด วิธีใช้งานให้เรียกใช้งาน bootstrap&period;js เข้าไปใน html ไฟล์หลัก&NewLine;<pre class&equals;"lang&colon;default decode&colon;true " >&lt&semi;script src&equals;"js&sol;bootstrap&period;min&period;js"&gt&semi;&lt&semi;&sol;script&gt&semi;<&sol;pre>&NewLine;<&sol;li>&NewLine;<li><strong>fonts<&sol;strong> เป็นโฟลเด้อเก็บ fonts ต้นแบบและ icon ต่าง ๆ ของ boostrap จะถูกเรียกใช้งานผ่าน id และ class ในไฟล์ bootstrap&period;css ตัวอย่างเช่น ถ้าเราต้องการใช้งานไอคอนแว่นขยาย ก็จะสามารถเรียกใช้งานผ่าน class ดังนี้&NewLine;<pre class&equals;"lang&colon;default decode&colon;true " >&lt&semi;i class&equals;"glyphicon glyphicon-zoom-in"&gt&semi;&lt&semi;&sol;i&gt&semi;<&sol;pre>&NewLine;<&sol;li>&NewLine;<&sol;ul>&NewLine;<p>ท่านนักพัฒนาทั้งหลายสามารถดาวน์โหลด ฺBootstrap Framework มาใช้งานแบบฟรี ๆ รวมไปถึงดูตัวอย่างการใช้งานได้ที่<br &sol;>&NewLine;<a href&equals;"http&colon;&sol;&sol;getbootstrap&period;com" target&equals;"&lowbar;blank">http&colon;&sol;&sol;getbootstrap&period;com<&sol;a><br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;

Exit mobile version