Starten met Bootstrap

Pagina: 1
Acties:

Vraag


Acties:
  • 0 Henk 'm!

  • Melvin.P
  • Registratie: December 2015
  • Laatst online: 14-08 09:59
Hi,

Ik heb inmiddels enige ervaring met Drupal als CMS en wil nu graag met Bootstrap gaan designen.

Hoewel ik overal lees dat het heel eenvoudig is (relatief), en ik die indruk ook krijg bij het lezen van allerlei informatie, weet ik niet goed wat mijn startpunt is. Het aanmaken en installeren van een sub-theme is gelukt, maar waar ik nou daadwerkelijk mijn CSS-code moet gaan maken en ervoor zorg dat Drupal het snapt, is mij onduidelijk.

Online wemelt het van informatie, maar door de inmiddels tientallen termen en opties weet ik niet goed waar te beginnen.

Wie kan me een kickstart geven?

Bedankt!

Alle reacties


Acties:
  • 0 Henk 'm!

  • RoRoNL
  • Registratie: Januari 2008
  • Niet online
Dit pakket is op basis van Bootstrap. Kan je erg mooie resultaten mee boeken. Eenmalig betalen en gaan. (Ik heb er geen zakelijke connectie mee, maar ben er gewoon blij mee

https://blocsapp.com

Acties:
  • 0 Henk 'm!

  • Melvin.P
  • Registratie: December 2015
  • Laatst online: 14-08 09:59
Dat ziet er inderdaad goed uit, thanks! Ik heb al een app voor Bootstrap-design gekocht, maar dit kan een goede aanvulling zijn.

Het gaat me overigens meer om het integreren van Bootstrap in mijn Drupal CMS. Het ziet er zo makkelijk uit maar ik loop gewoon op een dood spoor.

Acties:
  • +1 Henk 'm!

Verwijderd

Geen ervaring met drupal, wel met joomla en bs 4. Praktijk is toch eerst een ontwerp in plain html - scss - js - bootstrap te maken, en dan (met overrides in joomla) het geheel in bs 4 om te zetten. Zal in drupal wel afwijken, maar het is aanzienlijk minder simpel dan plug&play.

Acties:
  • 0 Henk 'm!

  • Melvin.P
  • Registratie: December 2015
  • Laatst online: 14-08 09:59
Dat geeft niks, ben niet bang voor een uitdaging maar ik weet niet zo goed waar die uitdaging begint.

Houdt die overriding in dat je de structuur van de CMS toepast in je zelfgemaakte thema?

Acties:
  • 0 Henk 'm!

Verwijderd

Voorop: ik ken Drupal inhoudelijk helemaal niet.

In Joomla worden modules/componenten weergegeven in een bepaalde div-structuur met bootstrap *2* css-classes (hangt enigzins af van het template dat je gebruikt). Binnen Joomla kan je via zgn template overrides de div-structuur aanpassen naar bootstrap 4 classes. Dat betekent in de praktijk dat je van heel veel standaard modules een override moet maken. Is even werk. Soms zijn de classes ook verschillend verdeeld, zo kent de menustructuur in bs4 een andere plek voor de active dan joomla out of the box. Is dus wat gepriegel.
Houdt die overriding in dat je de structuur van de CMS toepast in je zelfgemaakte thema?
Ik begrijp niet helemaal wat je bedoelt, maar bij de opzet van je thema moet dat denk ik wel passen in de structuur van je CMS. Bijvoorbeeld in Joomla is er één hoofdcomponent per pagina, aan die randvoorwaarde moet je thema dan wel voldoen. (er zijn natuurlijk altijd wat work-arounds, maar die probeer ik meestal niet uit, kost in de praktijk meer dan je lief is).

Acties:
  • 0 Henk 'm!

  • Melvin.P
  • Registratie: December 2015
  • Laatst online: 14-08 09:59
Waarschijnlijk zit de kern van mijn vraag in wat je zegt: bij de opzet van je thema moet dat denk ik wel passen in de structuur van je CMS. Ik weet gewoon niet hoe ik daar aan moet beginnen.

Acties:
  • 0 Henk 'm!

  • kaassouffle
  • Registratie: Januari 2002
  • Laatst online: 05-10 10:16

kaassouffle

Medewerker v/d Maand

Er is wel info te vinden over 'making custom drupal themes' toch ?

Bij Wordpress kun je eigenlijk elke opzet wel vertalen naar een template. Beginnen in html+css (evt icm bootstrap en js) en die vervolgens indelen in de template-onderdelen (header, footer, index, page etc.)

Acties:
  • 0 Henk 'm!

Verwijderd

Idd, simpel beginnen in plain html en css, vergeet even responsive, en zorg dat je de content uut het cms weet te halen. Zal bij drupal ook wel zo werken.

Acties:
  • +3 Henk 'm!

  • R4gnax
  • Registratie: Maart 2009
  • Laatst online: 06-09 17:51
Melvin.P schreef op maandag 21 mei 2018 @ 15:50:
Ik heb inmiddels enige ervaring met Drupal als CMS en wil nu graag met Bootstrap gaan designen.
Tenzij je echt geinteresseerd bent in dertien-in-een-dozijn meuk met een grid systeem dat - ondanks het gebruik van flexbox - nog steeds op oude, outdated layout principes rust, zou ik je aanraden om je moeite eerder te steken in het leren van CSS zelf i.p.v. Bootstrap.

Zelfde argument voor andere rapid-prototyping rommel.

(Dat veel mensen het gebruiken wil niet direct zeggen dat het een goede oplossing is.)

[ Voor 10% gewijzigd door R4gnax op 23-05-2018 00:04 ]


Acties:
  • 0 Henk 'm!

  • Raem
  • Registratie: Oktober 2005
  • Laatst online: 12:12
Je kunt het Bootstrap thema als basis gebruiken:
https://www.drupal.org/project/bootstrap

Vervolgens maak je een sub-thema aan gebaseerd op bovenstaande Bootstrap waarin je vervolgens zelf al je aanpassingen doet.
https://www.drupal.org/do...or-sub-theme-of-sub-theme

In je libraries.yml bestand definieer je de css en js bestanden die je wilt gaan gebruiken.

https://psnprofiles.com/RaemNL


Acties:
  • 0 Henk 'm!

  • CH4OS
  • Registratie: April 2002
  • Niet online

CH4OS

It's a kind of magic

Melvin.P schreef op maandag 21 mei 2018 @ 16:07:
Het ziet er zo makkelijk uit maar ik loop gewoon op een dood spoor.
Bootstrap is ook verre van moeilijk. :) Wellicht is het dus handiger om te kijken waarom je vast loopt?

