Inleiding
Het is indrukwekkend wat je vandaag op internet kunt doen. U kunt webervaringen bouwen die op alle apparaten worden uitgevoerd, allerlei soorten media-inhoud bevatten en ingewikkelde berekeningen uitvoeren. U kunt zelfs apps maken die eruitzien als systeemeigen toepassingen.
Als u geïnteresseerd bent in het starten van webontwikkeling vandaag, hebt u mogelijk te maken met een duizelig scala aan opties. In deze module leert u de basisonderdelen van een website en enkele hulpprogramma's die u kunt gebruiken om webontwikkeling te starten. U gebruikt SAMEN HTML, CSS en JavaScript om een website te bouwen en vervolgens ontwikkelhulpprogramma's in de browser te gebruiken om te begrijpen wat er gebeurt.
Met deze fundamentele kennis beschikt u over een betere context om in de toekomst beslissingen te nemen bij het bouwen van websites; Of u nu bijvoorbeeld JavaScript-frameworks moet kiezen of uw eigen JavaScript-functies moet maken om uw website te bouwen.
Laten we beginnen door te kijken waar we naartoe willen.
Scenario
Stel dat u een webontwikkelaar bent en u bent gevraagd om de website van uw bedrijf aan te roepen tot een breder scala aan klanten. Om uw klanten in staat te stellen hun ervaring op uw website aan te passen, besluit u ondersteuning toe te voegen voor lichte en donkere thema's. U maakt een kleine, proof-of-concept-website om ondersteuning voor thema's te demonstreren met css en u schrijft een JavaScript-functie om tussen deze thema's te schakelen.
Wanneer u klaar bent, ziet uw website er als volgt uit wanneer het donkere thema is geselecteerd:
Wat staat er op een webpagina?
De inhoud, stijl en interactieve logica worden respectievelijk onderverdeeld in HTML-, CSS- en JavaScript-bestanden. Een ontwerpprincipe in moderne programmering is scheiding van zorgen. Onder de vele redenen om zorgen te scheiden, zijn twee eenvoud en hergebruik. Door html-elementen bijvoorbeeld te stylen met CSS, kunt u uw HTML-code vereenvoudigen. In plaats van het uiterlijk binnen elk element te coderen, past u CSS-stijlen toe op alle elementen op een pagina, ongeacht de complexiteit van de pagina. Daarnaast kunt u meerdere HTML-pagina's koppelen aan één CSS-bestand, waardoor u een consistent uiterlijk op uw hele website kunt vereenvoudigen.