ฉลองการติดตั้ง Edge DevTools 1 ล้านครั้งสำหรับ VS Code

ส่วนขยาย Edge DevTools สำหรับ Visual Studio Code มีการดาวน์โหลดมากกว่า 1 ล้านครั้ง ใช้เวลาในการสรุปเล็กน้อยว่ามันเป็นอย่างไร

ส่วนขยายที่แสดงสิ่งที่ทำในโค้ด visual studio

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

วิศวกรคนหนึ่งในทีมของเราแสดงให้ฉันเห็นแนวคิดที่เขามี เนื่องจากทั้งเบราว์เซอร์และตัวแก้ไข (ในกรณีนี้คือ Visual Studio Code) อยู่บนแพลตฟอร์มเดียวกัน (Chromium) จึงเป็นไปได้ที่จะรวมประสบการณ์การดีบักที่สะดวกของเครื่องมือสำหรับนักพัฒนาเบราว์เซอร์เข้ากับตัวแก้ไขโดยตรง ไม่เพียงแต่เปลี่ยนสิ่งที่เป็นอยู่ แสดงในเบราว์เซอร์ แต่ยังรวมถึงซอร์สโค้ดที่สร้างด้วย

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

กรอไปข้างหน้าจนถึงตอนนี้และส่วนขยาย DevTools สำหรับ Visual Studio Code เพิ่งทำคะแนนการติดตั้ง 1 ล้านครั้ง

ส่วนหัวของรายการส่วนขยายแสดงจำนวนการติดตั้ง

นอกจากนี้เรายังมีผู้ใช้ประมาณ 30,000 รายต่อวันและได้รับ [ข้อเสนอแนะที่ยอดเยี่ยมเกี่ยวกับที่เก็บ GitHub](https://ift.tt/SDne6N3) มากมาย

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

หากคุณยังไม่ได้ลองใช้ส่วนขยาย นี่คือสิ่งที่ได้ผลสำหรับคุณ:

  • เน้นปัญหาในโค้ดของคุณพร้อมคำอธิบายว่าปัญหาคืออะไรและจะแก้ไขได้อย่างไร นี่เป็นการถ่ายทอดสด ดังนั้นในขณะที่คุณพัฒนาผลิตภัณฑ์ของคุณ คุณจะได้รับข้อมูลเกี่ยวกับสิ่งที่คุณกำลังทำและสิ่งที่ทำให้เกิดความเสียหาย
    ปัญหารหัสในเอกสารที่ถูกตั้งค่าสถานะและอธิบาย
  • แสดงผลิตภัณฑ์ของคุณในการแสดงตัวอย่างเบราว์เซอร์ด้วยตัวเลือกการจำลอง (จำลองอุปกรณ์ต่างๆ โหมดต่างๆ เช่น ความเข้ม/สว่าง/คอนทราสต์สูง) และทดสอบความสามารถในการเข้าถึงบางอย่าง
    การแสดงตัวอย่างเบราว์เซอร์ที่แสดงโครงการปัจจุบันในความละเอียดมือถือจำลอง
  • ซิงค์การเปลี่ยนแปลงในเครื่องมือสำหรับนักพัฒนา เช่น การแก้ไขปัญหา CSS แบบสดด้วยซอร์สโค้ดของคุณ
    การเปลี่ยนแปลงสไตล์โดยใช้เครื่องมือภาพจะส่งผลต่อซอร์สโค้ด
  • เพิ่มคอนโซลสำหรับทดสอบ JavaScript
    คอนโซลเบราว์เซอร์ภายใน VS Code
  • เพิ่มเครื่องมือแอปพลิเคชันเพื่อตรวจสอบพื้นที่เก็บข้อมูลและบริการที่ทำงานอยู่เบื้องหลัง
  • ให้คุณตรวจสอบทราฟฟิกเครือข่ายของผลิตภัณฑ์ของคุณ
  • อนุญาตให้ตั้งค่าเบรกพอยต์ในซอร์สโค้ดของคุณและรับดีบักเกอร์ในบริบท

แม้ว่าทั้งหมดนี้จะทำให้นักพัฒนาเว็บในตัวฉันตื่นเต้นมาก PM ในตัวฉันก็มีความสุขมากเกี่ยวกับความหมายของโครงการเครื่องมือสำหรับนักพัฒนา Chromium (ซึ่งใช้งานอยู่ในเบราว์เซอร์ทั้งหมดที่ใช้ Chrome, Microsot Edge, Brave … ) ทั้งหมดขึ้น:

  • เราทำความสะอาดฐานโค้ดที่มีอายุมากกว่า 10 ปีเพื่อไม่ให้เป็นกล่องขนาดใหญ่ในเบราว์เซอร์ แต่อนุญาตให้ใช้เครื่องมือต่างๆ ในแอปเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์แยกกันได้
  • เราได้อัปเกรด screencast ของเบราว์เซอร์ของ Chromium เป็นพาเนลที่สมบูรณ์ภายในโค้ด VS ซึ่งสามารถย้ายไปยังทุกที่ที่คุณต้องการและมีการโต้ตอบทั้งหมดที่คุณมีในหน้าต่างเบราว์เซอร์หลักเมื่อพูดถึงโอเวอร์เลย์และแสดงคุณสมบัติ CSS
  • เราได้รวมฟังก์ชันการทำงานของแผงปัญหาเข้ากับโค้ดของคุณเพื่อแสดงการรายงานปัญหาที่เกิดขึ้นจริงรวมถึงความสามารถในการปรับแต่ง

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

มีอะไรอีกมากมายที่จะได้รับจากการใช้เครื่องมือ Chromium Developer และฝังไว้ในบริบทที่ต่างออกไป และฉันตื่นเต้นมากที่เราสามารถทำได้สำเร็จและไปถึงสถานที่สำคัญแห่งนี้ เพิ่มเติมที่จะมา

ใส่ความเห็น

อีเมลของคุณจะไม่แสดงให้คนอื่นเห็น