Acties:
  • 0 Henk 'm!

  • Melvin.P
  • Registratie: December 2015
  • Laatst online: 14-08 09:59
Bedankt allemaal! Fijn dat jullie me supporten.

Vooral met de reactie van Raem denk ik wat te kunnen. Zou je me iets meer willen vertellen? Thema installeren en sub-thema aanmaken is gelukt (met starterkit), wordt ook herkend door Drupal.

Nu moet ik met de .yml-bestanden en Bootstrap/CSS aan de gang. Zou je me daar wat wegwijs in willen maken? Zodra ik wat meer begrijp van de onderlinge werking kom ik verder.

Acties:
  • 0 Henk 'm!

  • MrMarcie
  • Registratie: Oktober 2006
  • Laatst online: 04-10 14:02

MrMarcie

CFMoto 650MT

Verwijderd schreef op maandag 21 mei 2018 @ 21:13:
Voorop: ik ken Drupal inhoudelijk helemaal niet.

In Joomla worden modules/componenten weergegeven in een bepaalde div-structuur met bootstrap *2* css-classes (hangt enigzins af van het template dat je gebruikt). Binnen Joomla kan je via zgn template overrides de div-structuur aanpassen naar bootstrap 4 classes. Dat betekent in de praktijk dat je van heel veel standaard modules een override moet maken. Is even werk. Soms zijn de classes ook verschillend verdeeld, zo kent de menustructuur in bs4 een andere plek voor de active dan joomla out of the box. Is dus wat gepriegel.


[...]

Ik begrijp niet helemaal wat je bedoelt, maar bij de opzet van je thema moet dat denk ik wel passen in de structuur van je CMS. Bijvoorbeeld in Joomla is er één hoofdcomponent per pagina, aan die randvoorwaarde moet je thema dan wel voldoen. (er zijn natuurlijk altijd wat work-arounds, maar die probeer ik meestal niet uit, kost in de praktijk meer dan je lief is).
Je hoeft in Joomla (en denk Drupal ook) geen overrides te maken voor BS. Je maakt de basis (vakken) opmaak in je template en de modules etc die later erin geladen worden hang je via CSS (sass bijv.) de juiste code aan. Ook makkelijk switchen naar nieuwe versie of ander framework dan later. En veul minder werk. En bij eventuele updates hoef je niet alles opnieuw te doen.

De basis Bootstrap 4 duidelijk uitgelegd


Voorbeeldjes (Sass):

.moduletable.zoekenmenu {
@extend .col-sm-8;
@extend .col-md-4;
background:$accent;
}

//Alle modules gelijke breedte en onder md volle 100% breed
#footer .moduletable {
@extend .col-md;
}

