Dev_Tool_Quiz.md - brainchildservices/curriculum GitHub Wiki
-
what is devtools ?
Web development tools (often called devtools) allow web developers to test and debug their code.
Web development tools allow developers to work with a variety of web technologies, including HTML, CSS, the DOM, JavaScript, and other components that are handled by the web browser.DevTools let you solve problems on a website via its error console and other debugging and monitoring tools.
-
How to Access devtools?
- by clicking F12
- ctrl+ shift + I
- right-click on the web page and click on the Inspect option.
-
How using for Website Diagnosis ?
- DevTools offer several ways to tweak and troubleshoot a webpage.
- See How Your Website Looks on a Smartphone
- Access the Source Files of a Webpage
-
How Perform Live Edits to a Webpage ?
Once you switch to the developer tools, you can edit a website's HTML content by clicking on the Elements option. Then, right-click on any point you want to apply changes to within the code editor and select Edit as HTML.
-
How Debug JavaScript Code with the DevTools Console ?
By default, the console reports any JavaScript issues on your website. You can find the console at the lower part of the DevTools or access it by clicking on the Console option at the top of the Chrome DevTools window.
-
How to Audit Your Website with DevTools Console ?
- Chrome DevTools has a feature that lets you check the overall performance of your website based on specific parameters.
- To access that feature, select the Lighthouse option at the top of the DevTools window.