nl.hideout-lastation.com
Paradijs Voor Ontwerpers En Ontwikkelaars


Een kijkje in: The Kit Language

Laten we zeggen dat je prototypes aan het bouwen bent voor een website met HTML- bestanden. Je hebt ongeveer 10 HTML-pagina's of zo, en deze pagina's delen enkele veelgebruikte componenten zoals Header, Sidebar en Footer.

Nu komt hier het probleem: als u een verandering aanbrengt in deze gedeelde componenten, kunt u ze uiteindelijk ook in de andere bestanden wijzigen . Het is contraproductief en een grote verspilling van tijd.

Om dit te voorkomen, kun je template-engines uitproberen. Er zijn een aantal sjablonerende engines, elk met zijn onderscheidende kenmerken. In deze post gaan we je begeleiden naar een die we als de eenvoudigste en toch nog steeds krachtigste hebben gevonden: Kit .

Wat is Kit?

Kit is een eigen taal van Codekit die variabele en bestandsimportmogelijkheden naar HTML brengt. Het is geschreven met de extensie .kit . Met Codekit kan het vervolgens worden gecompileerd in een HTML-bestand na het opslaan van een bestand.

Variabelen

Kitvariabelen worden niet in steen gezet; ze kunnen worden gedefinieerd met de $ of @ notatie. Dus als u Kit samen met LESS gebruikt, kunt u uw variabelen een naam geven met de @ -notatie om de LESS-conventie te volgen. Op dezelfde manier kunt u de $ voor Sass gebruiken. De waarden kunnen worden toegewezen met dubbele punt, gelijkteken of spatie. Hieronder zijn enkele voorbeelden:

Het is echter vermeldenswaard dat u slechts één variabele per opmerking mag instellen, dus het volgende voorbeeld zal niet werken als een variabele.

Importeren

Met de taal Kit kunt u elk type bestand importeren, inclusief .html, .txt, .kit en zelfs .php . Om bestanden te importeren, kunt u @import of @include .

Bovendien kunt u, in tegenstelling tot het definiëren van variabelen, meerdere bestanden op één regel importeren, zoals:

Na het opslaan haalt Codekit de inhoud in deze bestanden en voegt ze toe aan het bestand.

Kit gebruiken

Dus we hebben gezien wat Kit te bieden heeft. Ze zijn misschien niet veel, maar ze zijn zeker krachtig genoeg om het leven gemakkelijker te maken bij het verwerken van een heleboel HTML-bestanden.

In een praktisch scenario kunnen we ons document opsplitsen in verschillende bestanden, bijvoorbeeld: header.kit, sidebar.kit, footer.kit, head.kit, opening.kit en closing.kit . We zullen deze bestanden in onze pagina's importeren, zodat wanneer we een wijziging aanbrengen, deze op alle pagina's van toepassing is.

Openen en sluiten van documenten

Ik weet zeker dat de bestandsnamen vrij duidelijk zijn voor wat de bestanden bevatten, behalve (misschien) de opening.kit en de closing.kit .

In ons onderstaande voorbeeld bevat het bestand openings.kit het Doctype, de HTML-openingstag en de openingstags-tag. In dit bestand importeren we ook de head.kit die alles bevat dat is ingepakt in de element, en kan ook verschillende globale variabelen definiëren die door alle bestanden kunnen worden geërfd, zoals:

 <! - @page_name -> - Hongkiat.com 

Merk op dat ik ook twee variabelen heb toegevoegd: @body_class in de body-tag en @page_name in de title-tag. Met deze variabelen kunnen we verschillende klassen en paginanamen over de pagina's instellen. Als we twee pagina's met de naam index.kit en about.kit, kunnen we in elk van deze bestanden de waarden van die twee variabelen als volgt instellen:

index.kit

about.kit

Wanneer we de bestanden hebben opgeslagen, vervangt Codekit de variabelen die we in de body tag en de title met die waarden hebben geplaatst. Een ding om op te merken is echter dat de variabelen moeten komen vóór de opname van opening.kit, anders worden ze niet opgehaald.

Conclusie

Zoals eerder vermeld, kan Kit de eenvoudigste sjabloontaal zijn die beschikbaar is. Het maakt alleen gebruik van de HTML-commentaartag en biedt een grote flexibiliteit bij het definiëren van variabelen en het importeren van bestanden.

Het kunnen gebruiken van variabelen en het importeren van bestanden in HTML betekent dat we onze productiviteit kunnen verhogen, omdat we onze codes niet meer meerdere keren in meerdere bestanden hoeven te wijzigen, wat erg tijdrovend is. Bovendien kunnen we ons project modulair en dus beter beheersbaar maken.

5 CCleaner Tips en hoe het efficiënt te gebruiken

5 CCleaner Tips en hoe het efficiënt te gebruiken

CCleaner wordt beschouwd als een van de beste pc-reinigingshulpprogramma's die meerdere reinigingsgereedschappen in één interface biedt om ervoor te zorgen dat uw pc schoon en junkvrij is. Als je CCleaner wilt gebruiken maar niet weet hoe, dan kan ik je helpen er het maximale uit te halen.In dit bericht laat ik je enkele handige CCleaner-trucs zien die je helpen om het productief te gebruiken.

(Technische en ontwerptips)

Nieuwjaarsviering: 15 adembenemende vuurwerkfoto's

Nieuwjaarsviering: 15 adembenemende vuurwerkfoto's

Eerst komt Kerstmis, daarna komt het nieuwe jaar. De tijd vliegt voorbij en nu zijn we nog maar een paar dagen om 2012 te verwelkomen. De Maya-profetie heeft misschien voorspeld dat het einde van de wereld binnenkort zou plaatsvinden, maar dat weerhoudt ons er niet van om deze kans te nemen om de tijd van vernieuwing te vieren

(Technische en ontwerptips)