เนื้อหา
- แนะนำ ITCSS
- ทำไมคุณไม่แนะนำตัวเอง?
- และ ITCSS. มันคืออะไร?
- คุณจะอธิบายปรัชญาของ ITCSS ได้อย่างไร?
- คุณสร้างมันขึ้นมาทำไม?
สถาปัตยกรรม CSS กำลังเป็นที่นิยมในขณะนี้ เป็นสิ่งที่คุณไม่ต้องสงสัยเลยว่าได้ยินได้กล่าวถึงหลายครั้งในช่วงปีที่ผ่านมาและด้วยเหตุผลที่ดี: UI (และทีมที่สร้างขึ้น) มีขนาดใหญ่ขึ้นและซับซ้อนมากขึ้นกว่าเดิม
CSS มีหลายแง่มุมที่ทำให้ยุ่งยากเช่นกัน
เป็นการเปิดเผยซึ่งหมายความว่าไม่มีตรรกะหรือขั้นตอนการควบคุมที่จะบอกให้นักพัฒนาซอฟต์แวร์รายอื่นทราบมากนักเกี่ยวกับสถานะหรือการก่อสร้างโครงการ มันทำงานในเนมสเปซทั่วโลกซึ่งหมายความว่าเราได้รับการชนกันรูปแบบที่รั่วไหลและการถอยหลังโดยไม่ได้ตั้งใจ
มันใช้ประโยชน์จากการถ่ายทอดทางพันธุกรรมทำให้ทุกอย่างค่อนข้างพึ่งพาซึ่งกันและกันและเปราะบาง สุดท้ายโมเดลความจำเพาะที่หลีกเลี่ยงไม่ได้อาจทำให้เกิดปัญหาเมื่อตัวเลือกต่อสู้กันเพื่อความโดดเด่น
สิ่งเหล่านี้ล้วนเป็นปัญหาในตัวของมันเอง แต่เมื่อทำงานในระดับที่สมเหตุสมผลพวกเขาจะชัดเจนขึ้นโดยตรงหรือโอกาสที่จะพบปัญหาดังกล่าวนั้นสูงกว่ามากในทางสถิติ
ป้อนสถาปัตยกรรม CSS: วิธีการวางแผนและจัดโครงสร้าง CSS ของคุณสำหรับโครงการขนาดใหญ่และดำเนินการมายาวนาน
แนะนำ ITCSS
ITCSS - "Inverted Triangle CSS" เป็นวิธีการใหม่ มันเกี่ยวข้องกับการแสดงภาพโครงการ CSS ทั้งหมดของคุณเป็นสามเหลี่ยมกลับหัว รูปร่างตามลำดับชั้นนี้แสดงถึงโมเดลที่จะช่วยให้คุณสั่ง CSS ได้อย่างมีประสิทธิภาพที่สุดและสิ้นเปลืองน้อยที่สุด
- Harry Roberts ได้เขียนแนะนำ ITCSS ฉบับพิเศษหกหน้าสำหรับนิตยสาร net ฉบับใหม่
เราสนทนากับ Harry Roberts - ผู้สร้าง ITCSS
ทำไมคุณไม่แนะนำตัวเอง?
เฮ้! ฉันคือแฮร์รี่ ฉันเป็นที่ปรึกษา Front-end Architect จากสหราชอาณาจักร งานของฉันคือการเดินทางไปรอบ ๆ จากลูกค้าไปยังลูกค้าเพื่อช่วยให้พวกเขาและทีมของพวกเขาเข้าใจและจัดการทุกอย่างได้ดีขึ้นตั้งแต่กระบวนการออกแบบไปจนถึงสถาปัตยกรรม CSS ไปจนถึงประสิทธิภาพ
ฉันโชคดีพอที่จะทำสิ่งนี้ให้กับผู้คนเช่น Google, Kickstarter และ BBC และอื่น ๆ ฉันมีงานที่ดีที่สุดในโลก
และ ITCSS. มันคืออะไร?
ITCSS ซึ่งย่อมาจาก Inverted Triangle CSS เป็นสถาปัตยกรรม CSS ที่มีการจัดการเต็มรูปแบบ ไม่ใช่กรอบงานหรือไลบรารี ไม่มีอะไรให้ดาวน์โหลดหรือติดตั้ง
เป็นการรวบรวมหลักการและเมตริกที่นักพัฒนาควรจัดกลุ่มและจัดลำดับ CSS ของตนเพื่อให้สามารถปรับขนาดได้กระชับมีเหตุผลและจัดการได้
มีความเห็นเป็นพิเศษในการให้กฎและแนวทางที่ชัดเจนสำหรับลำดับแหล่งที่มาและการจัดกลุ่มของคุณ แต่ให้การตัดสินใจเกี่ยวกับรูปแบบการตั้งชื่อและตัวประมวลผลล่วงหน้า ฯลฯ ขึ้นอยู่กับคุณ ซึ่งหมายความว่าแม้ว่าจะเหมาะอย่างยิ่งกับโครงการขนาดใหญ่ แต่ ITCSS สามารถใช้กับงานสร้างได้ทุกรูปแบบและทุกขนาด
คุณจะอธิบายปรัชญาของ ITCSS ได้อย่างไร?
ปรัชญาของ ITCSS นั้นเป็นหลักที่เรียบง่าย โดยพื้นฐานแล้วเราควรจัดลำดับ CSS ตามเมตริกที่กำหนดโดยภาษา (และคุณลักษณะของมัน) มากกว่ามาตรฐานปกติของรูปแบบที่มุ่งเน้นมนุษย์
ITCSS ใช้ CSS และเขียนด้วยวิธีที่เบราว์เซอร์และการออกแบบภาษาสามารถใช้ประโยชน์ได้ดีที่สุดซึ่งทำให้เรามีความสามารถในการปรับขนาดและการบำรุงรักษาได้ดีกว่าที่เราจะได้รับหากเราเขียน CSS เกี่ยวกับความคิดของบุคคล
กล่าวได้ว่าการย้ายไปยัง ITCSS (ทั้งในเชิงแนวคิดและในทางปฏิบัติ) ไม่ได้สร้างความตกใจให้กับระบบอย่างที่คุณคิด โดยพื้นฐานแล้วจะต้องใช้ปัจจัยพื้นฐานสองสามอย่างจากนั้นจึงเป็นธุรกิจตามปกติ
คุณสร้างมันขึ้นมาทำไม?
ฉันเริ่มทำงานในทีมผลิตภัณฑ์ในปี 2011 ซึ่งยังไม่มีงานเขียนและการค้นคว้าเกี่ยวกับ CSS ในระดับนั้นมากนัก ฉันถูกโยนเข้าไปในสภาพแวดล้อมที่ฉันเป็นนักพัฒนาส่วนหน้าเพียงคนเดียวในทีมวิศวกรรมของ dozes ซึ่งทำงานบนโค้ดเบสขนาดใหญ่ที่เราจะอยู่ในช่วงหลายปีต่อ ๆ ไป
ฉันเริ่มทำการค้นคว้าและเขียนเกี่ยวกับ CSS ระดับผลิตภัณฑ์เพราะฉันกำลังเริ่มแก้ปัญหามากมายด้วยตนเอง สิ่งสำคัญอย่างหนึ่งที่ฉันเริ่มมองหาเพื่อแก้ปัญหาคือสถาปัตยกรรมที่สมบูรณ์ (แทนที่จะพูดแบบแผนการตั้งชื่อ) ซึ่งเป็นสาเหตุที่ ITCSS ถือกำเนิดขึ้น
จำเป็นอย่างยิ่งที่ฉันจะต้องสร้างระบบที่เข้าถึงได้คาดเดาได้เดาได้ตามกฎมีแนวโน้มที่จะมีขนาดไฟล์เล็กลงและมุ่งเน้นไปที่ความสามารถในการขยายขนาดและการเติบโต
อื่น ๆ ในช่วงสี่ปีที่ผ่านมางานนี้ได้รับการยกย่องให้เป็น ITCSS อย่างเป็นทางการ
หน้าถัดไป: วิธีการทำงานของ ITCSS และเวลาที่นักพัฒนาควรพิจารณาเรียกร้อง ...