Foundation (raamistik)

Foundation on avatud lähtekoodiga raamistik, mis aitab kujundada veebilehti ja rakendusi. See sisaldab HTML-i ja CSS-i komponente kasutajaliidesele: malle, koodilõike, vorme, nuppe, navigatsiooni ja teisi liidese osasid ning lisaks JavaScripti laiendeid. Foundationit haldab ZURB. Foundationit on disainitud nii veebilehtede kui ka seadmete jaoks. Raamistik on ehitatud Sassiga/SCSSiga, mis annavad disaineritele parima kogemuse kiireks arenduseks.

Ajalugu

• 2008 – loodi ZURBi stiilijuhend. See koosneb HTMList, CSSist ja JavaScriptist, mille eesmärk on töö kiiremaks ja mugavamaks muutmine. Sellega pandi Foundationile alus.
• 2010 – loodud ZURBi stiilijuhend arenes ning selle nimeks saigi Foundation. Seda hakati kasutama kõikides ZURBi rakendustes ja veebilehtedel.
• 2011 – avalikustati avatud lähtekoodiga Foundation 2.0, millest sai esimene eesraamistik (ingl front-end framework).
• 2012 – avalikustati Foundation 3.0. See versioon kasutab Sassi ning see on esimene raamistik, mis kasutab miksereid (ingl mixin).
• 2013 – sel aastal tuli välja kolm Foundationi versiooni. Versioon 4, mis läks ka mobiilipõhiseks, tuli visuaalse uuendusega ja paljude uute komponentidega. Foundation 5 puhul oli põhirõhk kiirusel. See versioon muutis arendamise kiiremaks kui kunagi varem. Lisatud komponentidest on tuntumad Equalizer, Off-canvas ja Icon-bar. Novembri lõpus avaldati e-kirja raamistik Ink, millega saab disainida ilusaid e-kirju.
• 2014 – Foundationiga on võimalik luua veebirakendusi. Foundationist sai ZURBi Playgroundi osa.
• 2015 – Foundationi kõik funktsioonid said valmis. Sellega on võimalik arendada veebilehti, rakendusi ja e-kirju.

Struktuur ja funktsioon

Grid-süsteem ja paindlik disain – Foundation on standardselt 940 pikslit laia ja paindliku paigutusega. Samas on raamistik võimeline töötama vastavalt resolutsioonidele ning erinevatele seadmetele (mobiiltelefonides, portree ja maastiku formaadis, tahvelarvutites ja laiekraanidel). Vastavalt seadmele, muutuvad tulpade laiused automaatselt.

CSS-laadileht – Foundation pakub hulga stiililehti, mille abil saab lihtsalt luua HTMLi komponente.

Korduvkasutatavad komponendid – Foundation kasutab tuntud kasutajaliideste elemente. Näiteks erinevad nupud, sildid, tabelid, sõnumid.

JavaScripti komponendid – Foundationi JavaScripti osa on tihedalt seotud JQueryga ning neid kasutatakse koos. Sellega saavutatakse kasutajaliidese osas veelgi efektsemad tulemused. Foundation kasutab näiteks JQuery vorme, küpsiseid, teateid, erinevaid menüüstiile, sektsioone, tööribasid ja palju muud.

Installimine

Foundationi installimiseks on mitu viisi.

• Paketihalduritega – Foundation on saadaval pakettides npm, Bower, Meteor ja Composer. Paketid sisaldavad kõiki vajalikke Sassi ja JavaScripti lähtefaile ning ka kompileeritud CSSi ja JavaScripti.
• Foundationi käsurea abil – käsurida ennast saab installida paketihaldurite kaudu.
• CDN lingina – Foundationi CSSi ja JavaScripti osa saab koodi lisada ka lihtsalt CDNi lingina.
• Llähtefailide käsitsi allalaadimine

Foundationi installimisega saadakse kaasa:

  ├─ scss       Sassi lähtefailid 
  ├─ js         JavaScripti lähtefailid
  └─ dist       Kompileeritud failid:
     ├─ css        * ühendatud CSS-failid (minimeeritud ja mitteminimeeritud)
     ├─ js         * ühendatud JavaScripti failid (minimeeritud ja mitteminimeeritud)
     └─ plugins    * JavaScripti pluginad

Välislingid

• Foundationi koduleht
• Sass
• Mixin
• npm
• CDN