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

วิธีทำ Backend ด้วย CRUD Library ด้วยโค๊ดไม่กี่บรรทัด

ทำ-Backend-ด้วย-CRUD5

ทำ-Backend-ด้วย-CRUD5

<h2>วิธีทำ Backend ด้วย CRUD Library ด้วยโค๊ดไม่กี่บรรทัด<&sol;h2>&NewLine;<p><&sol;br><br &sol;>&NewLine;<strong>วิธีทำ Backend ด้วย CRUD Library ด้วยโค๊ดไม่กี่บรรทัด<&sol;strong><&sol;p>&NewLine;<p>CRUD ย่อมาจากคำ 4 คำคือ &lpar;Create&comma; Read&comma; Update&comma; Delete&rpar; อย่างที่เคยได้อธิบายในในกระทู้ <a href&equals;"https&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol;crud-คืออะไร&sol;" target&equals;"&lowbar;blank">CRUD คืออะไร รวม codeigniter library ที่จะทำให้ชีวิตง่ายขึ้น<&sol;a> <&sol;p>&NewLine;<p>วันนี้เลยจะมาแนะนำการใช้งาน CRUD Library สำหรับทำระบบหลังบ้านหรือ ระบบ backend เชื่อว่าโปรแกรมเมอร์หลาย ๆ คนที่พัฒนาเว็บไซต์ที่ต้องมีระบบหลังบ้านหรือมีโครงสร้างฐานข้อมูล จะต้องมีการพัฒนาระบบหลังบ้านควบคู่ไปกับการพัฒนาเว็บไซต์หลักหรือ frontend<&excl;--more--><&sol;p>&NewLine;<p><&sol;br><br &sol;>&NewLine;และนักพัฒนาหลาย ๆ คนอาจจะใช้วิธีนำ Source Code หลังบ้านของระบบเก่ามาปรับแก้ไข ให้ใช้ได้กับโครงสร้างฐานข้อมูลของเว็บไซต์ใหม่ ซึ่งก็เป็นวิธีที่ช่วยลดระยะเวลา ขั้นตอนการทำงานลงได้บ้าง แต่ก็ยังลำบากอยู่ดีเพราะถ้าต้องปรับแก้ไขทุกโปรเจคก็ถือว่าต้องใช้เวลาในการปรับอยู่มากพอสมควร และถ้าลูกค้าต้องการเปลี่ยน Theme ของระบบหลังบ้านก็จะยิ่งยุ่งยากเข้าไปอีกเพราะต้องปรับระบบให้ตรงกับโครงสร้างฐานข้อมูล และยังต้องปรับธีมให้ตรงตามแบบอีก<br &sol;>&NewLine;<&sol;br><br &sol;>&NewLine;CRUD Library จะเข้ามาช่วยทั้งในส่วนของโครงสร้างฐานข้อมูล และช่วยเรื่องการจัดการธีม นั้นหมายความว่าทุก ๆ โปรเจคเว็บไซต์ เราสามารถปรับให้มีรูปร่างหน้าตาที่ไม่ซ้ำกันได้และเปลี่ยนระบบหลังบ้านไปตามโครงสร้างฐานข้อมูลได้แบบง่าย ๆ <&sol;p>&NewLine;<p>ในบทความนี้จะขอแนะนำวิธีการใช้งาน CRUD Library ที่ชื่อว่า <a href&equals;"https&colon;&sol;&sol;www&period;grocerycrud&period;com" target&equals;"&lowbar;blank">Grocery crud<&sol;a> ซึ่งเป็น Library ที่ถูกพัฒนาบนพื้นฐานของ Codeigniter Framework นั่นหมายความว่าถ้าเรามีพื้นฐานการใช้งาน Codeigniter อยู่แล้ว จะใช้เวลาในการเรียนรู้น้อยมาก ๆ<br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;<h4>เริ่มใช้งาน Grocery crud<&sol;h4>&NewLine;<ul>&NewLine;<li><strong>1&period; ดาวน์โหลด CRUD<&sol;strong><br &sol;>&NewLine;ให้ไปดาวน์โหลด Library ที่ <a href&equals;"http&colon;&sol;&sol;www&period;grocerycrud&period;com" target&equals;"&lowbar;blank">grocerycrud&period;com<&sol;a> เราจะได้โฟลเด้อหลักมา 2 โฟลเด้อคือ application และ assets ตามโครงสร้างของ codeigniter ไฟล์ใน application จะเป็นโครงสร้างของ crud ส่วนไฟล์ใน assets จะไว้จัดการเรื่อง theme&NewLine;<&sol;li>&NewLine;<p><&sol;br><&sol;p>&NewLine;<li><strong>2&period; ติดตั้ง CRUD <&sol;strong><br &sol;>&NewLine;หลังจากที่เราได้มาทั้ง 2 โฟลเด้อแล้ว ให้สร้างโปรเจค codeigniter และนำไฟล์ทั้งหมดที่อยู่ใน application และ assets ไปวางไว้ในแต่ละโฟลเด้อ ยกตัวอย่างเช่น ไฟล์ชื่อว่า application&sol;config&sol;grocery&lowbar;crud&period;php ให้นำไฟล์ grocery&lowbar;crud&period;php ไปวางไว้ในโฟลเด้อ config ของ codeigniter&NewLine;<&sol;li>&NewLine;<p><&sol;br><&sol;p>&NewLine;<li><strong>3&period; เลือกฐานข้อมูลสำหรับ backend<&sol;strong><br &sol;>&NewLine;หลังจากที่เราติดตั้ง codeigniter และ crud เรียบร้อยแล้วให้ไปที่ไฟล์ application&sol;config&sol;config&period;php กำหนดฐานข้อมูลและการเชื่อมต่อปกติของ codeigniter&NewLine;<&sol;li>&NewLine;<p><&sol;br><&sol;p>&NewLine;<li><strong>4&period; สร้าง database table&comma;view และ controller สำหรับทดสอบ<&sol;strong><br &sol;>&NewLine;ให้ทดลองสร้างฐานข้อมูลเบื้องต้นสำหรับทดสอบ โดยในตัวอย่างผู้เขียนได้สร้าง table ชื่อว่า apps&lowbar;position โดยมีโครงสร้างดังนี้<br &sol;>&NewLine;<&sol;br><br &sol;>&NewLine;<strong>เทเบิ้ล apps&lowbar;position<&sol;strong><br &sol;>&NewLine;<img src&equals;"https&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2017&sol;10&sol;ทำ-Backend-ด้วย-CRUD1&period;png" alt&equals;"ทำ-Backend-ด้วย-CRUD1" &sol;><br &sol;>&NewLine;<&sol;br><br &sol;>&NewLine;จากนั้นให้สร้าง Controller โดยใช้ความสามารถของ Grocery crud ดึงข้อมูลมาแสดง ดังนี้<&sol;p>&NewLine;<p><strong>ไฟล์ controller ที่ชื่อว่า Examples&period;php <&sol;strong><&sol;p>&NewLine;<pre class&equals;"lang&colon;default decode&colon;true " >class Examples extends CI&lowbar;Controller &lbrace; &NewLine;&Tab;public function &lowbar;&lowbar;construct&lpar;&rpar; &NewLine;&Tab;&lbrace; &NewLine;&Tab;&Tab;parent&colon;&colon;&lowbar;&lowbar;construct&lpar;&rpar;&semi; &NewLine;&Tab;&Tab;&dollar;this-&gt&semi;load-&gt&semi;database&lpar;&rpar;&semi; &sol;&sol; เปิดใช้งานการเชื่อมต่อฐานข้อมูล &NewLine;&Tab;&Tab;&dollar;this-&gt&semi;load-&gt&semi;helper&lpar;'url'&rpar;&semi; &sol;&sol; ใช้ url helper ของ codeigniter &NewLine;&Tab;&Tab;&dollar;this-&gt&semi;load-&gt&semi;library&lpar;'grocery&lowbar;CRUD'&rpar;&semi; &sol;&sol; โหลด CRUD Library มาใช้งาน &NewLine;&Tab;&rcub; &NewLine;&Tab;public function member&lowbar;management&lpar;&rpar; &NewLine;&Tab;&lbrace; &NewLine;&Tab;&Tab;&dollar;crud &equals; new grocery&lowbar;CRUD&lpar;&rpar;&semi; &sol;&sol; สร้างตัวแปร crud &NewLine;&Tab;&Tab;&dollar;crud-&gt&semi;set&lowbar;theme&lpar;'datatables'&rpar;&semi; &sol;&sol; เลือกธีมที่จะให้แสดงผล &NewLine;&Tab;&Tab;&dollar;crud-&gt&semi;set&lowbar;table&lpar;'apps&lowbar;position'&rpar;&semi; &sol;&sol; เลือกเทเบิ้ลในฐานข้อมูล &NewLine;&Tab;&Tab;&dollar;output &equals; &dollar;crud-&gt&semi;render&lpar;&rpar;&semi; &sol;&sol; สั่ง render &NewLine;&Tab;&Tab;&dollar;this-&gt&semi;load-&gt&semi;view&lpar;'example'&comma;&dollar;output&rpar;&semi; &sol;&sol; ส่งไปแสดงผลที่ view &NewLine;&Tab;&rcub; &NewLine;&rcub;<&sol;pre>&NewLine;<p>จากนั้นให้ทดสอบระบบด้วยการ run controller ตัวอย่างเช่น http&colon;&sol;&sol;localhost&sol;examples&sol;position&lowbar;management<br &sol;>&NewLine;<strong>ผลลัพธ์ที่ได้<&sol;strong><br &sol;>&NewLine;<img src&equals;"https&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2017&sol;10&sol;ทำ-Backend-ด้วย-CRUD2&period;png" alt&equals;"ทำ-Backend-ด้วย-CRUD" &sol;><br &sol;>&NewLine;จะเห็นว่า Grocery crud ได้จัดเตรียมฟังก์ชั่นต่าง ๆ ทั้งการเพิ่มข้อมูล แก้ไข ลบ export excel ค้นหา filter ให้เราเสร็จสรรพ โดยการเขียนโค๊ดเพียงไม่กี่บรรทัด<br &sol;>&NewLine;<&sol;br>&NewLine;<&sol;li>&NewLine;<&sol;ul>&NewLine;<p><&sol;br><&sol;p>&NewLine;<h4>จัดการ Theme ใน Grocery crud<&sol;h4>&NewLine;<p>theme ใน grocery crud จะถูกเก็บไว้ในโฟลเด้อ assets&sol;grocery&lowbar;crud&sol;themes&sol; โดยเริ่มต้นจะมี theme ต้นแบบให้เลือกใช้งานอยู่ 3 แบบด้วยกันคือ<&sol;p>&NewLine;<ul>&NewLine;<li>datatables<&sol;li>&NewLine;<li>flexigrid<&sol;li>&NewLine;<li>twitter-bootstrap<&sol;li>&NewLine;<&sol;ul>&NewLine;<p>เราสามารถเปลี่ยน theme ได้ด้วยคำสั่ง <strong>&dollar;crud->set&lowbar;theme&lpar;&&num;8216&semi;datatables&&num;8217&semi;&rpar;&semi;<&sol;strong> นอกจากนั้นเรายังสามารถพัฒนาธีมขึ้นมาใช้งานเองได้<br &sol;>&NewLine;<&sol;br><br &sol;>&NewLine;วิธีสร้าง theme ใน grocery crud นั้นไม่ยุ่งยากเลยครับ ง่าย ๆ เลยให้เรา copy&sol;paste โฟลเด้อ theme ต้นแบบ จากนั้นก็ปรับแก้หน้าตาจากไฟล์ js&comma;css&comma;font&comma;image เหมือนเราทำ html ธรรมดาครับ โดยข้อมูลการแสดงผลแต่ละหน้าคือการแสดงรายการ การเพิ่ม การแก้ไข การลบ จะถูกเก็บไว้ใน assets&sol;grocery&lowbar;crud&sol;themes&sol;views&sol; ก็สามารถเข้าไปปรับแก้ได้เลย<br &sol;>&NewLine;<&sol;br><br &sol;>&NewLine;<img src&equals;"https&colon;&sol;&sol;www&period;codebee&period;co&period;th&sol;labs&sol;wp-content&sol;uploads&sol;2017&sol;10&sol;ทำ-Backend-ด้วย-CRUD3&period;png" alt&equals;"ทำ-Backend-ด้วย-CRUD" &sol;><br &sol;>&NewLine;<&sol;br><&sol;p>&NewLine;

Exit mobile version