Chopstick, het framework voor ervaren designers

24 oktober 2013 Inzichten /

Twitter Bootstrap en Zurb Foundation zijn ongetwijfeld de bekendste frontend-frameworks. En er zijn uiteraard een aantal voordelen verbonden aan dergelijke frameworks. De code die er achter zit is proper en alles is uitvoerig getest. Als je zo'n framework gebruikt weet je dat het zal werken in een mum van tijd.

Onze ervaring met deze frameworks is echter dat je meer bezig bent met voorgekauwde classes te overschrijven, te herschrijven of te verwijderen. Veel zaken die er in zitten heb je waarschijnlijk helemaal niet nodig maar ze blijven soms wel ergens staan. En nog erger, je zit vast aan hun manier van code schrijven en designen.

Wil je met EM's werken in plaats van pixels in bootstrap? Begin maar opnieuw. Wil je de top-bar van Foundation 12 pixels hoger maken? Begin maar te zoeken.

Let's strip it down

De backbone van chopstick zit in de map shared. Als je enkel de files in deze map zou compilen zou het resultaat een lege CSS-file zijn. Er zitten namelijk enkel functions, mixins en extends in. Niets dat direct compiled dus. Lichter kan het niet zijn. 

Het grootste verschil met andere frameworks is dat Chopstick eigenlijk geen conventioneel framework is. Je kan er frameworks mee maken.

Voor designers, door designers

Er zitten verschillende design-patterns in die voor verschillende componenten kunnen gebruikt worden. "horizontal-nav" is daar een perfect voorbeeld van. pas horizontal-nav toe op een

    en je krijgt wat je wou: simpelweg lijst-items die naast elkaar staan. Zonder margin, padding, font-size of andere stijlen. Zo heb je de vrijheid om zelf een semantische naming convention te bepalen en daarop stijlen toe te passen. Ideaal om te designen in de browser dus.

    Op die manier werken we zo DRY (Do not Repeat Yourself) mogelijk. We schrijven dezelfde code in minder tijd.

    Status & toekomst

    Chopstick is nog maar een alpha release en er wordt constant aan gewerkt. Bij Wijs wordt Chopstick bij elke website gebruikt waardoor we makkelijk en snel nieuwe zaken laten doorvloeien in de Chopstick repo.

    Er zijn 3 maandelijkse meetups waarin we de bestaande features finetunen en nieuwe/ontbrekende zaken bedenken.

    Dit zijn de zaken die er binnenkort bijkomen:

    • chopstick fork theme aka potnoodle
    • chopstick library/patterns
    • chopstick style guide (style tiles gedesigned in de browser)

    Contribute

    Heb je zelf ideeën? Alle hulp is welkom. Chopstick staat op Github. Doe gerust eens een pull-request. Of wil je er full-time mee komen experimenteren? Check dan zeker onze vacature voor webdesigner.

    Get chopstick!

    Je kan chopstick nu al gebruiken voor al je websites. Hoe je het moet installeren en gebruiken staat allemaal uitgebreid gedocumenteerd op getchopstick.com

Lees meer

Nieuwsbrief

Doe zoals meer dan 1700 marketing en design experts en ontvang maandelijks onze nieuwsbrief vol inzichten, tips en verrassende nieuwigheden.