Fork deze leertaak en ga aan de slag. Onderstaande outline ga je gedurende deze taak in jouw eigen GitHub omgeving uitwerken. De instructie vind je in: docs/INSTRUCTIONS.md
TRIBE4LIFE PROFILECARD
Inhoudsopgave
Beschrijving
Mijn visitekaartje laat zien wie ik ben, wat ik leuk vind en wat ik niet leuk vind. Er staat een korte biografie met daarin belangrijke informatie zoals woonplaats en leeftijd. Voor dit visitekaartje wou ik een eclactisch design toepassen, hierdoor kon ik mijzelf uitdagen met grid, matrix3d() en animaties in het kaartje. Als inspiratie had ik tijdschriften uit Azië gebruikt waarin vintage en cyberpunk terugkwam wat ik heb gecombineerd met mijn eigen stijl.
Kenmerken
Voor dit visitekaartje gebruik ik het framework Sveltekit en haal ik data op uit Directus.
De HTML is opgedeeld in <section> met daarin een <h>'s, <p>'s en <div>'s. Met CSS keyframes en matrix3d / matrix heb ik verschillende animaties gemaakt. Ik ben mobile first begonnen, en het kaartje is responsive tot aan het kleinste scherm van 350px.
Installatie
Volg onderstaande stappen om zelf aan deze code te werken:
- Installeer NodeJs;
- Fork/clone deze repository;
- Open het in een code editor;
- Ga naar de directory 'my-app' door in de terminal cd my-app te typen;
- Run de command npm install;
- Run de command npm run dev;
- Klik op de localhost link en begin met coden.
Gebruik
Om deze pagina livelink te bekijken kan je klikken op de livelink in de About sectie van deze repository.
Op dit visitekaartje kan je lezen wie ik ben en waar ik vandaan kom, en kan je klikken op verschillende links om te naar mijn Github, Codepen of Instagram te gaan.
Bronnen
- https://kit.svelte.dev
- https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_getting_started
- https://docs.directus.io/blog/getting-started-directus-sveltekit.html
Licentie
This project is licensed under the terms of the MIT license.