Monthly Archives: oktober 2010

MySQL workbench tutorial

Als je databases complexer worden raakt het steeds lastiger om het overzicht te behouden op de database structuur. Via een administratietool als PHPmyadmin krijg je wel een goed beeld van de actuele situatie en relaties maar het is erg lastig om “visueel” te maken hoe zaken in elkaar zitten. Zowel voor jezelf als voor eventuele opdrachtgevers met wie je de database-opzet wilt delen. Daarnaast komt er een moment dat het uittypen van alle velden met hun configuraties een erg vervelend werkje wordt.

MySQL workbench is je gereedschapskist
MySQL workbench is een zogenoemd visuele database design pakket en de community versie is beschikbaar onder de GPL licenties voorwaarden.De afgelopen edities is MySQL workbench verder samengebracht met het administrator pakket waardoor je vanuit het programma eigenlijk alles rondom een database(server) kunt configureren.

De werking in het kort
Het programma is in basis niet zo erg complex maar de functionaliteiten zijn redelijk diepgaand. Ik zal hieronder kort uitleggen hoe je zelf je eerste database ontwerpt met het programma.

Als je het programma opstart krijg je onderstaand scherm:

Kies in het midden onder voor “create new EER model” (EER staat voor Enhanced Entity-Relationship). Je krijgt dan onderstaand scherm:

Laten we voor het voorbeeld even uitgaan dat we een database willen maken met auto’s (car) en merken (manufacturer) met dus een relatie waarbij één merk meerdere auto’s maakt. Veel dieper lijkt me niet nodig. We noemen de database ‘test’.

Dubbelklik eerst op “mydb” bovenin je scherm om de naam, en eventueel de collation (werk zelf standaard met utf-8 general), aan te passen.

We hebben nu de basis gelegd. Dubbelklik nu op “add diagram” bovenin. Je krijgt nu onderstaand scherm:

Klik nu links op het “place new table” icoontje (7e van boven). Je krijgt nu een nieuwe tabel in je scherm te zien. Dubbelklik om hem te configureren. Onderin je scherm krijg je nu de tabel opties. Als het goed is zie je nu iets als:

Pas eerst de naam van de tabel aan naar “car” en klik daarna op columns. Voer nu de kolommen in die je belangrijk vind. Voor nu houden we het eenvoudig met een kolom voor het id, de naam en een veld voor de motorbeschrijving. Het ziet er dan ongeveer zo uit:

We doen hetzelfde voor de fabrikanten tabel. Nu komt het leuke stuk. We willen natuurlijk een relatie hebben tussen de twee tabellen. Afhankelijk van de situatie kun je kiezen voor verschillende soorten relaties maar in dit geval voldoet een 1:n relatie. één fabrikant die meerdere auto’s maakt.

Klik links op het 1:n icoontje. Klik op de “car” tabel en dan op de “manufacturer” tabel en je relatie is een feit. Automatisch neemt hij veldeigenschappen als datatype, unsigned etc over van je manufacturer tabel dus alles is in één keer eigenlijk in orde. Als  het goed is heb je nu iets als:

Stel dat je nu ook nog wilt veranderen wat er gebeurd bij een update of delete dan kun je dit doen in het tabje “foreign keys” onderin. Klik op de tabel waar de relatie invloed op heeft (de “car” tabel dus), dan op het tabje “foreign keys”. Je ziet dan:

Standaard staat alles op “no action”. Als je nu wilt dat bijvoorbeeld alle auto’s verwijderd worden als het merk verwijderd wordt dan zet je hem bij delete op “cascade” enzovoorts.

Je schema is nu klaar. Nou ja, klaar niet maar het voorbeeld laat aardig zien hoe je ermee kunt werken. Wat je nu kunt doen is het schema exporteren als SQL create sript zodat je het direct in je MySQL server kunt uitvoeren en alle tabellen voor je gemaakt worden volgens je model. Dit doe je via “file -> export > forward engineer SQL CREATE script”.

