Correct gebruik van bootstrap

[Douweegbertje]

Ola,

We gaan binnenkort een projectje beginnen op basis van CodeIgniter en een leuke css boostrap (twitter http://getbootstrap.com/)
Nu heb ik al wel wat ideeën en een plan van aanpak etc is er allemaal wel, echter ben ik toch benieuwd of hier mensen zijn die een 'best practise' hebben

De primaire rede om de boostrap te gebruiken is om een fatsoenlijke basis te hebben. Natuurlijk met responsive. In kort gaat het project er ongeveer zo uitzien:
primary url met een login gevolgd door sub-domains met elk hun eigen style (afhankelijk waar je mee inlogged).

Nu dacht ik zelf aan een oplossing die er ongeveer zo uit gaat zien:

Standaard "core" van bootstrap gebruiken, en letterlijk elke kleurcode en overige 'dynamische' (per sub domein) meuk eruit slopen. Deze core gewoon eerst 'laden' gevolgd door een specifieke css die de rest invult.

Nu lijkt dit misschien allemaal voor zelf sprekend, echter ben ik gewoon benieuwd of jullie andere gedachtes hebben.

[RobIII]

Kijk eens naar de LESS variant (en specifiek variables.less). Bootstrap bouwt zélf mbv LESS de uiteindelijke CSS (gewoon bootstrap.less "compilen"). Dan hoef je niets te "slopen".

[ Voor 54% gewijzigd door RobIII op 05-09-2013 20:35 ]

[Douweegbertje]

eh ja eigenlijk stom dat ik daar niet aan dacht

Ik zit alleen een beetje met het genereren van zo'n css. Het liefst zou ik vanuit een backend een 'sub domein' willen kunnen aanmaken. Hiermee doel ik meer over het feit om dus een 'kleurenpalet' erbij te hebben om een tiental variabelen in de css te kunnen defineren. Ik denk alleen dat dit lukt als het niet 'pre' gecompiled word.

Maar goed, thx voor je antwoord. Ik schaam me nog half om hier niet aan te denken haha.

[RobIII]

douweegbertje schreef op donderdag 05 september 2013 @ 21:14:
Ik denk alleen dat dit lukt als het niet 'pre' gecompiled word.

Je houdt gewoon per "subdomein" (of gebruiker of instelling of whatevs) een pakkie variabelen bij en als ze wijzigen genereer je terplekke de CSS ervoor. En je kunt, als alternatief, ook gewoon de .less files serveren (met een "dynamische" variables.less) en gewoon de less.js gebruiken (maar dan ben je afhankelijk van JS waar dat eigenlijk helemaal niet nodig is).

[Douweegbertje]

In feite dus gewoon zoiets als http://leafo.net/lessphp/ gaan gebruiken dus?

Ik zet wellicht morgen eens een test-case op om te zien of dat een beetje lukt.

Bedankt alweer

[DXaroth]

Je kan ook gewoon 1 algemene bootstrap css gebruiken; en vervolgens een (kleinere) per-domein css die de kleurstelling bepaalt...

En ik zou niet lessphp gebruiken; gewoon een van de (tig) compilers .. je hoeft alleen maar te compilen als je less wijzigt... voordeel van de 'echte' compilers is dat ze veel meer support hebben. lessphp vind het een aankondiging nodig om te melden dat ze (eindelijk) bootstrap supporten, terwijl bootstrap niets absurts doet qua less.

[Aloys]

Even een zijdelingse opmerking: Het is de moeite waard om te kijken naar nieuwe php frameworks zoals Symfony2 of Laravel, want CodeIgniter loopt achter (en zal waarschijnlijk stilletjes dood gaan).

[RobIII]

DXaroth schreef op donderdag 05 september 2013 @ 23:41:
terwijl bootstrap niets absurts doet qua less.

lessphp is dan niet de enige, dotless had er ook "last" van (niet werken met Bootstrap 3 dus). Waar precies van durf ik niet te zeggen maar hij vond 't nie leuk nie Ik had 't toch al niet meer nodig en heb 't dus uit m'n project gemikkerd, maar ik wou maar even zeggen

[edit]
Ah, hier iets meer erover. In less 1.3/1.4 zitten schijnbaar wat breaking changes

[ Voor 22% gewijzigd door RobIII op 05-09-2013 23:59 ]

[DXaroth]

RobIII schreef op donderdag 05 september 2013 @ 23:55:
[...]

lessphp is dan niet de enige, dotless had er ook "last" van (niet werken met Bootstrap 3 dus). Waar precies van durf ik niet te zeggen maar hij vond 't nie leuk nie Ik had 't toch al niet meer nodig en heb 't dus uit m'n project gemikkerd, maar ik wou maar even zeggen

Er zijn er wel meer die veel te hevig focussen op het gebruik van de implementatie (less) in plaats van op de implementatie zelf...
En ja, die gaan dan op hun gat als het meest populaire project opeens dingen -ietsjes- anders doet, en op een plek komt waar hun implementatie tekort schiet.

[edit] en dan te bedenken dat 1.4 al 3 maanden bekend is, en de breaking changes al 5...

[ Voor 5% gewijzigd door DXaroth op 06-09-2013 00:01 ]

[storeman]

Terug naar het probleem van de TS. Ik zou gewoon de base css van Bootstrap gebruiken en niet voor elk subdomein recompilen. Je kunt volgens mij beter per subdomein een kleine CSS hebben die de base overruled.

Zo kun je de base css vanuit een CDN laden. De bootstrap.min.css is toch ongeveer 100Kb, voor een paar andere kleurtjes lijkt me tig varianten hiervan behoorlijk overkill.

[TheNephilim]

Hier gewoon een kopie van bootstrap.less gemaakt, alle imports die niet nodig zijn outcommented en onder de variables.less import nog een stuk van variables gezet, zodat het makkelijk overschrijven van variabelen mogelijk is. Dit alles zonder de standaard boostrap LESS bestanden aan te passen. Op deze manier kun je ook makkelijker updaten dan dat je in de LESS bestanden zelf (bijv. variables.less) gaat lopen klooien.

[kwaakvaak_v2]

Aloys schreef op donderdag 05 september 2013 @ 23:44:
Even een zijdelingse opmerking: Het is de moeite waard om te kijken naar nieuwe php frameworks zoals Symfony2 of Laravel, want CodeIgniter loopt achter (en zal waarschijnlijk stilletjes dood gaan).

+1!

Codeigniter staat zelfs een soort van in de etalage http://ellislab.com/blog/...new-owner-for-codeigniter, en zou niet mijn eerste keuze zijn voor een nieuw project.

Dat gezegd hebbende, nu aantal keer die leafo less gebruikt in combinatie met symfony2 en de bijpassende bundle van leafo, werkt geweldig. Op 1 klein issue na, je moet niet in je template een stuk of 8 .less files samen willen voegen met {% script.... %} en dan verwachten dat als je de mixins in de eerste ook in de laatete beschikbaar zijn. Als je dat wilt, moet je een master.less maken met je mixins en dan de rest van je less bestanden via een @import daar aan toevoegen.

[Douweegbertje]

storeman schreef op vrijdag 06 september 2013 @ 09:44:
Terug naar het probleem van de TS. Ik zou gewoon de base css van Bootstrap gebruiken en niet voor elk subdomein recompilen. Je kunt volgens mij beter per subdomein een kleine CSS hebben die de base overruled.

Zo kun je de base css vanuit een CDN laden. De bootstrap.min.css is toch ongeveer 100Kb, voor een paar andere kleurtjes lijkt me tig varianten hiervan behoorlijk overkill.

Ja maar als je een .css gaat gebruiken en dan een verkapte 'override.css' per subdomein gaat doen, dan zou dat betekenen dat je letterlijk elk element moet 'overriden' terwijl je met .less even een tiental vars moet aanpassen en dan word het in feite overal doorgevoerd?

kwaakvaak_v2 schreef op vrijdag 06 september 2013 @ 09:54:
[...]


+1!

Codeigniter staat zelfs een soort van in de etalage http://ellislab.com/blog/...new-owner-for-codeigniter, en zou niet mijn eerste keuze zijn voor een nieuw project.

Dat gezegd hebbende, nu aantal keer die leafo less gebruikt in combinatie met symfony2 en de bijpassende bundle van leafo, werkt geweldig. Op 1 klein issue na, je moet niet in je template een stuk of 8 .less files samen willen voegen met {% script.... %} en dan verwachten dat als je de mixins in de eerste ook in de laatete beschikbaar zijn. Als je dat wilt, moet je een master.less maken met je mixins en dan de rest van je less bestanden via een @import daar aan toevoegen.

Ja een goed punt, echter zie ik nog niet direct een probleem.
Imo voldoet CI aan bepaalde voorwaarde, en het is enigszins een fatsoenlijk product. Het is niet zo zeer de bedoeling om jaren aan dit project te gaan ontwikkelen, en ik verwacht niet al te veel problemen om een framework te hebben waar niets meer aan veranderd word.

[ Voor 42% gewijzigd door Douweegbertje op 06-09-2013 10:13 ]

[Barryvdh]

Wij gebruiken Bootstrap ook al 2 jaar gewoon met LessPHP, werkt prima hoor. Ze lopen natuurlijk wel achter op de echte release, maar volgens mij werkte Bootstrap 3 ook binnen paar weken na de release al gewoon..

En ik merk ook dat heel veel mensen van CodeIgniter af aan het stappen zijn. Werk zelf met Laravel en daar komt een groot deel van de community ook van CI af. Misschien wel de moeite waard als je nu een project gaat beginnen.

[kwaakvaak_v2]

douweegbertje schreef op vrijdag 06 september 2013 @ 10:11:
[...]


Ja maar als je een .css gaat gebruiken en dan een verkapte 'override.css' per subdomein gaat doen, dan zou dat betekenen dat je letterlijk elk element moet 'overriden' terwijl je met .less even een tiental vars moet aanpassen en dan word het in feite overal doorgevoerd?

[...]


Ja een goed punt, echter zie ik nog niet direct een probleem.
Imo voldoet CI aan bepaalde voorwaarde, en het is enigszins een fatsoenlijk product. Het is niet zo zeer de bedoeling om jaren aan dit project te gaan ontwikkelen, en ik verwacht niet al te veel problemen om een framework te hebben waar niets meer aan veranderd word.

Ik moet eerlijk toegeven dat ik niet weet hoe CI erbij hangt, maar ik zou het voor de zekerheid toch even tegen php 5.4/5.5 aanleggen en kijken of het blijft staan aangezien 5.3 toch een soort van aflopende zaak is. Stel dat je deze app een jaartje of 2 moet blijven supporteren (wat kan gebeuren, ondanks dat je dat zelf niet van te voren bedacht had) en het werkt alleen onder 5.3 en het blijkt dat er toch een gapend gat in 5.3 zit.

[Douweegbertje]

Tja wellicht een goede rede inderdaad, eigenlijk niet eens zo bij stil gestaan omdat onze host 5.3 serveert. Ik dacht overigens dat CI wel werkte onder 5.4, maar enkel wat deprecated meldingen gaf. Nja goed het was mij ontgaan dat CI zo erg bergafwaarts was gegaan . Normaliter doen we niets met frameworks, omdat we ons eigen ding hebben. CI had de voorkeur omdat ik (en mijn collega) hier wel ruime ervaring in hadden, omdat we voor en naast ons werk hier mee hadden gewerkt.

[Firesphere]

Let op dat als je bootstrap gebruikt, je voor IE8 respond.js nodig hebt, anders valt'ie terug op de kleinste versie die je hebt gedefinieerd.

[Douweegbertje]

De bootstrap.min.js bevat toch alle JS assets?

[Firesphere]

ja, maar niet respond.js, die zit er niet standaard in.