[ Voor 6% gewijzigd door MrMarcie op 10-06-2018 00:46 . Reden: Typo's ]

For sale | "Goodbyes are only for those who love with their eyes. Because for those who love with heart and soul there is no such thing as separation" Rumi


Acties:
  • 0 Henk 'm!

Verwijderd

Joomla is bootstrap 2. Voor bs4 zijn wel overrides noodzakelijk. Met hak en breekwerk in sass kan je daar wellicht hier en daar het schrijven van php overrides mee voorkomen, maar het blijven overrides en ga me niet vertellen dat dat “veul” minder werk is.

[ Voor 61% gewijzigd door Verwijderd op 10-06-2018 01:00 ]


Acties:
  • 0 Henk 'm!

  • MrMarcie
  • Registratie: Oktober 2006
  • Laatst online: 04-10 14:02

MrMarcie

CFMoto 650MT

Verwijderd schreef op zondag 10 juni 2018 @ 00:55:
Joomla is bootstrap 2. Voor bs4 zijn wel overrides noodzakelijk. Met hak en breekwerk in sass kan je daar wellicht hier en daar het schrijven van php overrides mee voorkomen, maar het blijven overrides en ga me niet vertellen dat dat “veul” minder werk is.
Ik doe het dagelijks (BS4+Joomla o.a.) ..... Zonder overrides, plugins e.d.

P.S.
Er zijn plugins die de BS2 code automatisch overschrijven naar BS4.

[ Voor 12% gewijzigd door MrMarcie op 10-06-2018 18:57 . Reden: typo's ]

For sale | "Goodbyes are only for those who love with their eyes. Because for those who love with heart and soul there is no such thing as separation" Rumi


Acties:
  • 0 Henk 'm!

  • FalconerHG
  • Registratie: December 2011
  • Laatst online: 15-08 15:33
Bootstrap was voor veel developers een prima manier om snel met themas als Responsive en Grid bekend te raken, en snel allerlei componenten uit te rollen.

Er is vast nog een plek voor, maar ik ben er inmiddels van genezen - zelf bouwen betekent veel schonere code en grids zijn grotendeels achterhaald doordat moderne designs niet meer van die ielig kleine kolommetjes hebben. (ja, er is altijd een Grid, maar we maken ze niet in zulk detail)

Acties:
  • 0 Henk 'm!

  • MrMarcie
  • Registratie: Oktober 2006
  • Laatst online: 04-10 14:02

MrMarcie

CFMoto 650MT

FalconerHG schreef op zondag 10 juni 2018 @ 18:44:
Bootstrap was voor veel developers een prima manier om snel met themas als Responsive en Grid bekend te raken, en snel allerlei componenten uit te rollen.

Er is vast nog een plek voor, maar ik ben er inmiddels van genezen - zelf bouwen betekent veel schonere code en grids zijn grotendeels achterhaald doordat moderne designs niet meer van die ielig kleine kolommetjes hebben. (ja, er is altijd een Grid, maar we maken ze niet in zulk detail)
.... maar als klant geen budget heeft/wil-uittrekken wel een prettige manier om snel iets uit de grond te trekken. Zelf bouwen heeft ook mijn voorkeur. Alhoewel die nieuwe BS4 wel erg goed is.

For sale | "Goodbyes are only for those who love with their eyes. Because for those who love with heart and soul there is no such thing as separation" Rumi


Acties:
  • 0 Henk 'm!

  • FalconerHG
  • Registratie: December 2011
  • Laatst online: 15-08 15:33
Ja dan zit je soms vast. Soms vragen klanten er specifiek om ook. Mijn favo klanten vraag is "We willen Wordpress en Bootstrap want dat zijn de standaarden, en dan met dit thema (insert link naar over the top thema op themeforest). Crappy website gegarandeerd.

Gelukkig zijn er lightweight alternatatieven voor Bootstrap, zoals Skeleton.

Acties:
  • 0 Henk 'm!

  • botwood
  • Registratie: November 2017
  • Laatst online: 27-09 21:33
FalconerHG schreef op zondag 10 juni 2018 @ 20:11:
Gelukkig zijn er lightweight alternatatieven voor Bootstrap, zoals Skeleton.
Je zou ook eens kunnen kijken naar Bulma of wat ik nog wel veel gebruik is Susy of Profounder grid.

Acties:
  • 0 Henk 'm!

  • 418O2
  • Registratie: November 2001
  • Laatst online: 13:13
Mijn advies: begin met vanilla. Je moet de basis begrijpen voor je met frameworks begint. Of het nu CSS of JavaScript is.

Helemaal met een relatief simpele website is bootstrap overkill imo

[ Voor 22% gewijzigd door 418O2 op 10-06-2018 22:24 ]


Acties:
  • 0 Henk 'm!

  • MrMarcie
  • Registratie: Oktober 2006
  • Laatst online: 04-10 14:02

MrMarcie

CFMoto 650MT

418O2 schreef op zondag 10 juni 2018 @ 21:56:
Mijn advies: begin met vanilla. Je moet de basis begrijpen voor je met frameworks begint. Of het nu CSS of JavaScript is.

Helemaal met een relatief simpele website is bootstrap overkill imo
Die Vanilla lijkt me ook niet echt lightweight.

Die Skeleton is leuke basis voor simpele site. Maar heb ze allemaal even bekeken, kende ze niet allemaal. Moet zeggen dat BS4 samen met Sass echt wel goed in elkaar zit. Kan je veel mee op relatief simpele manier -als je al goede kennis hebt van css & sass- maar is ff wat studeer werk als je begint.

Ik werkte al veel met BS dus die hou ik er even in, naast mijn maatwerk.

For sale | "Goodbyes are only for those who love with their eyes. Because for those who love with heart and soul there is no such thing as separation" Rumi


Acties:
  • +1 Henk 'm!

  • 418O2
  • Registratie: November 2001
  • Laatst online: 13:13
MrMarcie schreef op zondag 10 juni 2018 @ 23:13:
[...]


Die Vanilla lijkt me ook niet echt lightweight.

Die Skeleton is leuke basis voor simpele site. Maar heb ze allemaal even bekeken, kende ze niet allemaal. Moet zeggen dat BS4 samen met Sass echt wel goed in elkaar zit. Kan je veel mee op relatief simpele manier -als je al goede kennis hebt van css & sass- maar is ff wat studeer werk als je begint.

Ik werkte al veel met BS dus die hou ik er even in, naast mijn maatwerk.
En natuurlijk is er een framework dat zo heet. Ik bedoel gewoon kaal CSS, zonder framework. Helemaal als beginner

Acties:
  • 0 Henk 'm!

  • MrMarcie
  • Registratie: Oktober 2006
  • Laatst online: 04-10 14:02

MrMarcie

CFMoto 650MT

418O2 schreef op zondag 10 juni 2018 @ 23:15:
[...]

En natuurlijk is er een framework dat zo heet. Ik bedoel gewoon kaal CSS, zonder framework. Helemaal als beginner
:) Begrijp je.

Ja kennis is wel noodzakelijk. Da's logisch zou Cruijff zeggen. En noodzakelijk anders loop je alleen maar tegen issues aan.

[ Voor 8% gewijzigd door MrMarcie op 10-06-2018 23:19 ]

For sale | "Goodbyes are only for those who love with their eyes. Because for those who love with heart and soul there is no such thing as separation" Rumi


Acties:
  • 0 Henk 'm!

  • 418O2
  • Registratie: November 2001
  • Laatst online: 13:13
MrMarcie schreef op zondag 10 juni 2018 @ 23:17:
[...]


:) Begrijp je.