Wat nog leuker is, is de mogelijkheid om je model met een live database te synchroniseren. Hiervoor heb je wel toegang nodig tot de database server vanaf je pc!. Mocht je dit hebben dan kun je via “database -> synchronize model” een connectie opgeven (en opslaan voor later) naar je MySQL server. Hij vergelijkt dan de tabellen in je database en die van je model met elkaar en geeft aan waar ze verschillen. Je kunt dan per tabel aangeven of je het model of je database wilt updaten. Hierna voer je de mutaties uit en synchroniseert hij de tabellen. Enkele opmerkingen hierbij;

  • Maak ALTIJD backups van je te synchroniseren database voor je echt iets doet. In het verleden gebeurde het wel eens dat mijn workbench het een goed idee vond de online database te legen en mijn model volledig in de war te gooien.
  • De te synchroniseren database moet dezelfde naam en collation hebben voor een optimale werking van de syncing.
  • Bepaalde zaken lopen soms iets vreemd. Als je bijvoorbeeld een enum aanmaakt met de values (‘appel’, ‘peer’, ‘ei’) en hem synced dan loopt alles goed maar hij zal blijven proberen iedere keer weer dit veld te syncen. Dit omdat MySQL de spaties tussen de values weghaalt en workbench dus vind dat ze niet gelijk zijn. Leermoment: mocht workbench structureel proberen een veld / tabel te synchroniseren wat hetzelfde lijkt, probeer dan te kijken naar spaties, default values die in MySQL al standaard zijn waardoor hij ze “leeg” laat qua value, collations die afwijken etc.

En nu?
Volgens mij dekt dit aardig de basis hoe je in workbench een model kunt ontwerpen en exporteren. Ga je voor visueel plezier (en overzicht bij complexere schema’s) dan kun je de kleur van de tabel in het overzicht aanpassen. Dit doe je door op de tabel te klikken en dan links het tabje “properties” aan te klikken. De bovenste waarde is de kleur van de achtergrond. Dit kun je zowel voor 1 tabel als voor een selectie tegelijk instellen. Daarnaast kun je “regions” invoeren. Dit zijn kaders met een naam en kleur die je om blokken met tabellen heen kunt zetten om zo bijvoorbeeld alles van het authenticatie-systeem in een apart blok te zetten.

Ik zocht even een goed voorbeeld van de regions zoals je ze kunt gebruiken en kwam dit schema tegen van ECartservice.net. Misschien een beetje “heavy” maar het idee is wel duidelijk lijkt me :)

MySQL workbench downloaden
http://dev.mysql.com/downloads/workbench/5.2.html

ps. Als je van een beetje spanning houdt is het zeker een aanrader om zo nu en dan een alpha of beta versie te downloaden. Deze betekenen vaak weer een berg aan nieuwe mogelijkheden, grafische leukheden etc. Natuurlijk met enige voorzichtigheid doen maar ik ben altijd wel blij met deze pre-releases.

Basecamp project management

Basecamp is projectmanagement in een web2.0 saus, gemaakt door 37signals. Basecamp onderscheidt zich met ontzettend heldere interfaces en groot gebruiksgemak.

Waarom Basecamp
Naarmate Webparking en haar projecten groeide kregen we steeds meer behoefte aan een solide basis als het ging om projecten beheren en begeleiden. Zeker als je met meerdere personen (en partijen) aan een project werkt wordt het al snel een rommeltje in de mailboxen. We gebruikten al een mix van een todolist/projecten systeem en wat lokale data in outlook accounts maar dat voldeed gewoon niet.

Als je dan gaat zoeken naar iets goeds dan kom je al snel tot de conclusie dat er ontelbare hoeveelheden pakketten en diensten zijn. Van enterprise (met CRM erin) tot micro (alleen taken) en met een maandelijks betaalmodel tot open source. We hebben er ontzettend veel getest maar nergens kregen we een echte “click” mee. Tot we bij Basecamp terecht kwamen. We waren, met het gehele team (we zijn nooit zo eensgezind) behoorlijk snel verkocht.

Wat maakt Basecamp zo geweldig
Basecamp is een understatement van eenvoud. Geen knopje of functie extra. Hier en daar wat netjes weggewerkte AJAX maar dat is het dan ook. Heel kort samengevat heb je in Basecamp projecten, milestones en todo’s.

