En titt inn i: Kitsspråket

La oss si at du var å bygge prototyper for et nettsted med HTML- filer. Du har omtrent 10 HTML-sider eller så, og disse sidene deler noen vanlige komponenter som Header, Sidebar og Footer.

Nå kommer problemet: Hvis du gjør en endring i disse delte komponentene, kan du ende opp med å endre dem i de andre filene også. Det er kontraproduktivt og stort spild av tid.

For å unngå dette kan du prøve ut templerende motorer . Det finnes en rekke templerende motorer der ute, hver med sine særegne egenskaper. I dette innlegget skal vi gå deg gjennom en som vi har funnet å være den enkleste men likevel kraftige: Kit .

Hva er Kit?

Kit er et proprietært språk av Codekit som bringer variabel og fil import evne til HTML. Den er skrevet med en .kit . Ved hjelp av Codekit kan den deretter kompileres til en HTML-fil ved en filsparing.

variabler

Kitvariabler er ikke satt i stein; de kan defineres med $ eller @ notasjonen. Så, hvis du bruker Kit sammen med MINDRE, kan du navngi variablene dine med @ notasjonen for å følge MINDRE konvensjonen. På samme måte kan du bruke $ for Sass. Verdiene kan tilordnes med kolon, like tegn eller mellomrom. Nedenfor er noen eksempler:

Det er imidlertid verdt å merke seg at du kanskje bare angir en variabel per kommentar, slik at følgende eksempel ikke fungerer som en variabel.

Import

Med Kit-språket kan du importere alle typer filer, inkludert .html, .txt, .kit og til og med .php . For å importere filer kan du bruke @import eller @include .

Videre, i motsetning til å definere variabler, kan du importere flere filer i én linje, slik som:

Ved lagring vil Codekit gripe innholdet i disse filene og legge dem til filen.

Bruke Kit

Så vi har sett hva Kit har å tilby. De kan ikke være mye, men de er absolutt kraftige nok til å gjøre livet enklere når man håndterer en haug med HTML-filer.

I et praktisk scenario kan vi bryte dokumentet ned i flere filer, for eksempel: header.kit, sidebar.kit, footer.kit, head.kit, opening.kit og closing.kit . Vi vil importere disse filene til våre sider, slik at når vi gjør en endring, gjelder den på alle sidene.

Dokument åpning og avslutting

Jeg er sikker på at filnavnene er ganske selvforklarende hva filene bærer, med unntak av (kanskje) opening.kit og closing.kit .

I vårt eksempel nedenfor inneholder filen open.kit Doctype, HTML-åpningstaggen og åpningslegemet. I denne filen importerer vi også head.kit som inneholder alt som er pakket inn i element, og kan også definere flere globale variabler som kan arves gjennom alle filene, slik som:

Merk at jeg også har lagt til to variabler: @body_class i @page_name og @page_name i titteltaggen. Disse variablene vil tillate oss å angi forskjellige klasser og sidenavn på tvers av sidene. Hvis vi har to sider kalt index.kit og about.kit, kan vi i hver av disse filene sette verdiene for disse to variablene slik:

index.kit

about.kit

Når vi har lagret filene, erstatter Codekit de variablene vi har lagt inn i kroppsmerket og title med disse verdiene. En ting å merke seg er at variablene må komme før inkludering av opening.kit, ellers vil de ikke bli plukket opp.

Konklusjon

Som tidligere nevnt, kan Kit være det enkleste templerende språket som er tilgjengelig. Den bruker bare HTML-kommentarkoden, og gir stor fleksibilitet når det gjelder å definere variabler og importere filer.

Å kunne bruke variabler og importere filer i HTML betyr at vi kan øke vår produktivitet, da vi ikke lenger må endre koder flere ganger i flere filer, noe som er svært tidkrevende. I tillegg tillater det oss også å gjøre prosjektet modulært, og dermed mer overkommelig.

Slik tilpasser du Visual Studio Code

Visual Studio Code, Microsofts nye åpen kildekoden editor gir utviklere mange fantastiske funksjoner som betydelig letter prosessen med kildekoden redigering . Dessuten sørger Visual Studio-koden for at brukerne ikke kjeder seg når de jobber med det, slik at de kan tilpasse flere deler av utseendet, for eksempel farger, fonter, mellomrom og tekstformatering, akkurat som mange funksjoner, slik som som linting og validaton regler .I

(Tekniske og design tips)

Google Kontorer rundt om i verden [Bilder]

Før teknologiske giganter begynner å tilby øyenbrynevinster (som å betale kostnadene for kvinnelige ansatte å fryse eggene sine), var det en stor glede å jobbe på steder som Google, lønnen, fasilitetene og deres fantastiske kontorer. Å være en stor del av nettet i 16 år har Google samlet et rykte for at kontorer er den ideelle arbeidsplassen.Arbeidsgiv

(Tekniske og design tips)