การสร้างต้นแบบแอปที่คล้ายกับ Trello โดยใช้ WordPress REST API

เผยแพร่แล้ว: 2017-02-03

เราได้โน้มน้าว REST API ของ WordPress หลายครั้งตั้งแต่มีการประกาศ ว่าเป็นการก้าวไปสู่ยุคใหม่สำหรับแพลตฟอร์ม ในโพสต์นี้ เราจะใช้ประโยชน์จากทุกสิ่งที่เราได้เรียนรู้ในช่วงไม่กี่สัปดาห์ที่ผ่านมา โดยใช้ตัวอย่างที่แสดงให้เห็นว่า WordPress REST API มีประสิทธิภาพและหลากหลายเพียงใด

เนื่องจากความสามารถในการทำงานร่วมกันระหว่างภาษาต่างๆ อยู่ที่หัวใจของ REST เราจะออกแบบต้นแบบ แอปพลิเคชันที่คล้ายกับ Trello โดยใช้อนุกรมวิธานและโพสต์ WordPress ที่ดี แต่มีการบิดเบี้ยว! ด้วยวิธีนี้ เราหวังว่าจะแสดงให้เห็นว่า WordPress สามารถใช้เป็นแพลตฟอร์มการพัฒนาได้อย่างไร

Trello เป็นแอปพลิเคชั่นการจัดการโครงการที่ประสบความสำเร็จโดยใช้กระบวนทัศน์ Kanban ซึ่งเดิมเป็นที่นิยมโดย Toyota ในทศวรรษ 1980 โครงการจะแสดงเป็น กระดาน ซึ่งประกอบด้วยคอลัมน์ที่เต็มไปด้วย การ์ด ที่เกี่ยวข้องกับงาน การ์ดจะย้ายจากคอลัมน์หนึ่งไปยังอีกคอลัมน์หนึ่ง จนกว่าการ์ดจะอยู่ในสถานะ เสร็จสิ้น ( f หรือตัวอย่าง จาก สิ่ง ที่ต้อง ทำเป็น เสร็จสิ้น ไปยัง เสร็จสิ้น) โฟลว์นี้เรียกว่ากระแสคุณค่า แนวคิดหลักสองประการที่อยู่เบื้องหลัง Kanban คือ ก) แสดงภาพงานของคุณ และ ข) จำกัดงานที่กำลังดำเนินการอยู่ในปัจจุบันของคุณ ในกรณีของ Trello งานจะแสดงภาพโดยใช้การ์ดกราฟิก คอลัมน์สามารถมีความจุสูงสุดได้เช่นกัน ซึ่งหมายความว่าคุณสามารถวางงานจำนวนหนึ่งไว้ในคอลัมน์หนึ่งๆ และไม่เกินนั้น ตัวอย่างเช่น คอลัมน์ Doing ด้านล่างมีความจุ 2

การออกแบบแอพพลิเคชั่น

เราจะออกแบบกระบวนทัศน์ Kanban เวอร์ชันน้อยที่สุดและเปลือยเปล่าเพื่อเป็นการพิสูจน์แนวคิด ฟังก์ชันหลักมีดังต่อไปนี้:

  1. ผู้ใช้สามารถสร้าง/อัปเดต/ลบคอลัมน์ใหม่ได้
  2. ผู้ใช้สามารถสร้าง/อัปเดต/ลบการ์ดใหม่ที่อยู่ภายใต้คอลัมน์เฉพาะได้

แนวคิดพื้นฐานเกี่ยวกับวิธีการนำไปใช้ทั้งหมดนั้นง่ายมากโดยใช้ REST API:

  • คอลัมน์ Kanban จะแสดง เป็น หมวดหมู่ WordPress
  • ความจุของคอลัมน์สามารถวางเป็นตัวเลขจำนวนเต็มใน คำอธิบายหมวดหมู่ ได้
  • การ์ด Kanban เป็น โพสต์ ที่กำหนดให้กับ หมวด หมู่
  • การย้ายการ์ดจากคอลัมน์ไปยังอีกคอลัมน์หนึ่งหมายถึงเพียงแค่เปลี่ยน หมวดหมู่ ที่เกี่ยวข้อง ของโพสต์