In het kort;
Een project kan milestones (titel, datum en verantwoordelijke persoon) bevatten en één of meer todolists. Een todolist bestaat uit minimaal een naam en optioneel nog wat kleine details. Binnen de todolist maak je todo’s aan en klaar. De stappen zien er allemaal zeer simplistisch uit wat het ook gelijk zo prettig maakt in gebruik:

Milestone maken

Todolist maken

Todo item toevoegen


Wat highlights uit Basecamp

  • Het is ook mogelijk te werken met todolist-templates of zelfs complete project-templates zodat je standaard-taken al gelijk hebt bij het aanmaken van een project
  • Binnen een project kun je niet alleen todo’s plaatsen maar ook message’s en files. Als een klant bijvoorbeeld documentatie stuurt kun je die doorsturen naar een uniek Basecamp mailadres wat een bepaald project vertegenwoordigd.
  • Je komt binnen op je Dashboard waar je gelijk ziet in welke projecten je nog todo’s open hebt staan en je krijgt een overzicht met milestones.

Wat Basecamp zo geweldig maakt (naar mijn idee) is de enorme eenvoud. Waar je in sommige programma’s een tiental seconden nodig hebt om een todo te maken gaat dat hier in minder dan een paar seconde. Zeker als je lijsten met todo’s maakt (bijvoorbeeld als je met een klant een project doorneemt) is dit erg prettig. Daarnaast neemt dit ook een enorme drempel weg. Als het namelijk teveel werk wordt is het makkelijker je taak uit te voeren dan hem te noteren maar je wilt hem het liefst genoteerd hebben zodat je later nog terug kunt zien hoe of wat en eventueel nog opvolging eraan kunt geven.

De kosten
Basecamp biedt een aantal “plans” aan van gratis (1 project en geen filesharing) tot max á $149 (ongelimiteerd aantal projecten en 75 GB opslagruimte). Bij gemiddeld gebruik zit je dus rond de $49 á $99 per maand. Wij concludeerden al snel dat we voor dat bedrag zelf geen open-source pakket konden hosten en onderhouden (lees configureren).

Genoeg enthousiast gesproken: bekijk (en test) zelf Basecamp

Legaal fontgebruik op websites (deel 2)

Eerder berichtte ik over Typekit wat de nodige bezoekers naar ons weblog trok en dus blijkbaar een onderwerp is wat erg leeft op dit moment. Nu kwam ik een ontzettend uitgebreide posting tegen op Smashingmagazine.com die wel zo’n ontzettend goede aanvulling vormt op mijn eerdere bericht dat ik die toch even onder de aandacht wilde brengen.

Andrew Follett bespreekt daar namelijk nagenoeg alle bekende oplossingen voor web fonts (waaronder Typekit). Van alle oplossingen geeft hij aan hoeveel fonts er beschikbaar zijn, tegen welke kosten, welke voordelen en nadelen ze precies hebben en hoe ingewikkeld/eenvoudig implementatie is.

Mocht je dus met web fonts aan de slag moeten gaan in een project dan is deze posting zeker even het bezoeken waard.

http://www.smashingmagazine.com/2010/10/20/review-of-popular-web-font-embedding-services/

Eclipse naar Netbeans

Ooit gestart in DreamWeaver om daarna, omdat het cooler en handiger was, door te gaan naar Notepad2.  Tijdens de groei van PHP/HTML scripting naar Zend Framework development groeide echter de behoefte aan betere ondersteuning voor diverse zaken. Zo begonnen we met versie controle en wilden we ook meer overzicht over de verschillende bestanden en projecten. Onze behoefte een goede Integrated Development Enviroment (IDE) te gebruiken werd groter en groter.

Eclipse PDT
De afgelopen jaren werkten we met ons hele team in Eclipse. Een geweldig programma. Solide en prettig in gebruik. Oke, we zullen niet ontkennen dat we zo nu en dan flinke ruzie hadden met subclipse (voor de versiecontrole) maar meestal was dit onze eigen fout. Het had nou eenmaal een gebruiksaanwijzing als het ging om bestanden hernoemen etc. Verder niets dan lof. Iedere keer keken we vol spanning uit naar de nieuwe versie van Eclipse. Wat voor moois zou er toch weer in zitten, zou de interface sexier zijn geworden etc?