Ja kennis is wel noodzakelijk. Da's logisch zou Cruijff zeggen.
Ik zie mensen ook zonder js kennis beginnen met react etc. Doe het gewoon niet en leerde basics. Vroeg of laat moet je afwijken van bootstrap en dan is het wel handig om te weten hoe CSS werkt, ipv alleen wat classes te kunnen toevoegen

Acties:
  • +2 Henk 'm!

  • R4gnax
  • Registratie: Maart 2009
  • Laatst online: 06-09 17:51
418O2 schreef op zondag 10 juni 2018 @ 23:19:
[...]

Ik zie mensen ook zonder js kennis beginnen met react etc. Doe het gewoon niet en leerde basics. Vroeg of laat moet je afwijken van bootstrap en dan is het wel handig om te weten hoe CSS werkt, ipv alleen wat classes te kunnen toevoegen
Yup. Zelfde wat ik in mijn professionele rol ook aan teams binnen ons bedrijf adviseer:
in dezelfde tijd dat je jezelf de Bootstrap grid of soortgelijk meester maakt, kun je jezelf ook gewoon flexbox layout meester maken en het zelf doen.

En Bootstrap is echt niet toereikend als je naar de andere onderdelen gaat kijken. Zodra je ook maar iets speciaals wilt in je stijl van knoppen, formulier-elementen, etc. is het vechten tegen de bierkaai of je schouders ophalen, Bootstrap negeren en het er gewoon zelf naast bouwen.


Daarnaast: de tijd dat je sites op kunt leveren die op een vaste grid gezet zijn met vaste resolutie breakpoints is gegaan. Het is niet meer responsive design wat de klok slaat, maar intrinsic design: de inhoud bepaalt zelf hoeveel breedte (of hoogte) er nodig is om zichzelf nog deftig te renderen en flexbox (of nog moderner: grid) layout zorgt er voor dat alles binnen het gestelde minimum en maximum blijft, dan wel omvloeit naar een extra regel als het echt niet meer past.

[ Voor 12% gewijzigd door R4gnax op 11-06-2018 22:09 ]


Acties:
  • 0 Henk 'm!

  • MrMarcie
  • Registratie: Oktober 2006
  • Laatst online: 04-10 14:02

MrMarcie

CFMoto 650MT

R4gnax schreef op maandag 11 juni 2018 @ 21:18:
[...]


../..

En Bootstrap is echt niet toereikend als je naar de andere onderdelen gaat kijken. Zodra je ook maar iets speciaals wilt in je stijl van knoppen, formulier-elementen, etc. is het vechten tegen de bierkaai of je schouders ophalen, Bootstrap negeren en het er gewoon zelf naast bouwen.

../..
https://getbootstrap.com/docs/3.3/customize/

Dat is dan de oude BS, maar voor BS4 geldt zelfde, wat css aanpassingen en je styled alles zo je wilt. Geeft je verder een goede basis en je kan nog steeds je creativiteit de vrije loop laten.