ตามแนวคิด "ทำซ้ำในช่วงต้นและบ่อยครั้ง" ของการสร้างต้นแบบอย่างรวดเร็ว Kanban API ที่นำเสนอด้านล่างนี้เป็นเพียงแบบร่างเท่านั้น ฟังก์ชันต่างๆ ได้รับการอนุมานจากฟังก์ชันหลักสองอย่างที่แสดงไว้ก่อนหน้านี้ และการแมปเนื้อหา WordPress ของคอลัมน์กับหมวดหมู่และการ์ดไปยังโพสต์ ไม่ต้องสงสัยเลยว่าปัญหาใหม่และท้าทายจะเกิดขึ้นเมื่อการใช้งานต้นแบบเริ่มต้นขึ้น แต่ร่างต่อไปนี้ก็เพียงพอแล้วสำหรับเราที่จะเริ่มต้น!

API คอลัมน์ Kanban

รายการด้านล่างบันทึกฟังก์ชันที่จะจัดการคอลัมน์คัมบังพร้อมกับประเภทพารามิเตอร์ คอลัมน์จะถูกแสดงเป็นหมวดหมู่ WordPress และจำนวนความจุจะถูกเพิ่มในคำอธิบายหมวดหมู่ รายการนี้ไม่ได้บันทึกค่าส่งคืน เนื่องจากสำหรับต้นแบบนี้ ออบเจ็กต์ตอบกลับ JSON จาก WordPress ก็เพียงพอแล้ว

โฮสต์เว็บไซต์ของคุณด้วย Pressidium

รับประกันคืนเงิน 60 วัน

ดูแผนของเรา

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

• create_new_col(cname:string, cap:int)
สร้างคอลัมน์คัมบังใหม่ชื่อ cname ด้วยจำนวนเต็มจำนวนเต็ม แทน ความจุ

ทรัพยากร WordPress API: สร้างหมวดหมู่ใหม่

สิ่งนี้จะสร้างประเภทใหม่ แล้วเพิ่มหมายเลขจำนวนเต็มความจุให้กับคำอธิบายประเภท

change_col_name(ชื่อเดิม:สตริง ชื่อใหม่:สตริง)
เปลี่ยนชื่อคอลัมน์ Kanban จาก oldname เป็น newname

ทรัพยากร WordPress API: แก้ไขหมวดหมู่

นี้ก็จะเปลี่ยนชื่อหมวดหมู่

change_col_cap(newcap:int )
เปลี่ยนความจุคอลัมน์เป็น newcap

ทรัพยากร WordPress API: แก้ไขหมวดหมู่

การดำเนินการนี้จะเปลี่ยนคำอธิบายของหมวดหมู่ที่เกี่ยวข้องเพื่อเพิ่มจำนวนความจุใหม่

delete_col(ชื่อคอลัมน์:สตริง)
ลบคอลัมน์ชื่อ colname

ทรัพยากร WordPress API: ลบหมวดหมู่

การทำเช่นนี้จะเป็นการลบหมวดหมู่ที่สอดคล้องกับคอลัมน์ โดยการทำเช่นนี้ คุณจะ "กำพร้า" การ์ดในคอลัมน์นั้นอย่างมีประสิทธิภาพ คุณจะต้องตัดสินใจว่าจะใช้การลบนี้อย่างไร ตัวอย่างเช่น ก) การลบคอลัมน์หมายถึงการลบทุกอย่างภายใต้คอลัมน์นั้นหรือ b) การลบแบบ "อ่อน" โดยอาจเปลี่ยนชื่อการ์ดภายใต้เป็น _del_<category> เพื่อให้คุณสามารถยกเลิกการลบได้ในอนาคต

Kanban Cards API