Eclipse naar Netbeans
Het leven was zo eenvoudig, iedereen was gelukkig met Eclipse en er was geen behoefte aan een nieuwe IDE. Tot één van onze collega’s Netbeans installeerden op zijn thuisomgeving om mee te werken. Al snel was hij enthousiast genoeg om het op kantoor te durven opnemen tegen de Eclipse-fans. Niet zonder succes. Inmiddels is er nog maar één iemand bij ons op kantoor die Eclipse gebruikt. De rest is over naar Netbeans.

Waarom Netbeans?
Netbeans heeft dezelfde roots als Eclipse dus de overstap voelt niet erg zwaar aan en vanaf dat moment is het al snel genieten van alle leuke dingen die Netbeans wel goed kan / doet (of in iedere geval doet lijken alsof het goed is) zoals;

  • Instant renaming van PHP namen, classes etc
  • Nagenoeg naadloze SVN integratie
  • Frisse stijl qua schermen en icoontjes
  • Prettige bestuurbaarheid van kleurschema’s
  • Slimme code completion en controle (in zowel PHP als o.a. JS, CSS, HTML)
  • Fijne kleurcodering voor gewijzigde code tov. actuele SVN etc

Samenwerken met Eclipse en Netbeans
Dit werkt prachtig samen. Bij projecten waar we met meerdere mensen aan werken merk je er niets van. Beide zit je gewoon te werken in je gewenste editor en alle data wordt via de SVN prima op lijn gehouden zonder problemen.

Het inladen van oude Eclipse projecten (altijd mijn grootste motivatie om niet over te stappen naar een andere editor) ging eigenlijk te eenvoudig. Gewoon “new project” -> “PHP application with existing sources” en dan even paar kleine configuratiezaken en klaar. Alles inclusief de SVN configuratie. Sterker nog; beide omgevingen werken eigenlijk best goed naast elkaar (als je echt gek wilt doen)

Netbeans grootste gemis?
Wij werken redelijk veel met externe tools om bijvoorbeeld Docblocks te genereren, PHPdocumentor aan te sturen en Doctrine models te genereren. Helaas is dit alles niet mogelijk in Netbeans. Vanuit Eclipse kunnen we deze externe tools aansturen met parameters die betrekking hebben op het actuele project zodat hij automatisch de juiste mappen en namen pakt. Zo lang we hiervoor geen oplossing hebben blijft dit een beetje spijtig. (werk nu met een .bat file die wat dingen doet maar is natuurlijk lapwerk)

Heb al wel zitten kijken naar de mogelijkheden om zelf een Plugin te maken voor Netbeans maar gezien de drukte zal dat er nog even niet van komen.

Uptimerobot: Gratis server monitoring

First of all: nu nog gratis. Het is min of meer een beta/test dienst maar het voldoet als je wilt kijken of je hoster zijn best wel doet :)

Uptimerobot is niets meer eigenlijk. Iedere 5 minuten kijkt hij even of je site(s) nog online zijn en zo nee dan gaat hij paniek zaaien per mail, SMS, twitter of via een RSS feed. Soms is eenvoudig genoeg. Omdat wij nooit genoeg zekerheid willen hebben of alles online is heb ik enige tijd geleden onze servers toegevoegd. Het resultaat is eenvoudig maar precies wat je nodig hebt:

ps. Uit veiligheid heb ik de namen van de servers deels onzichtbaar gemaakt maar het idee wijst zichzelf zo wel.

Spritebaker CSS booster

Een eenvoudige online tool om je CSS bestand en alle externe media in één bestand te “bakken” met base64 encoded datasets. In combinatie met gzip-compression zou je website een enorme snelheidsboost krijgen. Het idee is namelijk dat je alle kleine bestandjes die normaal los geladen worden door je browser samenbrengt in één bestand. Dit scheelt al snel tientallen requests. In theorie zijn die losse request namelijk langer bezig met het opvragen van de server, het bestand en het downloaden dan dat je dit samenvoegt. Als met een tool als Firebug de Net explorer pakt zie je snel hoe een request is opgebouwd en dan blijkt inderdaad dat vaak een deel van de tijd bezig is met het leggen van een verbinding met de server.

