WEEK 1 - INFORMATICA

• Informatica
• Middelbare school
• havo
• Leerjaar 4

week 1 les 1

STARTKLAAR

• TELEFOONS WEG IN JOUW ZAKKIE, RECHTS OP TAFEL
  
• JAS UIT, OVER DE STOEL EN OP JOUW PLEK ZITTEN
  
• INDIEN VAN TOEPASSING OP JOUW PLEK ZITTEN
  
• JOUW SCHOOLSPULLEN KLAAR OP TAFEL
  
• CHROMBOOK, LAPTOP NOG GESLOTEN
  
• SCHOOLMAP OPEN + SCHRIJFWAREN KLAAR

Deze periode

Werken aan het project

- Scrum

- HTML & CSS

- Programmeren

- Version Control System

Voorkennis activeren

Waar gebruiken wij een version control systeem

Wat is het verschil tussen Fork en Clone?

git status, wat doet deze commando en noem een paar andere commando's?

Wat is het verschil tussen remote en lokal repository?

hoe zit de basisstructuur van HTML eruit?

Waarom hebben css nodig als wij een website maken?

Benoem het proces van scrum

LEERDOELEN

• De leerling kan HTML en Externe CSS framework gebruiken om zijn schermontwerp om te zetten in  code

Laravel

Is een php framework (een soort gereedschapkist)

Is om snel applicatie mee te bouwen

Is al nagedacht over de veiligheid

Maakt gebruikt van MVC 

en nog veel meer ...

MVC design pattern

Staat voor Model View Controller

Onderscheid in verantwoordelijkheden

Beter onderhoud van code

route (web.php)

Als jij een URL intypt en op enter drukt dan gaat de routing kijken welke controller, model en view nodig zijn om aan jouw verzoek te voldoen

URL

Welke mappen en bestanden

Controller

Models

web.php

[naam].blade.php

.env

Voor vandaag voornamelijk in de map resources->view

Wat was blade ook alweer

Blade is een template engine

hij genereert html met laravel code een scherm voor de gebruiker

Verder met jouw blade

 In prinicle kan je de kennis  van vorig jaar gebruiken, maar mocht het nodig zijn om te oefenen dan ka je dit via w3schools doen.

Samenvatting

Klasikaal invullen met leerlingen

week 1 les 2

STARTKLAAR!

Tellie in zakkie

Startklaar zitten.

Voorkennis activeren

Wat is bootstrap css?

LEERDOELEN

• De leerling is bekend met het algemene layout concept  van bootstrap framework en weet welke zaken/componenten meespelen in het definieren van een layout met bootstrap framework
• De leerling is bekend met de breakpoints van bootstrap en haar dimensions en weet welke breakpoint voor welke device bedoeld is
• De leerling is bekend met het component container van bootstrap en kan dit toepassen
• De leerling is bekend met grid van bootstrap en kan dit toepassen a.d.h.v. zijn eerder gemaakte ontwerp

Layout Bootstrap

Een aantal zaken en componenten die helpen bij het maken van een layout

Breakpoints 

bij welke moment van schermgrote moet de layout wijzingen

Container  & Container-fluid

Gebruik van volledig scherm of niet volledig scherm (een kleine deel van beide zijkanten worden niet gebruikt voor layout )

Grid

De indeling van jouw layout in rij en colom 

Bootstrap Breakpoint

Wordt gebruikt om een scherm te ontwikelen voor verschillende devices. 

Bootstrap Breakpoint

Bootstrap container

Je begint altijd met het maken van een container in jouw HMTL

In de container ga je verder met jouw ontwerp 

Bootstrap container

Bootstrap Grid (row en Column)

Bootstrap Grid (row en Column)

Bootstrap Grid (row en Column)