เร่งเวิร์กโฟลว์ของคุณเมื่อสร้างธีม WordPress

เผยแพร่แล้ว: 2020-12-17

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

ขั้นตอนการทำงานดังกล่าวจะมีลักษณะอย่างไร? และคุณจะนำแนวทางปฏิบัติที่ดีที่สุดไปใช้กับงานประจำวันของคุณเพื่อเพิ่มความเร็วในการจัดส่งได้อย่างไร มีหลายวิธีที่เราสามารถตรวจสอบได้ คนแรกคือ:

การปรับปรุงเวิร์กโฟลว์ทางเทคนิค

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

คำแนะนำ 1 - เตรียมธีมเริ่มต้น

การปรับปรุงขั้นตอนการทำงานของเราที่ DevriX ครั้งใหญ่อย่างหนึ่งคือการทำสิ่งมาตรฐานทั้งหมดที่เราทำก่อนที่จะเริ่มแต่ละโครงการโฮสต์ไว้ในที่เก็บข้อมูลจากนั้นทำการโคลนทุกครั้งที่มีงานสร้างใหม่

เตรียมธีมเริ่มต้น

มันช่วยได้อย่างไร?

  1. ไม่จำเป็นต้องทำการตั้งค่าอึกทุกครั้ง แพคเกจทั้งหมดมีอยู่นอกกรอบรันการกำหนดค่าได้รับการทดสอบบนเครื่องมากกว่าหนึ่งเครื่อง
  2. มาพร้อมกับเอกสารสั้น ๆ หากมีสมาชิกในทีมใหม่ก็ไม่ต้องถามคำถามเกี่ยวกับงานการตั้งค่าพื้นฐานตามที่อธิบายไว้ส่วนใหญ่แล้ว
  3. ไม่จำเป็นต้องตัดสินใจเกี่ยวกับโครงสร้างไฟล์สำหรับส่วนหน้าทุกครั้ง ส่วนใหญ่ทีมงานส่วนหน้าของเราทำงานในธีมใหม่ตั้งแต่วันที่ 1 ดังนั้นหากพวกเขาต้องจัดทำโครงสร้างโฟลเดอร์ / ไฟล์สำหรับไฟล์ Sass ทุกครั้งเราจะเสียเวลาหลายชั่วโมงต่อโครงการ
  4. เราทำให้ทุกอย่างสอดคล้องกัน - นี่เป็นอีกหนึ่งการเพิ่มขึ้นอย่างมาก โดยปกติจะมีโปรเจ็กต์มากกว่าหนึ่งโปรเจ็กต์ที่เปิดใช้งานในเวลาเดียวกันดังนั้นการรู้ว่าจะหาสิ่งที่คุณต้องการได้ที่ไหนในครั้งแรกเมื่อคุณเปิดโปรเจ็กต์จึงช่วยประหยัดเวลาได้มาก ด้วยโครงสร้างที่เหมือนกันในทุกธีมสไตล์ไฟล์ JS ไฟล์ PHP ทั้งหมดอยู่ในที่เดียวกัน

เมื่อใดก็ตามที่เราพบแนวทางที่ดีกว่าในการแก้ไขปัญหาที่อาจช่วยปรับปรุงการตั้งค่าบิลด์แนะนำ linters, hooks, เพิ่มการดำเนินการบางอย่างที่นี่และที่นี่หรือฟังก์ชันตัวช่วยที่มักใช้เราจะอัปเดตธีมเริ่มต้นของเรา หากการเปลี่ยนแปลงในการตั้งค่าบิลด์มีความสำคัญเราจะอัปเดตโค้ดเบสของโปรเจ็กต์ที่มีอยู่ด้วยเพื่อทำตาม

คำแนะนำ 2 - รักษารูปแบบการเข้ารหัสและแนวทางเดียวกัน

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

คุณสามารถดูตัวอย่างคู่มือสไตล์การเข้ารหัส HTML / CSS ของ Google

คู่มือรูปแบบการเข้ารหัส HTML CSS ของ Google

ที่มา

วิธีทั่วไปในการตั้งชื่อ“ รายการ” หรือ“ ความคิดเห็น” หรือวิธีจัดการ“ รายการ” เช่น. .list-<name> และการ .list-<name> เป็นแนวทางมาตรฐานบางส่วนที่เราใช้ในการสร้างเค้าโครง

คำแนะนำ 3 - ปรับปรุงการตั้งค่าการทำงานในพื้นที่ของคุณ

วิธีที่รวดเร็วในการนำทางระหว่างโปรเจ็กต์คือการประหยัดเวลาได้ด้วยตัวเอง เพียงแค่ $cd'ing ระหว่างไดเรกทอรีสามารถใช้เวลาครึ่งชั่วโมงต่อวันได้อย่างง่ายดาย ทั้งหมดนี้เป็นค่าเสียเวลา แต่คุณสามารถตั้งค่า TMUX บนเครื่องของคุณตั้งค่าหน้าต่างแยกต่างหากสำหรับแต่ละโปรเจ็กต์และแผงแยกสำหรับแต่ละงาน / วัตถุประสงค์เช่น“ Running Gulp” - แผง 1; “ การเรียกใช้คำสั่งในธีม” - แผง 2; “ การเรียกใช้คำสั่งในปลั๊กอิน” - แผง 3