Nooit kun je iets mooier testen dan met je eigen site. Even snel de Webparking website voorzien van een gebakken-css bestand om te kijken wat de verschillen zijn. Omdat de logica je zegt dat gebakken-css altijd winst is ging ik uit van prachtige resultaten. Helaas… Het viel allemaal iets tegen.

Even wat testcijfers (drie runs per keer);
Normaal  met browser cache uit:
24 server requests (1.22 s, 1.07 s, 1.22 s)

Normaal met browser cache aan:
2 server requests (731 ms, 739 ms, 637 ms)

Gebakken CSS met browser cache uit:
11 server requests (1.4 s, 1.25 s, 1.41 s)

Gebakken CSS met browser cache aan:
2 server requests (998 ms, 892 ms, 913 ms)

Nu is natuurlijk de vraag. Waar zit dit negatieve verschil toch in. Leuk is in iedere geval om te zien dat het aantal requests met 50% afneemt in de gebakken versie. Logisch maar toch leuk. Alleen het lijkt geen echte tijdswinst te geven. In iedere geval zeker niet voldoende om het waard te maken meerdere styles naast elkaar te draaien. Niet alle browsers  hebben namelijk even goede ondersteuning voor data URI’s (de base64 geëncodeerde blokken in de CSS).

Micromobs eenvoudige communicatie voor groepen

Micromobs is een heerlijke web2.0 dienst om met kleine groepen mensen snelle discussies te voeren. Daar komt het eigenlijk wel op neer. Middels een soort twitter-achtige interface kun je een “mob” aanmaken. Daarna kun je de mob delen met andere mensen. Als je uitgenodigd bent voor de mob kun je berichtjes toevoegen. Meer is er niet. Ja, je kunt een afbeelding toevoegen aan een bericht maar meer is er echt niet. Alles is gericht op eenvoud en simplicity. Ideaal voor het plannen van avondjes uit enzovoorts. O ja, wat ook wel geinig is: Micromobs werkt ook prima in Safari op de Iphone.

Bezoek Micromobs en start je eigen mobs

Doe het zelf SEO

Voor veel kleinere bedrijven zijn professionele zoekmachine specialisten niet betaalbaar maar helemaal niets doen is wel een erg gemiste kans. Aangezien wij bij Webparking dicht bij de bron zitten maar zelf geen zoekmachine diensten (meer) aanbieden kan het nooit schaden wat basiskennis over te dragen.

Allereerst zijn er redelijk veel sites en online tools die je helpen bij het inventariseren van je site. Ze kijken of hij voldoet aan alle eisen om een goede positie in de zoekmachines te krijgen (zowel technisch als qua content) en geven eventuele tips.Daarnaast zijn er gewoon een aantal simpele zaken die je in het oog kunt houden. Ik zal zowel de belangrijkste punten als wat handige site hier met je delen.

De basisregels

  • Zorg voor goede, korte en kernwoordrijke titels (zowel browser als bijvoorbeeld H1 titels)
  • Gebruik valide HTML en CSS code
  • Zorg voor een website die zonder JavaScript en/of afbeeldingen leesbaar is (zie hier hoe Google je site ziet)
  • Gebruik een statistiekenprogramma (bijvoorbeeld Google Analytics) om alles meetbaar te krijgen
  • Zorg voor goede links naar je site (linkbuilding*)
  • Pas sociale media toe waar zinnig (twitter over je bedrijf, zorg voor een linkedin bedrijfsprofiel etc)

