Blåfisken kode editor er et program, der bruges til at udvikle websider og scripts. Det er ikke en WYSIWYG-editor. Bluefish er et værktøj, der bruges til at redigere den kode, som en webside eller script oprettes fra. Det er beregnet til programmører, der har viden om at skrive HTML og CSS kode og har tilstande til at arbejde med de mest almindelige script-sprog som PHP og Javascript, såvel som mange andre. Hovedformålet med Bluefish-editoren er at gøre kodningen lettere og reducere fejl. Bluefish er gratis og open source software og versioner er tilgængelige til Windows, Mac OSX, Linux og forskellige andre Unix-lignende platforme. Den version, jeg bruger i denne vejledning, er Bluefish på Windows 7.
01
af 04
Bluefish-grænsefladen
Skærmbillede med tilladelse til Jon Morin
Bluefish-grænsefladen er opdelt i flere sektioner. Den største sektion er redigeringsruden, og det er her, du kan redigere din kode direkte. På venstre side af redigeringsruden er sidepanelet, der udfører de samme funktioner som en filhåndtering, så du kan vælge de filer, du vil arbejde på, og omdøbe eller slette filer.
Overskriftssektionen øverst i Bluefish-vinduerne indeholder flere værktøjslinjer, som kan vises eller skjules via menuen Vis.
Værktøjslinjerne er hovedværktøjslinjen, som indeholder knapper til at udføre almindelige funktioner som gem, kopi og indsæt, søg og erstat og nogle indstillinger for kodeindrykning. Du vil bemærke, at der ikke er nogen formateringsknapper såsom fed eller understregning.
Det skyldes, at Bluefish ikke formaterer kode, det er kun en editor. Under hovedværktøjslinjen er HTML værktøjslinje og menuen uddrag. Disse menuer indeholder knapper og undermenuer, som du kan bruge til automatisk at indsætte kode til de fleste sprogelementer og funktioner.
02
af 04
Brug af HTML-værktøjslinjen i Bluefish
Skærmbillede med tilladelse til Jon Morin
HTML-værktøjslinjen i Bluefish er arrangeret af faner, der adskiller værktøjerne efter kategori. Fanerne er:
- Hurtig bar - du kan fastgøre andre værktøjer til denne fane for emner, du bruger ofte.
- HTML 5 - giver dig adgang til almindelige tags og elementer i HTML 5.
- Standard - fælles HTML-formateringsmuligheder fås på denne fane.
- Formatering - mindre almindelige formateringsmuligheder findes her.
- Tabeller - forskellige tabelgenererende funktioner, herunder en tabelguide.
- Liste - værktøjer til generering af ordnede, ikke-ordnede lister og definitionslister.
- CSS - stilark kan oprettes fra denne fane såvel som layoutkode.
- Formularer - mest almindelige formelementer kan indsættes fra denne fane.
- Skrifttyper - denne fane har genveje til at arbejde med skrifttyper i HTML og CSS.
- Rammer - de mest almindelige funktioner til at arbejde med formularer.
Ved at klikke på hver fane vises knapper, der vedrører den relevante kategori, i værktøjslinjen under fanerne.
03
af 04
Brug af Snippets Menu i Bluefish
Skærmbillede med tilladelse til Jon Morin
Under HTML-værktøjslinjen er der en menu kaldet uddragslinjen. Denne menulinje har undermenuer, der vedrører en række programmeringssprog. Hvert element i menuen indsætter almindeligt anvendt kode, f.eks. HTML-doktyper og metainformation.
Nogle af menupunkterne er fleksible og genererer kode afhængigt af det mærke, du ønsker at bruge. Hvis du f.eks. Vil føje en forformateret tekstblok til en webside, kan du klikke på HTML-menuen i uddragslinjen og vælge menupunktet "et parret tag".
Hvis du klikker på dette punkt, åbnes en dialog, der beder dig om at indtaste det tag, du vil bruge. Du kan indtaste "pre" (uden vinkelparenteserne), og Bluefish indsætter en åbnings- og luknings "pre" -kode i dokumentet:
.
04
af 04
Andre funktioner i Bluefish
Skærmbillede med tilladelse til Jon Morin
Mens Bluefish ikke er en WYSIWYG editor, det har evnen til at lade dig forhåndsvise din kode i enhver browser, du har installeret på din computer. Det understøtter også automatisk færdiggørelse af kode, fremhævning af syntaks, fejlfindingsværktøjer, et script-outputfelt, plugins og skabeloner, der kan give dig et spring igang med at oprette dokumenter, som du ofte arbejder med.