Transcript
We gaan de developer tools in onze browser openen en een kijkje nemen onder de motorkap van een website. Met de developer tools krijg je allemaal extra functionaliteiten die handig kunnen zijn terwijl je bezig bent met het coderen van je website.
Ik ben nu op de cmd-amsterdam.nl pagina in de browser firefox.
- Je opent de developer tools dooe rechtermuisknop en inspect element te klikken. Of de shortcut cmd option i (ctrl voor windows).
- Je kan bijvoorbeeld de HTML en CSS aanpassen op een pagina. En je design tweaken en dingen uitproberen en experimenteren.
- Nog een handige feature is bijvoorbeeld responsive design (device mode). Daarmee kan je het scherm aanpassen naar andere formaten om te zien hoe de website werkt op je telefoon of bijvoorbeeld tablet.
Daarnaast is het heel handig om te zien waarom code niet werkt. Soms schrijf je een stuk code en zie je geen resultaat in de browser. Je kunt bijvoorbeeld in het CSS tabje zien als er regels doorgekruist zijn. Dat betekend dat ze niet worden toegepast.
De developer tools zijn dus handig om eens te kijken of om op te hebben terwijl je zelf je website aan het coderen bent om eventuele fouten te spotten.