* Dit is één van de belangrijkste items in deze lijst. Zorg voor zo veel mogelijk kwalitatieve links naar je website. Liefst naar dieper-liggende pagina’s dus bijvoorbeeld naar je dienstenpagina (www.uwsite.nl/diensten) ipv. naar de home. Daarnaast is één link vanaf een belangrijke site ontelbaar meer waard dan duizenden links vanaf nietszeggende websites. Er zijn honderden pagina’s gewijd aan dit onderwerp dus ik zal hier niet verder op ingaan maar lees bijvoorbeeld eens;  Linkbuilding op Netters.nl en dit artikel van Emarky.nl over veelgemaakte linkbuidling fouten.

Handige tools
Uiteindelijk is dit waar het om gaat. Tools die je helpen lastige zaken eenvoudiger te maken en onoverzichtelijke zaken inzichtelijk te krijgen.

Eigenlijk zijn er nog 10.000 “handige” tools maar voor nu adviseer ik deze twee. Met deze twee in de hand, goede schriftelijke vaardigheden in de talen van je site en tijd om je te verdiepen in goede linkbuilding zijn er geen grenzen meer.

Webydo van PSD naar HTML

Het klinkt erg aantrekkelijk als je het zo hoort. Webydo helpt je om eenvoudig een website te maken door een PSD bestand te importeren. Hierna kun je met een soort “sleep en plaats” systeem de inhoud op zijn plek zetten en koppelen aan elkaar en klaar. Er is een werkende website ontstaan.

Er is een demo video beschikbaar waarop te zien is hoe het zou moeten werken. Allereerst probeer ik me gelijk een beeld te vormen van de beoogde doelgroep. Klanten van webdevelopment bureaus zullen hier niet terecht komen maar hobbyisten beschikken volgens mij niet altijd over PSD bestanden van het gewenste ontwerp. Het zou dus ergens op een gat ertussen terecht moeten komen. Mensen met voldoende kennis om zelf PSD bestanden te verkrijgen / maken maar met een budget wat niet toereikend is om een webdeveloper erbij te halen. Hoe dan ook is het concept wel erg grappig.

Daarnaast vraag ik me gelijk af;

  • Hoe solide is de code (volgens de vertellingen valid HTML/CSS)
  • Hoe goed kan het omgaan met rommelige PSD bestanden
  • Hoe onderhoudt je de site na de 1e keer in elkaar zetten*
  • Wat gaat het kosten (een deel van de pagina’s is nog leeg)

* Detail hierbij is dat er in de navigatie al ruime is voor de producten Design Management Systeeem (DMS) en Content Management Systeem (CMS) dus wie weet wat er nog komt.

Voor nu wel een leuke om te volgen denk ik. Kijken hoe het eindresultaat wordt en natuurlijk wat het gaat kosten.

Orbit Jquery image slide

Image sliders maken websites vaak nog leuker door een stukje interactie. Daarnaast biedt het mogelijkheden om meer beeldmateriaal met een beperkte hoeveelheid ruimte te tonen. Het nadeel is echter dat veel image sliders te groot zijn. Nou ja, te groot niet maar groter dan gewenst. Soms is er wel een stripped-down versie met weinig gewicht maar zeker als je wat leuke effecten erin wilt worden ze snel groter.

Orbit – Jquery image slider plugin
Met een gewicht van 3.2 KB een lekker compact geval. De look en feel zijn echter fantastisch.

Enkele functionaliteiten

  • Automatische slideshow pauzeren en weer activeren (rechtsboven)
  • Naar andere afbeelding gaan dmv. de ronde icoontjes linksboven
  • Weergave hoe lang het nog duurt voor de volgende afbeelding komt (rechtsboven)
  • Ondertitels mogelijk
  • Prima werkend in Chrome, Safari en Firefox 3.5+ (getest in IE7+)

Bezoek de site en bekijk de demo

Versiebeheer met Subversion

Sinds de dag dat ik kennis maakte met versiebeheer was ik verkocht. Eerder hoorde ik hier en daar wel eens developers die het gebruikten maar omdat ik zelf niet wist hoe geweldig het was miste ik niets. Tegenwoordig gebruiken we in principe voor alles versiebeheer middels Subversion (SVN). Ongeacht het formaat van het project.

