Checking if CSS Flexbox, CSS Grid or Bootstrap 4 should be used?



https://i.ytimg.com/vi/IqeLoGEbXyI/hqdefault.jpg



Learn web development fast: https://shop.killervideostore.com/
New cool language features come out all the time, but it often takes time before you can use them in real-world websites and web apps. How do you check?

Links:
https://caniuse.com/#search=flex
https://getbootstrap.com/

Learn Python 3 fast: http://www.killervideostore.com/python/
Complete Entrepreneur Course: https://goo.gl/kpVUD2
My Instagram: https://www.instagram.com/stefanmischook/?hl=en

Thanks!

Stef

Original source


33 responses to “Checking if CSS Flexbox, CSS Grid or Bootstrap 4 should be used?”

  1. As a budding designer/developer, I'd like to say that I think grid/flexbox represent a new web standard that doesn't require hacks to put up a web page. Rachel Andrew, who wrote the grid spec, and Jen Simmons, who are at the forefront of css, both say that this is the first time that one can do web pages without needing hacks that frameworks such as bootstrap became popular for dealing with all the shims and tricks for dealing with incompatibilities in different browsers. Browser compatibility is about 90%, and I accept the fact that fallbacks are in order for browsers that don't have the new support. But I feel that learning the new paradigm will save time/effort of having to learn the old hacks, and then having to learn the new system without the old hacks. Both Andrew and Simmons say that frameworks are obsolete if you use grid/flexbox tools. I just feel it will save me time if I learn one system well, which is the one looking forward, and without all the hacks of the past.

  2. BS – Have 2 old XP machines humming away as print and file servers. Both have latest Chrome / Firefox installed. Any companies with policies that require in-house machines run ancient browsers are charged accordingly for intranet applications.

    Individuals needing to update / upgrade in order to fully leverage tech on internet sites uses can simply be messaged and instructed how to do so. Building today FOR tomorrow ~ NOT yesterday.

  3. I build a whole software product using Bootstrap3, it is on the market and selling. Now that Bootstrap4 is absolutely NOT backward-compatible with Bootstrap3 code and class names, etc(they purportedly made it this way). it may be time to watch this flexbox and see what can we do to move our code to it, maybe. I worry that Bootstrap3 may be killed and I would have a product bound to a dying platform. What do you think?

  4. I wonder how many of the 14% use chrome in windows XP or Windows 8.1. And if chrome is compatible with Grid even in those operating systems? I do know even chrome in XP gives a warning that chrome is not supported any longer.

  5. Honestly, Bootstrap 4 is pretty great, but I've found myself still needing to use Bootstrap 3 as recently as last month to make sure I supported internet explorer. I'm confused about the math in the video though. Windows 8.1 is still supported and has the latest version of internet explorer. You are right about the Windows XP statistics though at 7%. It should also be noted that depending on your business, it may not end up making up 7% of your users. It could still be as low as 1-2% or higher than 7%.

  6. I avoid CSS grids because it's not mainstream yet. I abuse Flexbox though. It's the bomb! I know I have to do some tweaking for IE but I generally don't have to jump through too many hoops. Grids on the other hand is a hot mess in IE.

  7. I created Cordova/Phonegap app for IOS and Android. I used CSS Grid on my layouts. BIG MISTAKE! 50% of test users had older phones (iPhone 4's and so on) and found out their Safari was really old and did not support CSS Grid

  8. good points; though I believe you can easily check for CSS grid support in a browser with something like @supports and use this to provide CSS for older browsers a bit like a media query. Joomla which is a little conservative, is still on bootstrap 3, but its soon to switch to bootstrap 4 if that's any indicator of compatibility. The reason I'd use bootstrap is for things like forms which last I checked are still not as standardised as Google makes out across browsers.

  9. Protip: Use Grid and Flexbox, because that will increase your development speed by many many times. Avoid them in the mobile version and use the @support tag in CSS to check if the browser supports Grid and Flexbox. If it doesn't, show them the mobile version (which often doesn't require grid or flexbox).

  10. I absolutely love the shit out of flexbox and grid now that I started using them, Bootstrap grids? meh, never been that big a fan of third-party libraries, something that really bugs me tho, is the guilt, that I seem to neglect old browser, I never really bothered how my websites look outside of chrome, I know this is a virtue, and I'd love to see a video of you talking about how important it is to be compatible with old tech, should we, the developers spend time supporting old tech (that I personally believe is holding down the advancements)? or should the people that are outdated get their stuff to date and make it easier for us.

    Great video as always Stef, keep 'em coming 👍.

  11. Thanks Stefan for all this very interesting content and views from the Business side of the Industry.
    Could you please do a video about Flutter vs PWA?
    Maybe the Pros and Cons for each?
    Part of me fears that Employers will go PWA for the sake of speed and cost (as one guy will be able to do your Website and Android/iOS App).
    Thanks a lot and keep up with the great work and content you deliver!!

  12. In my opinion, a Flex box and grid combo is all you really need anymore if you're not ok with vanilla CSS.

    Both are more than capable of accomplishing what others do with Bootstrap, require less code and they are easier for newcomers to learn than Bootstrap.

Leave a Reply