En grid is ook heerlijk, maar blijft gewoon keuzes maken per project en budget.

[ Voor 5% gewijzigd door MrMarcie op 13-06-2018 00:52 ]

For sale | "Goodbyes are only for those who love with their eyes. Because for those who love with heart and soul there is no such thing as separation" Rumi


Acties:
  • +2 Henk 'm!

  • b2vjfvj75gjx7
  • Registratie: Maart 2009
  • Niet online
Je kan gewoon basic Bootstrap downloaden en daarna alles stylen zoals je zelf wilt... niemand ziet aan de buitenkant (als je het goed doet) dat de 'achterkant' Bootstrap is.

Natuurlijk is Bootstrap niet 100% goed, maar PHP is ook klote feitelijk (want... Phyton), en SQL is helemaal niets (want... Mongo-DB) en wacht jQuery... extreem slecht, want... (insert-hipster-library)... en laten we het over WordPress maar helemaal niet hebben (want... Kirby, Jekkyl, Grav, Craft).

Maar de combi van WordPress + PHP + Bootstrap + SQL + jQuery heeft één groot voordeel;

Het is extreem schaalbaar en overdraagbaar naar andere developers (want iedereen beheerst het).

Support is al bijna 10 jaar (of meer) goed, open-source en dus kan je er - letterlijk - op bouwen.

Kan je wel met een 'slick fast structured no-overhead custom-made-design-architecture' aankomen die in de regel 5% minder code heeft en 1.5% sneller presteert... maar als je een project overdraagt of zelf moet gaan extenden, wil je niet wéér het wiel opnieuw uitvinden.

Been there, done that (web-developer sinds 1993).

- edit - waar ik dan geen voorstander van ben, maar dat is de leeftijd, zijn die Boostrap-Builders waarmee je componenten in elkaar kan klikken.

Wel handig voor prototyping - maar dan kan je ook een IDE met snippets gebruiken.

Aan de andere kant; je kan onderstaande proberen, de src-code downen en daarna inspecteren... leer je ook veel van!

https://bootstrapstudio.io/

https://pingendo.com/

https://www.layoutit.com/

https://bootstrap.build/

Allemaal OS-agnostisch, wat ook wel weer prettig is.

[ Voor 19% gewijzigd door b2vjfvj75gjx7 op 13-06-2018 01:03 ]


Acties:
  • 0 Henk 'm!

  • R4gnax
  • Registratie: Maart 2009
  • Laatst online: 06-09 17:51
MrMarcie schreef op woensdag 13 juni 2018 @ 00:47:
[...]

Dat is dan de oude BS, maar voor BS4 geldt zelfde, wat css aanpassingen en je styled alles zo je wilt. Geeft je verder een goede basis en je kan nog steeds je creativiteit de vrije loop laten.
Ok. Geef mij een input met een icoon inset binnen in het kader van de input, aan de linkerzijde, en een optioneel present check/cross icoon wat de validatie-status van de invoer aangeeft aan de rechterzijde. In beide gevallen dus aan de binnenzijde van de input.

Verder graag het kader van de input laten oplichten bij hover, en er een duidelijkere rand omheen zetten bij focus. Het icoon wat aan de linkerzijde staat moet meekleuren met het kader van de input.


"alles zo je wilt"; had je gedacht. De afkorting van Bootstrap zegt het al: BS.
Het enige wat BootStrap je geeft is een set variables om kleurtjes, font-size, border-radius, etc. te skinnen. Maar zodra je buiten dat systeem moet gaan, wordt het zelfbouw of vechten tegen het systeem dat Bootstrap je afdwingt.
MrMarcie schreef op woensdag 13 juni 2018 @ 00:47:
En grid is ook heerlijk, maar blijft gewoon keuzes maken per project en budget.
Lees eens wat over het concept intrinsic design, o.a. gepromoot door Jen Simmons.

Fixed grids die de grootte dicteren welke content in mag nemen, zijn oud en achterhaald.

[ Voor 34% gewijzigd door R4gnax op 14-06-2018 19:52 ]


Acties:
  • 0 Henk 'm!

  • MrMarcie
  • Registratie: Oktober 2006
  • Laatst online: 04-10 14:02

MrMarcie

CFMoto 650MT

R4gnax schreef op donderdag 14 juni 2018 @ 19:44:
[...]


Ok. Geef mij een input met een icoon inset binnen in het kader van de input, aan de linkerzijde, en een optioneel present check/cross icoon wat de validatie-status van de invoer aangeeft aan de rechterzijde. In beide gevallen dus aan de binnenzijde van de input.

Verder graag het kader van de input laten oplichten bij hover, en er een duidelijkere rand omheen zetten bij focus. Het icoon wat aan de linkerzijde staat moet meekleuren met het kader van de input.


"alles zo je wilt"; had je gedacht. De afkorting van Bootstrap zegt het al: BS.
Het enige wat BootStrap je geeft is een set variables om kleurtjes, font-size, border-radius, etc. te skinnen. Maar zodra je buiten dat systeem moet gaan, wordt het zelfbouw of vechten tegen het systeem dat Bootstrap je afdwingt.