Wat is versiebeheer?
In basis is dit software waarmee wijzigingen in software of documenten kunnen worden bewaard. Alle wijzigingen worden als het waren gelogd in een soort geschiedenis. Wijzigingen krijgen een uniek nummer zodat snel te zien welke mutaties bij welke versie horen. Zeker in omgevingen waar je met meerdere gebruikers aan één project werkt is versiebeheer een uitkomst. Zo kun je eenvoudig de laatste mutaties van je collega’s binnenhalen als je met een project begint en kun je de door jou gemaakte mutaties snel verspreiden onder de rest van het team. Daarnaast biedt versiebeheer je de mogelijkheid om terug te kijken in de geschiedenis. Op welk moment is iets aangepast en door wie.

Subversion
Wij gebruiken op kantoor subversion voor ons versiebeheer. Subversion is eenvoudig te koppelen vanuit Eclipse of Netbeans en werkt redelijk eenvoudig. In het kort;

  1. We maken een nieuwe SVN repository (zeg maar een plaats waar de historie van bestanden bewaard wordt) aan op onze eigen SVN server
  2. We bepalen op de server welke gebruikers er zijn en welke rechten ze hebben op dit project
  3. Daarna gaan we naar onze IDE en koppelen het project aan de aangemaakte SVN
  4. Hierna kun je lokaal bepalen welke zaken je wel niet (settings van je IDE bijvoorbeeld) in de SVN repository wilt opslaan
  5. De laatste stap is de initiële import, hierbij importeer je als het ware het project in zijn huidige staat in de repository

Vanaf dit moment heb je een werkend project met SVN koppeling. Vanaf nu zal je IDE bij alle wijzigingen in bestanden en mappen met een icoontje of kleurtje aangeven dat deze gewijzigd is ten opzichte van de laatste SVN situatie. Je kunt dan je wijzigingen toevoegen aan de repository (commit), vernieuwen volgens de actuele repository (update) of terugdraaien naar de repository status (revert).

Samen werken
Bij iedere commit kun je opmerkingen meegeven. Zo zien je collega’s gelijk wat de reden was van de update mochten ze hem binnenhalen middels een update of later terugzien in de geschiedenis van het bestand. Als je toevallig tegelijk één bestand gewijzigd hebt dan heb je een conflict. Dit is vaak eenvoudig op te lossen door beide versies met elkaar samen te voegen. Je IDE is vaak zelf perfect in staat om te kijken of de wijzigingen elkaar overlappen of dat het twee verschillende delen van de code betreft.

Nog een voordeel van versiebeheer
Wij doen ook regelmatig projecten voor grotere organisaties waarbij het belangrijk is dat mutaties aan de code genoteerd worden. Zo kun je later eenvoudig terugzoeken op welk moment een bepaalde bug bijvoorbeeld is opgelost, door wie en welke bestanden daarmee gewijzigd zijn. Bij wijzigingen kan het handig zijn omdat je bijvoorbeeld een wijziging in een tabelstructuur die meerdere bestanden omvat in één keer terug kunt draaien alsof hij nooit heeft plaatstgevonden.

Branches en tags
Het is ook mogelijk verschillende versies van een project naast elkaar te hebben. Dit doe je met branches. Als je bijvoorbeeld een nieuwe functionaliteit gaat ontwikkelen die voorlopig nog los moet staan van het hoofdproject (wat ondertussen wel doorontwikkeld wordt) maar op termijn wel samengevoegd gaat worden dan maak je een branche aan. Dit is eigenlijk gewoon een virtuele kopie van de trunk (hoofdmap van het project) waarin afwijkingen ten opzichte van de core worden bijgehouden. Op een later moment kan dan beslist worden een branche te integreren in de trunk zodat dit dus de productieversie wordt. Als een branche voorlopig niet meer actief ontwikkeld wordt noemt men deze een tag. Er is namelijk verder geen verschil tussen een branche en een tag.

Wetransfer grote bestanden delen

Wetransfer is grote bestanden versturen en delen zoals wij het leuk vinden. Veel ruimte (2 GB bestandslimiet), snelle servers, prettige web 2.0 interface, geen registratie nodig en bestanden blijven twee weken staan. Wetransfer is, nog steeds, in beta maar wij krijgen er geen genoeg van.

