{"id":203,"date":"2018-05-01T17:36:17","date_gmt":"2018-05-01T17:36:17","guid":{"rendered":"https:\/\/ucsbwebdev.fzilla.com\/?p=203"},"modified":"2018-05-07T17:34:53","modified_gmt":"2018-05-07T17:34:53","slug":"css-frameworks-review","status":"publish","type":"post","link":"https:\/\/ucsbwebdev.fzilla.com\/?p=203","title":{"rendered":"CSS Frameworks Review"},"content":{"rendered":"<p>I will focus on 4 Frameworks that we should consider, each was chosen for what it offers compared to the rest. To use the include code provided below simply place the entire contents inside your head!<\/p>\n<h2>Frameworks<\/h2>\n<ul>\n<li>\n<h3><strong>Bulma<br \/>\n<\/strong><em style=\"font-size: 16px; font-weight: 400;\"><a href=\"https:\/\/bulma.io\/\">Website<\/a> \/ <a href=\"https:\/\/bulma.io\/documentation\/\">Documentation<\/a><\/em><\/h3>\n<ul>\n<li>Key Points\n<ul>\n<li>A balance between simplicity and aesthetics<\/li>\n<\/ul>\n<\/li>\n<li>Useful links\n<ul>\n<li><a href=\"https:\/\/www.youtube.com\/watch?v=I8ezFcJ6AeM\">https:\/\/www.youtube.com\/watch?v=I8ezFcJ6AeM<\/a><\/li>\n<li><a href=\"https:\/\/www.youtube.com\/watch?v=IiPQYQT2-wg\">https:\/\/www.youtube.com\/watch?v=IiPQYQT2-wg<\/a><\/li>\n<li><a href=\"https:\/\/www.youtube.com\/watch?v=MchBPICewgs\">https:\/\/www.youtube.com\/watch?v=MchBPICewgs<\/a><\/li>\n<\/ul>\n<\/li>\n<li><strong><strong>Include code:<br \/>\n<\/strong><\/strong><\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">\u00a0&lt;link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/bulma\/0.7.1\/css\/bulma.min.css\"&gt;<\/pre>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<h3>Bootstrap<br \/>\n<em style=\"font-size: 16px; font-weight: 400;\"><a href=\"http:\/\/getbootstrap.com\/\">Website<\/a> \/ <a href=\"http:\/\/getbootstrap.com\/docs\/4.1\/getting-started\/introduction\/\">Documentation<\/a><\/em><\/h3>\n<ul>\n<li>Key Points\n<ul>\n<li>Advanced framework with a decent learning curve<\/li>\n<li>Utilized by a huge % of Themes you can buy, meaning if you plan to use a theme learn\/use it<\/li>\n<\/ul>\n<\/li>\n<li>Useful links\n<ul>\n<li><a href=\"https:\/\/www.youtube.com\/watch?v=Zn64_IVLO88\">https:\/\/www.youtube.com\/watch?v=Zn64_IVLO88<\/a><\/li>\n<li><a href=\"https:\/\/www.youtube.com\/watch?v=eIWRbvE1B2E\">https:\/\/www.youtube.com\/watch?v=eIWRbvE1B2E<\/a><\/li>\n<li><a href=\"https:\/\/www.youtube.com\/watch?v=9cKsq14Kfsw\">https:\/\/www.youtube.com\/watch?v=9cKsq14Kfsw<\/a><\/li>\n<\/ul>\n<\/li>\n<li><strong><strong>Include code:<br \/>\n<\/strong><\/strong><\/p>\n<pre class=\"EnlighterJSRAW\">&lt;link rel=\"stylesheet\" href=\"https:\/\/stackpath.bootstrapcdn.com\/bootstrap\/4.1.1\/css\/bootstrap.min.css\" integrity=\"sha384-WskhaSGFgHYWDcbwN70\/dfYBj47jz9qbsMId\/iRN3ewGhXQFZCSftd1LZCfmhktB\" crossorigin=\"anonymous\"&gt;\r\n&lt;script src=\"https:\/\/code.jquery.com\/jquery-3.3.1.slim.min.js\" integrity=\"sha384-q8i\/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo\" crossorigin=\"anonymous\"&gt;&lt;\/script&gt; &lt;script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/popper.js\/1.14.3\/umd\/popper.min.js\" integrity=\"sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK\/l8WvCWPIPm49\" crossorigin=\"anonymous\"&gt;&lt;\/script&gt; &lt;script src=\"https:\/\/stackpath.bootstrapcdn.com\/bootstrap\/4.1.1\/js\/bootstrap.min.js\" integrity=\"sha384-smHYKdLADwkXOn1EmN1qk\/HfnUcbVRZyYmZ4qpPea6sjB\/pTJ0euyQp0Mk8ck+5T\" crossorigin=\"anonymous\"&gt;&lt;\/script&gt;<\/pre>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<h3>Milligram<br \/>\n<em style=\"font-size: 16px; font-weight: 400;\"><a href=\"https:\/\/milligram.io\/#getting-started\">Website<\/a> \/ <a href=\"https:\/\/milligram.io\/#typography\">Documentation<\/a><\/em><\/h3>\n<ul>\n<li>Key Points\n<ul>\n<li>Super minimal framework and aesthetic<\/li>\n<\/ul>\n<\/li>\n<li><strong><strong>Include code:<br \/>\n<\/strong><\/strong><\/p>\n<pre class=\"EnlighterJSRAW\">&lt;link rel=\"stylesheet\" href=\"\/\/fonts.googleapis.com\/css?family=Roboto:300,300italic,700,700italic\"&gt; &lt;link rel=\"stylesheet\" href=\"\/\/cdn.rawgit.com\/necolas\/normalize.css\/master\/normalize.css\"&gt; &lt;link rel=\"stylesheet\" href=\"\/\/cdn.rawgit.com\/milligram\/milligram\/master\/dist\/milligram.min.css\"&gt;<\/pre>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<h3>UIKit<br \/>\n<em style=\"font-size: 16px; font-weight: 400;\"><a href=\"https:\/\/getuikit.com\">Website<\/a> \/ <a href=\"https:\/\/getuikit.com\/docs\/comment\">Documentation<\/a><\/em><\/h3>\n<ul>\n<li style=\"list-style-type: none;\">\n<ul>\n<li>Key Points\n<ul>\n<li>Perfect for building an actual web application like\n<ul>\n<li>Idea posting site (with comments etc)<\/li>\n<li>Travel planning site<\/li>\n<\/ul>\n<\/li>\n<li>Basically, anything that isn&#8217;t a normal web page, but rather a functional system<\/li>\n<\/ul>\n<\/li>\n<li>Useful links\n<ul>\n<li><a href=\"https:\/\/www.youtube.com\/watch?v=shFCueCxoqM\">https:\/\/www.youtube.com\/watch?v=shFCueCxoqM<\/a><\/li>\n<\/ul>\n<\/li>\n<li><strong><strong>Include code:<br \/>\n<\/strong><\/strong><\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"null\">\u00a0&lt;!-- UIkit CSS --&gt; &lt;link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/uikit\/3.0.0-beta.42\/css\/uikit.min.css\" \/&gt; &lt;!-- UIkit JS --&gt; &lt;script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/uikit\/3.0.0-beta.42\/js\/uikit.min.js\"&gt;&lt;\/script&gt; &lt;script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/uikit\/3.0.0-beta.42\/js\/uikit-icons.min.js\"&gt;&lt;\/script&gt;<\/pre>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>I will focus on 4 Frameworks that we should consider, each was chosen for what it offers compared to the rest. To use the include code provided below simply place the entire contents inside your head! Frameworks Bulma Website \/ Documentation Key Points A balance between simplicity and aesthetics Useful links https:\/\/www.youtube.com\/watch?v=I8ezFcJ6AeM https:\/\/www.youtube.com\/watch?v=IiPQYQT2-wg https:\/\/www.youtube.com\/watch?v=MchBPICewgs Include [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-203","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"post_mailing_queue_ids":[],"_links":{"self":[{"href":"https:\/\/ucsbwebdev.fzilla.com\/index.php?rest_route=\/wp\/v2\/posts\/203","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ucsbwebdev.fzilla.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ucsbwebdev.fzilla.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ucsbwebdev.fzilla.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ucsbwebdev.fzilla.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=203"}],"version-history":[{"count":5,"href":"https:\/\/ucsbwebdev.fzilla.com\/index.php?rest_route=\/wp\/v2\/posts\/203\/revisions"}],"predecessor-version":[{"id":228,"href":"https:\/\/ucsbwebdev.fzilla.com\/index.php?rest_route=\/wp\/v2\/posts\/203\/revisions\/228"}],"wp:attachment":[{"href":"https:\/\/ucsbwebdev.fzilla.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=203"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ucsbwebdev.fzilla.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=203"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ucsbwebdev.fzilla.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=203"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}