[...]


Lees eens wat over het concept intrinsic design, o.a. gepromoot door Jen Simmons.

Fixed grids die de grootte dicteren welke content in mag nemen, zijn oud en achterhaald.
Bedoel je zoiets? Zoekbalkje rechtsboven. Maar je vraag heeft niet zozeer met BS te maken denk ik maar met een lastig issue waar je zo wie zo mee te kampen hebt als je wilt wat jij vraagt. Maar kan zeker.

Tsja, die nieuwe zaken zijn erg leuk, maar wel voor bepaalde doelgroep. Heeft allemaal met budget te maken, maar de ontwikkelingen zijn wel erg mooi. Gaat de goede kant op. Helaas denken veel klanten -en onwerpers- nog vaak in oude drukwerk opmaken.

Die Jen Simmons ga ik bekijken, alleen die site van d'r geeft wel een error :F. Heb haar al geinformeerd.
Afbeeldingslocatie: https://tweakers.net/ext/f/oJr2O26VYh2Dr62arR4YXZHZ/thumb.jpg

For sale | "Goodbyes are only for those who love with their eyes. Because for those who love with heart and soul there is no such thing as separation" Rumi


Acties:
  • 0 Henk 'm!

  • Stoelpoot
  • Registratie: September 2012
  • Niet online
b2vjfvj75gjx7 schreef op woensdag 13 juni 2018 @ 00:59:
Je kan gewoon basic Bootstrap downloaden en daarna alles stylen zoals je zelf wilt... niemand ziet aan de buitenkant (als je het goed doet) dat de 'achterkant' Bootstrap is.

Natuurlijk is Bootstrap niet 100% goed, maar PHP is ook klote feitelijk (want... Phyton), en SQL is helemaal niets (want... Mongo-DB) en wacht jQuery... extreem slecht, want... (insert-hipster-library)... en laten we het over WordPress maar helemaal niet hebben (want... Kirby, Jekkyl, Grav, Craft).

Maar de combi van WordPress + PHP + Bootstrap + SQL + jQuery heeft één groot voordeel;

Het is extreem schaalbaar en overdraagbaar naar andere developers (want iedereen beheerst het).

Support is al bijna 10 jaar (of meer) goed, open-source en dus kan je er - letterlijk - op bouwen.

Kan je wel met een 'slick fast structured no-overhead custom-made-design-architecture' aankomen die in de regel 5% minder code heeft en 1.5% sneller presteert... maar als je een project overdraagt of zelf moet gaan extenden, wil je niet wéér het wiel opnieuw uitvinden.

Been there, done that (web-developer sinds 1993).

- edit - waar ik dan geen voorstander van ben, maar dat is de leeftijd, zijn die Boostrap-Builders waarmee je componenten in elkaar kan klikken.

Wel handig voor prototyping - maar dan kan je ook een IDE met snippets gebruiken.

Aan de andere kant; je kan onderstaande proberen, de src-code downen en daarna inspecteren... leer je ook veel van!

https://bootstrapstudio.io/

https://pingendo.com/

https://www.layoutit.com/

https://bootstrap.build/

Allemaal OS-agnostisch, wat ook wel weer prettig is.
Allemaal mee eens. Bootstrap is inderdaad lelijk, je krijgt er rampzalige divs door, en het gaat tegen een paar principes in (mixing markup with styling).

Aan de andere kant is Bootstrap gewoon hartstikke simpel om mee te werken, bijzonder goed gedocumenteerd (en met oneindig meer docs dan het gemiddelde interne project), goed uitbreidbaar, stylebaar, gemakkelijk om te leren, en zeker voor een wat simpelere website gemaakt las hobby / sideproject gewoon erg fijn omdat je zo veel gratis krijgt.

Acties:
  • 0 Henk 'm!

  • R4gnax
  • Registratie: Maart 2009
  • Laatst online: 06-09 17:51
MrMarcie schreef op vrijdag 15 juni 2018 @ 11:50:
[...]


Bedoel je zoiets? Zoekbalkje rechtsboven.
Die werkt op basis van een achtergrondplaatje. base64 png, die uitgewisseld wordt met een anders gekleurde PNG bij focus. Dat werkt bijna goed, maar helaas: de default rechter-padding komt niet goed uit en ingevulde tekst loopt dus over het icoon heen. Daar moet dus nog iets van een extra special case toegevoegd worden.

Die aanpak 'werkt' voor een enkele one-off maar schaalt totaal niet voor een gegeneraliseerde component. Voor zowel het icoon in kwestie als voor iedere individuele kleur heb je een nieuw achtergrondplaatje nodig. En het ondersteunt ook nooit kleur-transities op basis van de transition CSS property, wat nogal eens gewenst is.