Hoe werkt het?

  1. Je kiest één of meer bestanden om te uploaden
  2. Je voert het mailadres (of meerdere) in van de persoon die het bestand moeten krijgen
  3. Je voert je eigen mailadres in (krijg je een berichtje als de ontvanger het bestand gedownload heeft)
  4. Je voert een optioneel bericht in bij het bestand en klaar!

Mochten de eenvoud en goede mogelijkheden je nog niet overtuigd hebben dan moet de prettige web 2.0 interface dit toch wel doen? Test nu WeTransfer

Typekit een oplossing voor fonts en rechtenproblemen?

Ooit was er een web met een beperkte hoeveelheid fonts die je kon / mocht gebruiken. De wereld was toen eenvoudig. Weinig opmaak, veel rechte lijnen en als het font maar goed leesbaar was had je alles wat je wilde. Tegenwoordig willen we meer. We willen fonts die mooi zijn, die opvallen en die een website een uniek karakter geven. Waar webbouwers altijd tegenaan lopen is het auteursrechtelijke gedeelte van fonts.

Het probleeem
Je mag een font niet zonder meer gebruiken op je website. Normaliter geef je met CSS aan welk font er gebruikt moet worden. Dit wordt dan vanaf de computer van de gebruiker geladen. Geen probleem. Wil je echter een “exotischer” font wat niet iedereen op zijn computer heeft dan wordt het spannender. Oplossingen als Cufon of SiFR voldoen maar zijn niet volledig legaal. Niet alleen omdat men vaak de rechten op de fonts niet heeft maar ook omdat de meeste ontwerpers liever niet hebben dat hun fonts “downloadbaar” op het internet staan.

De afgelopen jaren is op dit vlak steeds meer behoefte gekomen aan oplossingen. Een veelgenoemde oplossing is @font-face waarbij je in CSS een font-file aanwijst. Hierover ooit meer. Voor nu focussen we op de oplossing van typekit.

Typekit
Typekit is een website waar je middels een abonnement rechten koopt op het gebruik van een redelijke hoeveelheid fonts. Je kiest via hun font-browser één of meer gewenste fonts uit. Daarna kies je voor het gewenste font welke inhoud je er allemaal in wilt hebben. Denk hierbij aan dikgedrukte variant of niet, schuin gedrukte variant of niet etc. Hierbij geldt; hoe meer je erin doet, hoe zwaarder het bestand wordt.

Hierna geef je aan op welke domeinen je het font wilt gebruiken en sla je alles op. Het systeem gaat nu jouw gewenste fontconfiguratie  “klaarzetten” waarna je het middels een paar stukjes javascript kunt inladen in je site. De gewenste teksten geef je een bepaalde class mee en ze worden met JavaScript voor je vervangen met het gewenste font. Redelijk eenvoudig en, het belangrijkste, een legale oplossing.

De kosten
Voor de kosten hoef je het niet te laten liggen. Vanaf een kleine $50 per jaar krijg je toegang tot de volledige library met een ongelimiteerd aantal websites en fonts per site. De enige limiet is 500.000 pageviews per maand. Maar voor $99.00 per jaar is dit al 1.000.000 pageviews per maand.

Kortom; bouw je regelmatig websites of ben je een font-freak dan zit je voor enkele tientallen dollars zeer goed.

Bezoek: www.typekit.com

Vecteezy.com

Vecteezy.com is een online verzamelplaats voor vrij te gebruiken vector afbeeldingen. Als ontwerper kun je er een account aanmaken en je werken uploaden. Door de redelijk grote community die erachter zit krijg je als ontwerper feedback, erkenning en naamsbekendheid. Als webbouwer of hobbyist is het een leuke bron van inspiratiemateriaal of misschien net dat icoontje wat je project afmaakt.

Naast de “vrij beschikbare” afbeeldingen is er ook een deel met premium content. Dit wordt echter niet op een zeer nadrukkelijke wijze gebracht. Daarnaast is een premium account zeer goed betaalbaar. Voor $ 19 per maand kun je een onbeperkte hoeveelheid materiaal downloaden.