Bruke Kit Language i Windows og Linux

I forrige innlegg har vi diskutert om Kit, et veldig enkelt HTML-templerende språk. Hvis du hadde fulgt dette, bør du oppdage at GUI-programmet som er i stand til å kompilere Kit i nettleser-kompatibelt HTML-format, er Codekit.

Dessverre er Codekit bare tilgjengelig for OS X, det er for øyeblikket ikke noe lignende program for Windows og Linux som støtter Kit.

Hvis du jobber i Windows og Linux, vil du likevel bruke Kit, du kan bruke Grunt som et alternativ. Grunt har en massiv samling av plugins, bidratt av sjenerøse utviklere over hele verden - dette inkluderer plugin for å kompilere Kit-språk, grunt-codekit. La oss sjekke det ut.

Merk: Selv om følgende tips primært er ment å vise Windows og Linux-brukere et alternativ til Codekit, kan OS X-brukeren også bruke den.

Starter

Først vil vi opprette en katalog for vårt prosjekt. La oss starte Terminal eller Command Prompt, og skriv følgende kommandolinjer:

 mkdir kit-grunt cd-kit-grunt 

Vi har opprettet en ny katalog kalt kit-grunt ; Den andre linjen lar oss skrive det inn. Men hvis du tidligere har opprettet en prosjektkatalog, kan du hoppe over den første linjen, og umiddelbart navigere til din egen katalog i Terminal med cd kommandoen.

Innen prosjektkatalogen lager vi en ny mappe med navnet kit hvor vi vil sette .kit filene. Skriv inn denne kommandoen nedenfor:

 mkdir kit 

Vi installerer så både Grunt og plugin, med disse kommandoene. Merk at du må installere Node.js i systemet ditt først.

 npm installere grunt - save-dev npm installere grunt-codekit --save-dev 

Når prosessen er fullført, finner du en ny mappe, node_modules, som inneholder modulene vi har installert.

konfigurasjon

Opprett en ny fil med navnet Gruntfile.js i prosjektkatalogen, og legg inn følgende kode. Denne koden er en Grunt Wrapper der vi skal registrere, konfigurere og utføre Grunt-oppgave. Hvis du bruker Sublime Text, kan du enkelt sette inn denne koden ved hjelp av Grunt Snippets.

 module.exports = funksjon (grunt) {grunt.initConfig ({}); } 

Da definerer vi codekit innen grunt.initConfig, slik som.

 module.exports = funksjon (grunt) {grunt.initConfig ({codekit: {your_target: {files: {'index.html': 'kit / index.kit', }}, }, }); } 

Denne konfigurasjonen vil kompilere index.kit i index.html. For å prøve dette, kan vi legge til dette i index.kit.

... og kjør grunt codekit i Terminal.

Indeksen.html er generert, og som du kan se nedenfor, blir variabelenes verdi også vellykket brukt i avsnittetiketten.

File Inclusion

Som vi har nevnt i vårt forrige innlegg, kan vi inkludere / importere filer til en Kit-fil. Gitt at vi har header.kit, sidebar.kit og footer.kit (jeg antar at vi har lagt til tilsvarende innhold i disse filene), kan vi inkludere dem i index.kit, slik som det.

 Dette er toppteksten 
Dette er innholdet

La oss kjøre grunt codekit kommandoen igjen i Terminal. Og her går vi! Innholdet fra disse filene settes sammen i index.html. Hyggelig!

Konklusjon

Grunt er et godt alternativ til mange webutviklingsverktøy, inkludert kompilering av Kit-fil. Jeg håper dette tipset er nyttig, spesielt for Windows og Linux-brukere som ønsker å få hendene på Kit-språket.

Hvordan håndtere Facebook Game Invites (The Right Way)

Vi trenger å snakke om Facebook-spill . Jeg tror at hvis du er på Facebook, er du enten på laget som spiller spill, eller laget som ikke gjør det. Den tidligere kretser i Facebook for favoriserer fra venner, mens sistnevnte kjører "Ikke inviter meg lenger" opptak på sløyfe.Den dårlige nyheten er at dette skal fortsette så lenge du fortsatt er på Facebook. Den gode

(Tekniske og design tips)

140+ Googles tjenester og verktøy du bør vite (og bokmerke)

Nevn Google-produkter, og du vil trolig tenke på Google Søk, Gmail, Chrome, YouTube eller Android, men det er faktisk mer enn hundre Google-tjenester og verktøy som de fleste av oss ikke er klar over eller vet om. Så vi trodde at dette ville være en flott mulighet til å slå opp tilgjengelige, men mindre kjente Googles tjenester og verktøy. Dette

(Tekniske og design tips)