offtopic:
Kennelijk heeft het bureau wat dit gedesigned heeft ook nog nooit van het placeholder attribuut gehoord, want ze gebruiken JavaScript (inline event handlers zelfs ::kots:: ) om de value dynamisch met een placeholder-tekst uit te wisselen.


MrMarcie schreef op vrijdag 15 juni 2018 @ 11:50:
Maar je vraag heeft niet zozeer met BS te maken denk ik maar met een lastig issue waar je zo wie zo mee te kampen hebt als je wilt wat jij vraagt. Maar kan zeker.
Nee. Mijn stelling illustreer ik met een voorbeeld wat niet goed binnen de geboden structuren van BootStrap op te lossen is. En waarbij je met het framework moet gaan lopen vechten als je het toch er binnen op wilt lossen.

En het is echt geen vreemd UI design of zo, hoor. Alleen vreemd om het bij dertien-in-een-dozijn BootStrap sites terug te vinden. Juist omdat het niet binnen BootStrap gefaciliteerd wordt.

[ Voor 3% gewijzigd door R4gnax op 18-06-2018 22:26 ]


Acties:
  • +2 Henk 'm!

  • Finder
  • Registratie: Januari 2007
  • Laatst online: 23-09 12:53
botwood schreef op zondag 10 juni 2018 @ 21:55:
[...]


Je zou ook eens kunnen kijken naar Bulma of wat ik nog wel veel gebruik is Susy of Profounder grid.
De maker van Susy grids raad tegenwoordig zelf het gebruik van zijn eigen grid systeem af. Bron: YouTube: DjangoCon US 2017 - Don't Use My Grid System (or any others) by ...

Ik heb erg veel Bootstrap gebruikt in het verleden maar ga nu zelf ook meer voor de 'vanilla' oplossing, zowel in javascript als in CSS.

Verdiep je eens grondig in CSS Grid & Flexbox en je hebt helemaal geen Bootstrap meer nodig.

Acties:
  • 0 Henk 'm!

  • MrMarcie
  • Registratie: Oktober 2006
  • Laatst online: 04-10 14:02

MrMarcie

CFMoto 650MT

Finder schreef op maandag 25 juni 2018 @ 17:22:
[...]


De maker van Susy grids raad tegenwoordig zelf het gebruik van zijn eigen grid systeem af. Bron: YouTube: DjangoCon US 2017 - Don't Use My Grid System (or any others) by ...
Is het niet haar? Of zijn we dan weer teveel in hokjes bezig. Anyway, informatieve video.

For sale | "Goodbyes are only for those who love with their eyes. Because for those who love with heart and soul there is no such thing as separation" Rumi


Acties:
  • 0 Henk 'm!

  • botwood
  • Registratie: November 2017
  • Laatst online: 27-09 21:33
Finder schreef op maandag 25 juni 2018 @ 17:22:
[...]


De maker van Susy grids raad tegenwoordig zelf het gebruik van zijn eigen grid systeem af. Bron: YouTube: DjangoCon US 2017 - Don't Use My Grid System (or any others) by ...

Ik heb erg veel Bootstrap gebruikt in het verleden maar ga nu zelf ook meer voor de 'vanilla' oplossing, zowel in javascript als in CSS.

Verdiep je eens grondig in CSS Grid & Flexbox en je hebt helemaal geen Bootstrap meer nodig.
Thanks voor het filmpje. :*)

Acties:
  • 0 Henk 'm!

  • Finder
  • Registratie: Januari 2007
  • Laatst online: 23-09 12:53
Ja het filmpje is echt een aanrader, zelfs voor iemand die al heel lang CSS schrijft, gaf het mij andere inzichten.

Om terug te komen op de discussie; Bootstrap is nuttig vooral voor legacy-systemen waar backwards-support en onderhoud in een team belangrijk is. Het voeg echter een enorme laag van abstractie toe, en enorm veel load en fluff in de code.

Een zeer ervaren en deftige front-end developer kan met een fractie van de code een snellere betere site schrijven, als dat belangrijk voor je is.

Ik train enorm veel beginners, en vooral 'noobs' rennen naar frameworks omdat het er zo leuk uitziet. Wat mensen vergeten is dat je nog steeds de basis moet kennen; het boxmodel, hoe CSS werkt. Dat is vaak een probleem met mensen die direct Bootstrap gaan gebruiken of die op zoek zijn naar drag-and-drop-builders voor WordPress.

Als dat allemaal geen rol speelt; installeer een WordPress met een populair thema en installeer een page-builder. Je site gaat werken, ziet er prima uit, en met wat caching zal het toch wel 'rap genoeg zijn'.

Acties:
  • +1 Henk 'm!

  • Finder
  • Registratie: Januari 2007
  • Laatst online: 23-09 12:53
MrMarcie schreef op vrijdag 15 juni 2018 @ 11:50:
[...]


Bedoel je zoiets? Zoekbalkje rechtsboven. Maar je vraag heeft niet zozeer met BS te maken denk ik maar met een lastig issue waar je zo wie zo mee te kampen hebt als je wilt wat jij vraagt. Maar kan zeker.