นอกจากนี้ - ตรวจสอบให้แน่ใจว่าคุณสามารถเปิดโปรแกรมแก้ไขโค้ดได้โดยตรงจากเทอร์มินัล เป็นวิธีที่เร็วกว่าในการเขียนโค้ดมากกว่าการเปิดจากไอคอนจากนั้นไปที่ "เปิดโปรเจ็กต์" และรายการที่ชอบ VS Code มีการตั้งค่าที่ง่ายมาก

ใช้เครื่องมือของคุณให้ดีขึ้น

  • VS code, Sublime text และเครื่องมืออื่น ๆ อีกมากมายมีป๊อปอัป“ Command” ที่คุณสามารถพิมพ์ได้เกือบทุกอย่างที่ตัวแก้ไขทำได้ บันทึกเอกสารที่เปิดอยู่ทั้งหมดไหม เพียงไม่กี่ปุ่ม ปิดพวกเขา? เหมือนกันทั้งหมด.
  • นำทางผ่านจานคำสั่ง - การเรียกดูไฟล์ในแถบด้านข้างใช้เวลามากเกินไป เพียงแค่เขียนชื่อไฟล์ที่คุณต้องการ เพิ่มส่วนขยายบางอย่างเพื่อเร่งการดำเนินการทั่วไปเช่นการเปลี่ยนชื่อการย้ายการทำซ้ำและการลบไฟล์
  • ติดตั้ง linters การเสียเวลาในการจัดรูปแบบไฟล์นั้นไม่จำเป็นเมื่อมีเครื่องมือที่สามารถทำเพื่อคุณได้ ทุกครั้งที่คุณเยื้องโค้ดให้เพิ่มช่องว่างระหว่างวงเล็บและอื่น ๆ อาจใช้ในการแก้ปัญหาได้ดีขึ้น
  • ใช้ทางลัดและตัวอย่าง - สำหรับนักพัฒนาส่วนหน้า Emmet คือตัวช่วยชีวิต บรรทัดเดียวง่ายๆเช่น nav>.site-nav>ul.list-items>li.list-item*5>a{title} ขยาย nav>.site-nav>ul.list-items>li.list-item*5>a{title} ถึง 15+ บรรทัดโดยจัดรูปแบบทั้งหมดและพร้อมที่จะจัดสไตล์ การพิมพ์บรรทัดนั้นใช้เวลาไม่กี่วินาที
ตัวอย่าง VSCode

ตัวอย่างจานคำสั่ง VSCode คุณสามารถอ่านเพิ่มเติมได้ในหน้าภาพรวม

การตัดสินใจเพื่อปรับปรุงเวิร์กโฟลว์

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

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

มอบหมายงานก่อน แต่ให้จำนวนคนที่เกี่ยวข้องต่ำ นี่คือสิ่งที่ทุกคนสังเกตเห็นในระยะหนึ่ง อาจจะเร็วที่สุดในโรงเรียนเมื่อเด็ก 10 คนได้ทำงานในโครงการ แต่มีเพียงสองหรือสามคนเท่านั้นที่ทำงานส่วนใหญ่

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

ทำงานให้เสร็จ

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

ช่วงเวลาที่ดีในการเพิ่มนักพัฒนาส่วนหน้ามากขึ้นคือเมื่อทำงานพื้นฐานเสร็จมากขึ้นและสามารถมอบหมายงานให้กับองค์ประกอบต่างๆเช่น "การ์ดเนื้อหา" หรือ "หน้า Landing Page X" หรือ "หน้า 404" และการกดไลค์ จากนั้นจะใช้แบบอักษรตั้งค่าการพิมพ์ทั่วไปไฟล์ส่วนใหญ่จะถูกสร้างขึ้นและมีการสร้างอย่างน้อย 1-2 หน้า

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

สมมติว่าเรามี John นักพัฒนาส่วนหน้าซึ่งทำงานในไซต์ใหม่เป็นเวลาสองสัปดาห์เต็ม ตอนนั้นเขามองมันมากกว่า 80 ชั่วโมงต่อวัน เขามีแนวโน้มที่จะหยุดพบปัญหาบนเว็บไซต์! ตอนนี้คงเป็นเวลาที่ดีที่เคทเพื่อนของเขาจะก้าวเข้ามาทำงานส่วนใหญ่ เคทสามารถเริ่มแก้ไขปัญหาเล็กน้อยตรวจสอบอีกครั้งว่าเป็นไปตามการออกแบบปรับปรุงประสิทธิภาพที่นี่และที่นั่นการตกแต่งหน้าและส่วนประกอบบางส่วนที่จอห์นเลื่อนออกไปเพียงเพราะเขาไม่มีพลังใจที่จะทำ

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

สรุป:

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

ในการจัดการทั้งหมดนี้ทีมงานที่แข็งแกร่งต้องการนักพัฒนาอาวุโสที่ดีในการวางสถาปัตยกรรมสมาชิกนักพัฒนาที่รับผิดชอบในการปฏิบัติตามแนวทางและผลิตผลงานที่มีคุณภาพและผู้จัดการโครงการที่ดีเพื่อมองหาสภาพจิตใจของทุกคน