В този учебник ще научиш за инструментите за разработчици на Microsoft Edge, които по много начини са подобни на инструментите за разработчици на Google Chrome. Ще научиш как да отвориш и ефективно използваш инструментите, както и разликите между двата набора на инструменти за браузър.
Най-важни изводи
Инструментите за разработчици на Edge предлагат практически идентичен потребителски интерфейс като на инструментите за разработчици на Chrome, когато става въпрос за основните функции. Разликите са основно в потребителския интерфейс и някои допълнителни функции, докато основните инструменти и преки пътища остават почти едни и същи.
Стъпка по стъпка ръководство
За да отвориш инструментите на Edge, имаш различни опции на разположение. Един начин е да натиснеш F12. Ако работиш на Mac, можеш да използваш комбинацията от бутоните Command + Option + I. Потребителите на Windows могат също да използват комбинацията Control + Shift + I. Ако искаш да отвориш инструментите за разработчици чрез контекстното меню, щракни с десен бутон на мишката върху хедъра на уебсайта и избери "Използвай".
Потребителския интерфейс на инструментите на Edge ще ти бъде познат, ако вече си работил с инструментите на Chrome. Табулациите са там, иконите изглеждат малко по-различно, а допълнителните инструменти се достъпват чрез „Плюс“-символ в горната лента. В Chrome тези допълнителни инструменти бяха достъпни чрез основното меню.
Ако искаш да добавиш нов таб в инструментите на Edge, просто щракни върху символа „Плюс“. Така можеш например да добавиш инструмента за анимация. Той ще бъде показан в горната част на лентата с табулации, сходно на Chrome DevTools.
Съществува и таб за „Добре дошли”, подобен на страницата „Какво ново” в Chrome. Тук можеш да видиш обобщение на функциите на инструментите за разработчици. Препоръчвам ти да го разгледаш, за да откриеш полезни съвети и трикове, които може би още не сме разгледали по време на курса.
Друга полезна функция на инструментите на Edge е възможността да преместиш лентата с табулациите вляво. Това позволява вертикално подреждане на табулациите. Иконите се показват като подсказки, което пести място и осигурява повече пространство за самите инструменти.
Инструментите за дизайн могат да бъдат персонализирани чрез различни настройки, подобни на тези в Chrome. Можеш да настроиш падащите менюта, документацията и лентата с действията. Така запазваш познатата среда за работа.
Една от няколкото разлики е символът за Azure DevOps в инструментите на Edge, който липсва в Chrome. Това е особено полезно за разработчиците, работещи в средата на Azure.
Когато си в съответните табулации, ще забележиш, че структурата и функциите в двете инструмента са практически идентични. Можеш да използваш стиловете, изчислените оформления и всичко друго, което си свикнал да ползваш в Chrome, и в Edge.
Обаче актуализациите на функциите могат да се различават леко. Когато Chrome добави нова функция, може би тя е достъпна в Edge малко по-късно или обратното. Затова е добре да проверяваш редовно какви нови функции се добавят в различните инструменти.
Това всъщност е всичко, което трябва да знаеш за инструментите на Edge. Ако вече си запознат с инструментите за разработчици на Chrome, ще се ориентираш бързо също и в инструментите на Edge.
Резюме
В този урок научи за сходствата и разликите между инструментите за разработчици на Google Chrome и Microsoft Edge. Сега знаеш как да отвориш инструментите и какви функции ти са на разположение, за да работиш ефикасно по своите уеб проекти.