Tsja, die nieuwe zaken zijn erg leuk, maar wel voor bepaalde doelgroep. Heeft allemaal met budget te maken, maar de ontwikkelingen zijn wel erg mooi. Gaat de goede kant op. Helaas denken veel klanten -en onwerpers- nog vaak in oude drukwerk opmaken.

Die Jen Simmons ga ik bekijken, alleen die site van d'r geeft wel een error :F. Heb haar al geinformeerd.
[afbeelding]
Jen Simmons is echt een aanrader. Ze heeft een fantastisch Youtube-kanaal 'Layout World' ofzoiets. Must-see. Andere madame die je moet volgen is Rachel Andrews. Zij geeft fantastische talks over CSS Grid.

Acties:
  • 0 Henk 'm!

  • MrMarcie
  • Registratie: Oktober 2006
  • Laatst online: 04-10 14:02

MrMarcie

CFMoto 650MT

Finder schreef op dinsdag 26 juni 2018 @ 10:01:
[...]


Jen Simmons is echt een aanrader. Ze heeft een fantastisch Youtube-kanaal 'Layout World' ofzoiets. Must-see. Andere madame die je moet volgen is Rachel Andrews. Zij geeft fantastische talks over CSS Grid.
jen simmons layout land
Rachel Andrew Deze kende ik nog niet.

For sale | "Goodbyes are only for those who love with their eyes. Because for those who love with heart and soul there is no such thing as separation" Rumi


Acties:
  • 0 Henk 'm!

  • Finder
  • Registratie: Januari 2007
  • Laatst online: 23-09 12:53
Wat ik nog vergeten was om toe te voegen; als je snelle, geoptimaliseerde sites wil bouwen die Google leuk vind, wil je wellicht Bootstrap vermijden.

Als je websites gaat optimaliseren voor AMP (accelerated mobile pages) dan raad Google zelfs af om een framework te gebruiken omdat je dan een CSS file limit hebt.

Denk dus goed na voordat je begint of het wel een verstandige oplossing is.
Meer informatie daarover: YouTube: Use AMP HTML with Your Existing Site

Acties:
  • 0 Henk 'm!

  • R4gnax
  • Registratie: Maart 2009
  • Laatst online: 06-09 17:51
Finder schreef op woensdag 27 juni 2018 @ 17:11:
Wat ik nog vergeten was om toe te voegen; als je snelle, geoptimaliseerde sites wil bouwen die Google leuk vind, wil je wellicht Bootstrap vermijden.

Als je websites gaat optimaliseren voor AMP (accelerated mobile pages) dan raad Google zelfs af om een framework te gebruiken omdat je dan een CSS file limit hebt.

Denk dus goed na voordat je begint of het wel een verstandige oplossing is.
Meer informatie daarover: YouTube: Use AMP HTML with Your Existing Site
AMP is ook weer een wassen neus. De snelheidswinst zit hem daar voornamelijk in enorm snelle levering van data via Google's distributed CDN. Als je die factor weghaalt (en dus AMP gebruikt zonder CDN) hoef je niet eens het onderste uit te kan te halen om met eigen bouw al iets te produceren met betere time-to-first-interactive scores.

Acties:
  • 0 Henk 'm!

  • zjoskebest1
  • Registratie: Januari 2016
  • Laatst online: 14-07-2021
Het lijkt dat Bootstrap een snelle manier is een website op te stellen als je goed thuis bent in CSS / html en uiteraard toepassingskennis van bootstrap. Maar als je een website opzet dan moet er altijd gegevens opgeslagen worden zoals bijv. NAW en leeftijd en noem ze maar....... Je heb dan een database nodig . Hoe koppel je een database aan bootstrap ,
groet Jos

Acties:
  • 0 Henk 'm!

  • R4gnax
  • Registratie: Maart 2009
  • Laatst online: 06-09 17:51
zjoskebest1 schreef op zaterdag 21 juli 2018 @ 22:33:
Het lijkt dat Bootstrap een snelle manier is een website op te stellen als je goed thuis bent in CSS / html en uiteraard toepassingskennis van bootstrap. Maar als je een website opzet dan moet er altijd gegevens opgeslagen worden zoals bijv. NAW en leeftijd en noem ze maar....... Je heb dan een database nodig . Hoe koppel je een database aan bootstrap ,
groet Jos
Uhmm... Nee?

Bootstrap is een snelle manier om de user interface voor dertien-in-een-dozijn line-of-business web-applicaties in elkaar te laten rammen door een setje niet met web-frontend ervaren software-ontwikkelaars die vooral geen tijd willen spenderen aan kennis-opbouw. Het is zeg maar een soort paint-by-numbers.


En die overgang naar het database verhaal? Dat ziet er eerlijk gezegd uit alsof je niet eens de klok hebt horen luiden, laat staan dat je de klepel weet te hangen. Dus daar zullen we maar niet op in gaan.

Acties:
  • 0 Henk 'm!

Verwijderd

Tis zeker warm in nederland.
Pagina: 1