I know the title might be a little off but you know what I mean :)
I'm a pure front-end developer and I might be heading into a React project where other developers that are more back-end than me wanna use the CSS framework Tailwind (https://tailwindcss.com).
I have been using BEM with some modifications for a couple of years now and really like it. I can not see why I would wanna use something like Tailwind when I have more freedom and is more effective with BEM?
Am I right when I think Tailwind is great for back-enders who needs to do front-end, but not dedicated front-end developers?
Looking forward to your opinions!
Your question can be rephrased like this Using predefined css VS writing your own css
People use CSS Framework( Tailwind, Bootstrap, Foundation, Bulma,... etc) for Rapid UI Development, where as BEM is just a CSS Naming Convention that can be used with any of the Frameworks above.
It has nothing to do with Backend or Frontend, hope it answers your question.
Related
I have something on my mind for quite a while but couldn't find an answer to it. Consider the following:
You like to build a fancy website with React and have to decide which front-end framework you should use. In my example I have chosen Material-UI.
Now you came to a point where you need more features like a responsive grid system, show/hide styles etc. Instead of implementing them on your own (or copying it from bootstrap/foundation, for example) you think: 'Hey, why wouldn't I include another framework beside Material-UI'.
Now comes the question. I know that most of the css frameworks available have their own normalisation css and basic styles for typography and other elements.
Can I safely include another (more featured) css framework beside Material-UI without breaking fundamental things or should I avoid that?
Furthermore, what is a good practice approach to extend the css features without copying parts from other frameworks and without reinventing the wheel all the time. Did you ever had a case or project where you had to combine multiple front-end frameworks and how did you solve this problem?
Thanks for your feedback.
Cheers
Gregor
FYI, there's a Material Design version of Foundation, you can check it out at http://eucalyptuss.github.io/material-foundation/
Now, talking about your doubts... one should be very careful when mixing and/or using more than one framework at the same time... one issue can be conflict, other can be unnecessary bloating which could make load time heavier.
However, if you are aware of that, most of modern frameworks (as Foundation) can be compiled partially, so you will be loading only the stuff you'll use, minimizing all possible issues.
Have been thinking this exactly thing lately.. I would choose one that has most of the features i need in my project. I usually go just with Bootstrap (sass version) and use only the styling part of that (css grids mostly).
Mixing frameworks will eventually be hard to maintain and you have to include lot of extra (unused) features into your application. When using some "cool", full featured components like Material-UI has, there will still be times when some component doesn't have just the property you would need.
So my opinion is:
Use some framework for styling only. This way you have uniform look in your site. Or even just some responsive grid library could be enough.
Usually basic html components are enough to fill basic needs, you can just build your own custom components for special needs (or use some from npm library). This way you have just the features you need.
This way my site is not depending just some single framework. I can change the styling part anytime, i can change one component to another etc. without having to re-write my whole application just because it's been developed entirely with some "full featured" framework.
Is there a sort of css framework which i can add to a gwt project, and this will completely set a new UI to my gwt application. Sort of changing the look and feel.
I love GWT, but others like Vaadin are so good styled, if there were a complete set of css librarys that would make my app a lot nicer would we great.
I think we can be great developers but not so good designers.
Thanks!
I would recommend starting with http://gwtbootstrap.github.io/
As well as: https://developers.google.com/web-toolkit/doc/latest/DevGuideUiCss
I would then dive deeper into the GWT docs to get a good handle on creating your custom themes. At some point any styling theme/framework will fail your needs and you will need to have some fundamentals for styling yourself.
Personally, I highly recommend using UiBinder and ClientBundle:
https://developers.google.com/web-toolkit/doc/latest/DevGuideUiBinder
http://granitode.wordpress.com/2012/04/19/gwt-uibinder-using-a-clientbundle-with-cssresources/
#fguespe, I'm not aware of something such for example twitter bootstrap that you 'just' plug.
Eventually the 'web designer' needs to know about specific gwt CSS classes that impact the look and feel. If importing the GWT 'non plain' themes, you'll need to write customizations.
Yes indeed Vaadin and GXT provide a default nicer look and feel... Let's just fire all Google devs for a lack of focus :-)
I'm developing a ASP .NET web project that uses: jQuery, jQuery UI, reset/normalize css stylesheets. Most of the CSS is crap, so I'm going to rewrite it + I will have a budget to it :)
I came across two fancy solutions that I would like to learn:
SASS
Bootstrap
I wonder, how to "mix" my existing application with these solution. When it comes to SASS, it seems to me pretty obvious - just rewrite CSS and be proud of new clean meta CSS, however I'm not sure about Bootstrap. What are the advantages of it if I don't want to change the layout of my site?
Another thing: can I run into possible issues when including Bootstrap / SASS into my site?
Twitter Bootstrap (TBS) is a CSS framework and its original purpose was for website and web app prototypes. So if you want to start from scratch with very thorough and well styled CSS, then bootstrap is great.
Twitter Bootstrap is NOT necessarily the right solution if you want to keep the majority of your existing UI, especially if your existing UI doesn't match up well with their scaffolding, grid system, and other elements of their UI styles (forms inputs, buttons, typography etc). You'll find yourself having to override a lot the framework's properties, which kind of defeats the purpose.
As #Nathron mentioned, if you try to mix TBS with your existing code, you could run into conflicts. Creating a customized build of TBS that includes only the elements of their framework that you want would be the best approach there: http://twitter.github.com/bootstrap/customize.html.
Regarding SASS, if you want to use it in combination with TBS, check out https://github.com/jlong/sass-twitter-bootstrap.
From their site: The Boostrap JS is for "interactive components for things like tooltips, popovers, modals, and more". So if you are using any of those, make sure you don't have conflicting JS functions.
You could run into issues with the CSS if your class names are the same as the ones that Bootstrap uses. Many of them are a little obscure like "darkwell", but some of them are common like "dropdown", so you just have to keep an eye out for that.
Easiest way to see is to download it and play around with it :)
I'm trying to decide on technologies for a presentation layer. I have heard Sass talked about enthusiastically but am resistant to learn something new without knowing why it's better than the alternative - in this case plain CSS. Any feedback on Sass would be welcome.
Edit: This is also a good discussion on this:
SASS: The Better, More Powerful CSS
I have a screencast that shows Sass and Compass (the Sass-based stylesheet framework) in action. It's an hour long, but it shows how Sass and Compass work and how they enable new ways of approaching website design by enabling sharing of implementation without compromising the content/presentation boundary.
Yesterday I asked a question here that got more momentum that what I thought it would. Here is the question link since it is related. I am interested now in the possibility of that using two frameworks together will be worst than using a JS framework and CSS from scratch or the other way around.
The question is clear, if you think there are arguments against using a CSS framework like Blueprint CSS please tell me what you think they are.
The main argument is that CSS is not really a programming language. A framework is meant to include reusable functions and data structures. CSS has neither of these constructs. A CSS "framework" is more akin to a template in a word processor. It provides ready-done design work, but it also imposes more constraints than starting from a blank slate.
Incidentally, this was what drove the development of Compass. It's similar to a CSS framework, but instead it uses the CSS metalanguage Sass, which does have functions and variables. Thus rather than (for example) having columns baked into the framework, you can write something like +columns(5) +column-margins(1em) and it will generate the appropriate CSS.
Browser compatibility? We're continually struggling to maintain IE6 support for the 1/3 of our clients that cannot or will not upgrade. Lots of CSS issues.
I use the YUI CSS libraries, but I'm not sure if that counts as a framework.
YUI handles the basics for fonts, layout (grids) and other formatting and makes it consistent across browsers and Operating Systems. It's under a free software license, also.
They also have a very useful interactive grid designer.