Frontend Web UI Framework Options: Difference between revisions

From Littledamien Wiki
Jump to navigation Jump to search
(Created page with "Category:HTML Category:CSS Category:Web Development == Twitter Bootstrap == === Pros === * Comprehensive and solidly engineered. === Cons === * Class name cha...")
 
 
(5 intermediate revisions by the same user not shown)
Line 15: Line 15:
=== Pros ===
=== Pros ===


* Lightweight
* Lightweight<br />''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
* Easy to apply a custom look to a site built with Foundation


Line 21: Line 21:


* Reported to not be as well engineered as Bootstrap
* 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 ==
* [http://materializecss.com Source]
=== Pros ===
* Designed using Google's [https://www.google.com/design/spec/material-design/introduction.htm Material design] principles
* Clear documentation
* Tuned performance in its JavaScript
* Focused set of features, i.e. not bloated
== Semantic-UI ==
* [http://semantic-ui.com Semantic UI website]
=== Installation ===
<syntaxhighlight lang="bash">
$ npm install semantic-ui --save-dev
</syntaxhighlight>
Then JavaScript and CSS are compiled with `gulp`.
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
* Built with Less.
== Skeleton ==
* [http://getskeleton.com Source]
=== Pros ===
* Ultra lightweight.
== UIKit ==
== UIKit ==


Line 27: Line 74:


* [http://www.sitepoint.com/delving-uikit/ Delving Into UIKit] (Sitepoint)
* [http://www.sitepoint.com/delving-uikit/ Delving Into UIKit] (Sitepoint)
== Notes ==
=== External links ===
* [https://www.coderedcorp.com/blog/a-comparison-of-responsive-web-frameworks-in-2015/ A Comparison of Responsive Web Frameworks in 2015] - CodeRed

Latest revision as of 14:55, 5 December 2015

Twitter Bootstrap[edit]

Pros[edit]

  • Comprehensive and solidly engineered.

Cons[edit]

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

Foundation[edit]

Pros[edit]

  • 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[edit]

  • 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[edit]

Pros[edit]

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

Semantic-UI[edit]

Installation[edit]

$ npm install semantic-ui --save-dev

Then JavaScript and CSS are compiled with gulp.

There are also Git repos for CSS and Less distributions.

Pros[edit]

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

Cons[edit]

  • Non-traditional CSS syntax
  • Built with Less.

Skeleton[edit]

Pros[edit]

  • Ultra lightweight.

UIKit[edit]

External links[edit]

Notes[edit]

External links[edit]

Retrieved from "https://wiki.dbarchowsky.com/index.php?title=Frontend_Web_UI_Framework_Options&oldid=1661"