Informatie
Naam: Jan Koudijs
Opdrachtgever: Marnix Bras, Jaap van den Beukel
Thema: Development
Frontend development (FDD)
Frontend development is een vak waarin je het ontwerp en bouwproces van een website leert en hoe je deze op het internet krijgt.
Hiervoor kregen we als eerste uitleg over de designfase. Hoe begin je nou met het designen van een website en welke tools/middelen kan je hiervoor gebruiken?
Als tweede deel kregen we uitleg over hoe je dit design daadwerkelijk kan maken tot een werkende website. Dit gebeurde met de opmaaktaal HTML en CSS.
In het laatste deel kregen we uitleg over hoe je deze website op het internet krijgt en hoe iedereen daarbij kan.
Al deze onderwerpen moesten worden beschreven en weergegeven worden in de website. Hoe je dit implementeerd was aan jou de keuze.
Design van de website
Voor mijn eigen website had ik eerst een beetje rondgesnuffeld over het internet. Hierbij keek naar bekende websites zoals Bol.com, Coolblue, CHE, Gopro etc. Hierbij keek ik hoe elke website gemaakt was. Op basis hiervan kreeg ik een beetje ideeën van wat voor design ik wou voor mijn site. Dit design had ik eerst gemaakt in het zogehete Low Fidelity. Dit is een hele groffe schets van een design. Deze heb ik gemaakt in balsamiq, maar dit kan ook gewoon op papier (zie foto 1 hieronder).
Foto 1 - Mijn Lo-Fi design in Balsamiq
Hierna ging ik verder met maken van een High Fidelity van het design. Dit is geen groffe schets meer, maar juist een gedetailleerd design van de website. Deze maakte we in figma (zie de video hieronder)
Maken van de website
Na het maken van het design ging ik aan de slag met het implementeren van dit design door middel van de opmaaktalen HTML en CSS. Met HTML maak je de basis van de website zoals de tekst, afbeeldingen en linkjes en met CSS maak je deze mooi, zoals de achtergrondkleur, wat de lettertype en grote van een bepaald stuk tekst is en hoe groot een afbeelding is.
Online zetten van de website
Als laatste moest de website online gezet worden. Dit deden met Cloudberry. Deze moesten we verbinden met de server van het CHE. De CHE had een mapje voor ons persoonlijk aangemaakt en hier konden we onze bestanden inzetten. Deze server was verbonden met een bepaald IP-adres. Met dit IP en je naam erachter kon je je eigen website opzoeken.