søndag 4. september 2011 Diverse prosjekter Ruby Mist Webutvikling
Denne blogposten presenterer den nye websiden jeg har laget for programmeringsspråket Mist, samt de rundt 20 linjene Ruby-kode som skulle til for å generere siden.
Ethvert programmeringsspråk trenger en egen side – i alle fall om andre enn designeren selv skal bruke det. Og nå har jeg som sagt begynt på en side for Mist. Den har ikke så mye innhold enda, men design og struktur er på plass. Her er et screenshot (klikk for å gå til siden):
Siden skiller seg bort fra ting jeg har gjort tidligere på flere punkter. Blant annet har jeg innsett at HTML ikke er XML, og har nå gått for mere pragmatisk HTML5, hvor jeg blant annet har droppet ting som HTML, HEAD og BODY-tags (de skal faktisk være helt unødvendige). Jeg har også brukt mye absolutt posisjonering, og til og med litt fixed. Jeg har satset på rent design og ren markup, og er ikke nervør om noen skulle velge å titte på koden.
Jeg har også oppdaget Google Web Fonts, som lar meg inkludere et hav av ulike skrifttyper på sidene uten store problemer. Eneste faren er at jeg kanskje går litt for langt, sånn som man ofte gjør når man får et nytt leketøy. Synes du jeg har gjort det?
Mist-siten er hostet som Github Pages, tilknyttet Github repositorien. Sider som serves på denne måten må være statiske html-sider. Jeg ville derimot basere siten min på en template, så for å ikke måtte repetere meg selv måtte jeg generere sidene før jeg lastet dem opp.
For dette formålet støtter Github Pages et verktøy som heter Jekyll, som jeg har brukt tidligere, og som lar deg generere statiske websider basert på maler. Denne gangen valgte jeg likevel å lage mitt eget opplegg basert på kun noen få linjer Ruby.
Først lagde jeg en fil som jeg kalte genlib.rb. Den inneholder to funksjoner: Den første leser malen som er lagret i filen template.html, og returnerer den som en streng. Den andre – generate - tar inn en hash med parametre, henter ut malen, fletter inn det som er sidespesifikt i malen, og lagrer resultatet som en html-fil.
10 def template 11 template = '' 12 File.open('template.html', "r") do |file| 13 while (line = file.gets) 14 template += line 15 end 16 end 17 return template 18 end 19 20 def generate args 21 name = args[:file] + ".html" 22 File.open(name, "w") do |file| 23 file.puts template. 24 gsub(/\{CONTENT\}/, args[:content]). 25 gsub(/\{QUOTE\}/, args[:quote]). 26 gsub(/\{TITLE\}/, args[:title]) 27 end 28 puts "Generated file #{name}" 29 end
For hver siden jeg skal generere lager jeg så en ny fil som skal kalle generate-funksjonen. Nedenfor er gen_download.rb, som genererer download.html. Den definerer ønsket filnavn (linje 13), sidetittel (14), et sitat som skal brukes i toppen av siden (16-23) og selve innholdet på siden (25-33). Til slutt kaller den generate, og siden blir produsert.
10 require "./genlib" 11 12 page = {} 13 page[:file] = "download" 14 page[:title] = "Download Mist" 15 16 page[:quote] = <<EOF 17 <p class="quote"> 18 "Language designers are not intellectuals.<br/> 19 They're not as interested in thinking as you might hope.<br/> 20 They just want to get a language done and start using it."<br/> 21 - Dave Moon 22 </p> 23 EOF 24 25 page[:content] = <<EOF 26 27 <h1>Download Mist</h1> 28 <p> 29 No downloads here yet! Get the source from 30 <a href="https://github.com/tormaroe/mist">Github</a> 31 if you're interested. 32 </p> 33 EOF 34 35 generate page
Til slutt laget jeg en fil jeg kalte gen.rb. Den henter ut og kjører alle filer som har et navn som begynner på "gen_". Ved å kjøre gen.rb vil jeg dermed få generert opp alle de statiske sidene mine, klare for opplasting til serveren.
1 if __FILE__ == $0 2 Dir.foreach(".") {|f| f.match(/gen_/) { load f } } 3 end
Alternativt kunne jeg har brukt Ruby ERB templating (ala klassisk ASP eller PHP), eller kanskje et annet templating system, for å generere filene. Men for mitt formål valgte jeg altså denne gangen en mere basic løsning.
Har du noen bemerkninger til Mist, webdesignet, det kommende innholdet, eller til Ruby-koden min? Nøl ikke med å legge igjen en kommentar!