Frontend Web UI Framework Options: Difference between revisions

From Littledamien Wiki
Jump to navigation Jump to search
Line 39: Line 39:
== Semantic-UI ==
== Semantic-UI ==


* [http://semantic-ui.com Source]
* [http://semantic-ui.com Semantic UI website]
 
=== Installation ===
 
<syntaxhighlight lang="bash">
$ npm install semantic-ui --save-dev
</syntaxhighlight>
 
There are also Git repos for CSS and Less distributions.


=== Pros ===
=== Pros ===

Revision as of 14:51, 5 December 2015

Twitter Bootstrap

Pros

  • Comprehensive and solidly engineered.

Cons

  • Class name changes between versions requiring refactoring
  • Difficult to override styles to make a site not look derivative of Bootstrap

Foundation

Pros

  • Lightweight
    Actually, I don't think this is true. It requires some time to install and configure. It also has a need to control the web project, and so doesn't exist easily with other technology (e.g. Django).
  • Easy to apply a custom look to a site built with Foundation

Cons

  • Reported to not be as well engineered as Bootstrap
  • Relies on jQuery for many components (i.e. all you get is the grid if you want to use Angular)
  • Non-trivial installation (for the Sass install)
  • Doesn't exist easily with things like Django.
  • A lot of prerequisites

Materialize

Pros

  • Designed using Google's Material design principles
  • Clear documentation
  • Tuned performance in its JavaScript
  • Focused set of features, i.e. not bloated

Semantic-UI

Installation

$ npm install semantic-ui --save-dev

There are also Git repos for CSS and Less distributions.

Pros

  • Feature complete compared to other frameworks.
  • Inherent support for dimmers, flags, feeds, 3-dimensional cards

Cons

  • Non-traditional CSS syntax

Skeleton

Pros

  • Ultra lightweight.

UIKit

External links

Notes

External links