รายการด้านล่างเหมือนกัน แต่สำหรับการ์ด Kanban การ์ดจะแสดงเป็นโพสต์ WordPress โดยใช้ชื่อโพสต์เพื่ออธิบายงานที่ต้องทำอย่างมีประสิทธิภาพ เนื้อหาของโพสต์สามารถใช้เป็นที่เก็บบันทึกเพิ่มเติมได้

• create_new_card(cname:string)

สร้างการ์ดใหม่ชื่อ cname

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

• create_new_card(cname:string, c:string)

สร้างโพสต์ใหม่ที่มีชื่อ cname และเนื้อหา c.

เช่นเดียวกับด้านบน แต่การ์ดถูกสร้างขึ้นด้วยเนื้อหาเช่นกัน

• create_new_card(cname:string, cont:string, colname:string)

สร้างโพสต์ใหม่ที่มีชื่อ cname , เนื้อหา ต่อ , ภายใต้หมวดหมู่ colname

ทรัพยากร WordPress API: สร้างโพสต์ใหม่

• add_card_col(cname:string, colname:string)

เพิ่มการ์ดที่มีชื่อ cname ให้กับคอลัมน์ที่มีชื่อ colname

ทรัพยากร WordPress API: แก้ไขโพสต์

• move_card_col(cname:string, colname:string)

ย้ายการ์ดที่มีชื่อ cname ใต้คอลัมน์ชื่อ colname สิ่งนี้ควรลบหมวดหมู่เก่าของโพสต์ก่อนที่จะเพิ่มใหม่

ทรัพยากร WordPress API: แก้ไขโพสต์

• delete_card(cname:string)
ลบการ์ดที่มีชื่อ cname

ทรัพยากร WordPress API: ลบโพสต์

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

ความสมบูรณ์ของข้อมูล

ตอนนี้เราได้จับคู่ฟังก์ชันของเรากับการเรียกและทรัพย์สินของ WordPress API แล้ว เราจำเป็นต้องตรวจสอบให้แน่ใจว่าข้อมูลของเรามีความสอดคล้องกัน ตัวอย่างเช่น คอลัมน์คัมบังที่มีความจุ 2 ใบ ไม่สามารถถือการ์ดได้เกิน 2 ใบ การ์ดไม่สามารถอยู่ในสองคอลัมน์พร้อมกันได้ เมื่อการ์ดถูกย้ายไปยังคอลัมน์อื่น จะต้องลบออกจากตำแหน่งเดิม อย่างไรก็ตาม WordPress ไม่รู้อะไรเลยเกี่ยวกับข้อจำกัดเหล่านี้ ดังนั้นแอปพลิเคชันของเราจำเป็นต้องตรวจสอบและบังคับใช้ในการดำเนินการเขียนทุกครั้ง

เนื่องจากนี่เป็นเครื่องต้นแบบ จึงไม่ใช่ทุกกรณีของ edge-case ที่ชัดเจนจากขั้นตอนการออกแบบ สิ่งเหล่านี้จะผุดขึ้นอย่างหลีกเลี่ยงไม่ได้ระหว่างการใช้งานแต่ละฟังก์ชัน

งานต่อไป

จนถึงตอนนี้ เราเพิ่งพูดถึง API ที่จะขับเคลื่อนแอปพลิเคชัน Kanban ของเราโดยใช้ทรัพยากร WordPress ในรูปแบบต่างๆ ต้นแบบของเราจะบกพร่องอย่างมากหากประกอบด้วย API แบ็กเอนด์จำนวนหนึ่งที่ไม่มีส่วนหน้าที่ผู้ใช้สามารถใช้งานได้จริง เป็นอีกครั้งที่เราเห็นความเก่งกาจของ REST API เนื่องจากไม่มีใครบอกว่าคุณควรดำเนินการอย่างไร คุณสามารถใช้บางอย่างเช่น Bootstrap หรือเขียน 'ole GUI ที่ดีใน Java; ไม่มีการจำกัดสิ่งที่คุณสามารถใช้ได้อย่างแท้จริง

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

การพัฒนา WordPress นั้นน่าตื่นเต้นมาก!