{"id":351,"date":"2016-11-24T16:33:54","date_gmt":"2016-11-24T14:33:54","guid":{"rendered":"http:\/\/fatihsoysal.com\/blog\/?p=351"},"modified":"2018-03-01T21:05:12","modified_gmt":"2018-03-01T19:05:12","slug":"en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css","status":"publish","type":"post","link":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/","title":{"rendered":"En \u0130yi Front-End Framework&#8217;lerin Sava\u015f\u0131: Bootstrap ve Materialize CSS"},"content":{"rendered":"<p><strong>Web geli\u015ftiricileri i\u00e7in se\u00e7ebilece\u011finiz \u00e7ok \u00e7e\u015fitli front-end frameworkler sunulmakta. Ancak, daha iyi bir kullan\u0131c\u0131 deneyimi i\u00e7in en iyi front-end framework hangisi? Bu makalede Materialize&#8217;nin nispeten daha pop\u00fcler olan Bootstrap ile nas\u0131l rekabet etti\u011fini \u00f6\u011freneceksiniz&#8230;<\/strong><\/p>\n<p>Web geli\u015ftiricileri olarak\u00a0se\u00e7im yapabilece\u011finiz \u00e7ok say\u0131da front-end framework\u00a0bulunmaktad\u0131r. Bug\u00fcne kadarki en pop\u00fcler tercih <strong><a href=\"http:\/\/getbootstrap.com\/\" target=\"_blank\">Bootstrap\u00a0<\/a><\/strong>oldu.\u00a0Bununla birlikte, \u015f\u0131k kullan\u0131c\u0131 deneyimi ortaya \u00e7\u0131karan\u00a0bir alternatif ar\u0131yorsan\u0131z <strong><a href=\"http:\/\/materializecss.com\/\" target=\"_blank\">Materialize CSS<\/a><\/strong>&#8216;e bir g\u00f6z atmak\u00a0isteyebilirsiniz.<\/p>\n<p>Her iki framework&#8217;\u00fc kar\u015f\u0131la\u015ft\u0131rmak i\u00e7in bilmeniz gerekenleri s\u0131ral\u0131yorum:<\/p>\n<h3><strong>Materialize ve Bootstrap framework&#8217;lerinin ortak \u00f6zellikleri:<\/strong><\/h3>\n<p>Her ikisi de MIT lisansl\u0131d\u0131r.<br \/>\nHer ikisi de (benzer yap\u0131 ve s\u0131n\u0131f adlar\u0131na sahip) 12 s\u00fctun \u00fczerinde \u00e7al\u0131\u015fan bir grid sistemini kullan\u0131yorlar, ancak Bootstrap&#8217;\u0131n bu konuda ek yetenekleri var.<br \/>\nHer ikisinde de bir dizi bile\u015fen ve bir simge seti bulunur.<br \/>\nWeb uygulamalar\u0131nda yap\u0131 CSS, JavaScript ve yaz\u0131 tipleri s\u0131ras\u0131yla css, js ve font klas\u00f6rlerinde saklan\u0131r (varsay\u0131lan olarak).<br \/>\n\u0130kisi de beklenen, duyarl\u0131 d\u00fczenleri sa\u011flar.<br \/>\nHer ikisi de aktif \u015fekilde korunuyor ve destekleniyor. (Twitter ve Google)<\/p>\n<h3><strong>Materialize Hakk\u0131nda Bilmeniz Gerekenler<\/strong><\/h3>\n<p><strong><a href=\"http:\/\/materializecss.com\/\" target=\"_blank\">Materialize<\/a><\/strong>, Google&#8217;\u0131n tasar\u0131m felsefelerini kullan\u0131yor. Buna a\u015fina olmayanlar\u0131n\u0131z i\u00e7in, \u00f6zellikler modern UI tasar\u0131m\u0131n\u0131n basit ama anlaml\u0131 felsefesi \u00fczerine odaklanmakta. Bu felsefe kullan\u0131c\u0131 deneyimi \u00f6\u011felerinin davran\u0131\u015f\u0131n\u0131 ve kullan\u0131c\u0131n\u0131n g\u00f6rsel olarak nas\u0131l etkile\u015fime girdi\u011fini ele al\u0131r. Web&#8217;in de bulundu\u011fu t\u00fcm platformlarda (yaln\u0131zca Android de\u011fil) Google&#8217;\u0131n kullan\u0131c\u0131 aray\u00fcz\u00fcne tekd\u00fczelik getirmek amac\u0131yla ortaya \u00e7\u0131kt\u0131. Spesifikasyon, g\u00f6rsel \u00f6\u011felerle ilgili genel ilkeleri \u00f6zetler ve fizik, \u0131\u015f\u0131k, alan, momentumun nas\u0131l kullan\u0131laca\u011f\u0131n\u0131 tart\u0131\u015f\u0131r. Daha sonra belirli \u00f6\u011feler i\u00e7in somut \u00f6rnekler ve gereksinimler sa\u011flar. \u00d6rn. D\u00fc\u011fmeler, listeler, sekmeler vs.<\/p>\n<p>Materialize&#8217;nin Google&#8217;\u0131n bir uygulamas\u0131 oldu\u011fu g\u00f6z \u00f6n\u00fcne al\u0131nd\u0131\u011f\u0131nda, \u00f6\u011felerin 3 boyutlu bir alan etraf\u0131nda tasarlanm\u0131\u015f oldu\u011funu ve hareketten b\u00fcy\u00fck \u00f6l\u00e7\u00fcde faydalan\u0131yor oldu\u011funu g\u00f6r\u00fcyoruz. Bu \u00f6\u011frenin bir geni\u015flik ve y\u00fcksekli\u011fe sahip olmakla birlikte, belirli bir \u015fekilde bir derinli\u011fe ve hareketine sahip oldu\u011fu anlam\u0131na da gelir. Bu, kullan\u0131c\u0131n\u0131n tan\u0131d\u0131k g\u00f6rsel ipu\u00e7lar\u0131n\u0131 kullanarak i\u015flev ba\u011flam\u0131n\u0131 anlamas\u0131na yard\u0131mc\u0131 olmadaki bir nevi anahtard\u0131r. Basit olsa da bu g\u00f6rsel kavramlar\u00a0etkilidir. \u00d6rne\u011fin ben ekran bile\u015fenlerini daha iyi kulland\u0131klar\u0131 i\u00e7in form bile\u015fenlerinin \u00e7al\u0131\u015fma bi\u00e7imini de kullanmay\u0131 tercih ediyorum. Benim gibi d\u00fc\u015f\u00fcnen geli\u015ftiriciler mutlaka olacakt\u0131r.<\/p>\n<p><strong><a href=\"http:\/\/materializecss.com\/\" target=\"_blank\">Materialize<\/a><\/strong>, bir CSS + JavaScript \u00e7er\u00e7evesi olarak istemtiye g\u00f6nderilir, ancak CSS b\u00f6l\u00fcmleri Sass&#8217;ta yaz\u0131lm\u0131\u015ft\u0131r..<\/p>\n<p>Kullan\u0131labilir kullan\u0131c\u0131 arabirimi bile\u015fenlerine bak\u0131ld\u0131\u011f\u0131nda, <strong>Materialize<\/strong>&#8216;nin Bootstrap kadar \u00e7ok componenti malesef \u015fuanl\u0131k yok. Bununla birlikte, kullanabilece\u011finiz ve i\u015finize yarayacak birka\u00e7 bile\u015feni var. Bunlar aras\u0131nda benim kulland\u0131klar\u0131m:<\/p>\n<ul>\n<li>Toasts<\/li>\n<li>Modals that are fixed to the bottom of the window<\/li>\n<li>Parallax<\/li>\n<\/ul>\n<p>Taray\u0131c\u0131 uyumlulu\u011fu ile ilgili olarak, <strong><a href=\"http:\/\/materializecss.com\/\" target=\"_blank\">Materialize<\/a><\/strong>, modern taray\u0131c\u0131larla \u00e7al\u0131\u015f\u0131r, ancak Internet Explorer ile ili\u015fkili olarak, IE10 + ile s\u0131n\u0131rl\u0131d\u0131r, bu, belirli uygulama gereksinimlerinize ba\u011fl\u0131 olarak ciddi bir\u00a0sorun mudur, bu sizin bilece\u011finiz bir konu.<\/p>\n<h3><strong>Bootstrap Hakk\u0131nda Bilmeniz Gerekenler<\/strong><\/h3>\n<p>Twitter&#8217;\u0131n geli\u015fimini sa\u011flad\u0131\u011f\u0131 <strong><a href=\"http:\/\/getbootstrap.com\/\" target=\"_blank\">Bootstrap<\/a><\/strong>, duyarl\u0131 bir tasar\u0131ma sahip mobil dostu web siteleri olu\u015fturmak i\u00e7in kullan\u0131lan en pop\u00fcler CSS framewok\u00fcd\u00fcr. 2010 y\u0131l\u0131nda kuruldu, ancak A\u011fustos 2011&#8217;e kadar resmi olarak piyasaya s\u00fcr\u00fclmedi. O tarihten bu yana bir dizi b\u00fclten yap\u0131ld\u0131. G\u00fcncel s\u00fcr\u00fcm bilgisi i\u00e7in <a href=\"http:\/\/blog.getbootstrap.com\/2015\/08\/19\/bootstrap-4-alpha\/\" target=\"_blank\">buraya <\/a>t\u0131klayabilirsiniz.<\/p>\n<p>K\u00fct\u00fcphane, ilk yakla\u015f\u0131m olarak mobile\u00a0odaklan\u0131r; di\u011fer bir deyi\u015fle, web siteleri mobil platformlar\u0131 hedeflenerek tasarlan\u0131r ve olu\u015fturulur. Daha sonra masa\u00fcstlerinde ve daha b\u00fcy\u00fck cihazlarda \u00e7al\u0131\u015fmaya haz\u0131rlan\u0131r. Bununla birlikte, yukar\u0131da <a href=\"http:\/\/materializecss.com\/\" target=\"_blank\"><strong>Materialize<\/strong>\u00a0<\/a>i\u00e7in \u00f6zetlendi\u011fi gibi, \u00e7er\u00e7eve \u00e7o\u011funlu\u011fu, etkile\u015fimde bulunduklar\u0131 \u015feylerin g\u00f6r\u00fcn\u00fcm ve tepki vermeleri \u00fczerine odaklan\u0131r ve sonu\u00e7 olarak, duyarl\u0131 bir kullan\u0131c\u0131 deneyimi sunmak ana hedeftir.<\/p>\n<p><strong><a href=\"http:\/\/getbootstrap.com\/\" target=\"_blank\">Bootstrap<\/a><\/strong>, HTML s\u0131n\u0131flar\u0131, CSS stilleri ve davran\u0131\u015flar\u0131n\u0131 kullanarak yan\u0131t veren kullan\u0131c\u0131 deneyimini olu\u015fturmak i\u00e7in bize belirli bir \u00e7er\u00e7eve sa\u011flar; di\u011fer bir deyi\u015fle, nesnelerin g\u00f6r\u00fcn\u00fcm\u00fcne odaklanmak yerine, HTML&#8217;ye tutarl\u0131 ve \u00f6zelle\u015ftirilebilir bir temel yap\u0131y\u0131 sa\u011flamay\u0131 ama\u00e7lar.<\/p>\n<p><strong>Bootstrap<\/strong> varsay\u0131lan bir tema sa\u011flarken, g\u00f6rsel sunum ve stil \u00e7er\u00e7evenin oda\u011f\u0131 de\u011fildir. CSS s\u0131n\u0131flar\u0131 kullan\u0131larak yo\u011fun bir \u015fekilde tasarland\u0131\u011f\u0131ndan, g\u00f6rsel sunum stil sayfalar\u0131n\u0131 kullanarak kolayca \u00f6zelle\u015ftirilebilir. Sonu\u00e7 olarak, Web sitenizin g\u00f6rsel sunum ve stilini de\u011fi\u015ftirmek i\u00e7in Bootstrap&#8217;\u0131n sa\u011flad\u0131\u011f\u0131 \u00e7ok \u00e7e\u015fitli temalar bulunmaktad\u0131r.<\/p>\n<p><strong>Bootstrap\u00a0Materialize&#8217;den \u00e7ok daha kapsaml\u0131 bir framewokt\u00fcr. \u00d6rne\u011fin:<\/strong><\/p>\n<ul>\n<li>Temel olarak bize, \u00f6\u011feleri gizlemek veya g\u00f6stermek i\u00e7in s\u0131n\u0131flar\u0131 kullanma\u00a0olana\u011f\u0131 sunar.<\/li>\n<li>Dok\u00fcmantasyon \u00e7ok daha kapsaml\u0131d\u0131r (kullan\u0131m \u00f6rneklerinden daha fazla yararlan\u0131lm\u0131\u015ft\u0131r).<\/li>\n<li>Taray\u0131c\u0131 uyumlulu\u011fu kapsaml\u0131, IE9 +<\/li>\n<\/ul>\n<p><strong>Materialize<\/strong>&#8216;nin Bootstrap&#8217;in do\u011frudan bir rakibi oldu\u011funu s\u00f6ylemek\u00a0<strong>Materialize<\/strong> i\u00e7in adil olmayacakt\u0131r; Ama umar\u0131m bir g\u00fcn olacakt\u0131r, \u00e7\u00fcnk\u00fc <strong>Materialize<\/strong>&#8216;nin g\u00f6r\u00fcn\u00fcm\u00fc ve\u00a0kullan\u0131c\u0131 deneyimi \u00e7ok hassas. \u0130yi bir tasar\u0131m\u0131n, \u00f6zellikle de 3 boyut ve hareketle ilgili tasar\u0131m ilkeleri a\u00e7\u0131s\u0131ndan iyi tasar\u0131m\u0131n inkar edilmesi zor, ancak bunun nedeni, b\u00fcy\u00fck \u00f6l\u00e7\u00fcde Google&#8217;\u0131n Malzeme Tasar\u0131m\u0131&#8217;ndan tutarl\u0131 bir dizi k\u0131lavuz uygulayacak olmas\u0131d\u0131r. Bununla birlikte, <strong>Materialize<\/strong> framework&#8217;\u00fc hala olduk\u00e7a yeni &#8211; sonu\u00e7 olarak yetenekleri, belgeleri ve toplulu\u011fu Bootstrap&#8217;\u0131nkiyle yar\u0131\u015fam\u0131yor.<\/p>\n<p>Sonu\u00e7 olarak;<\/p>\n<p>Uygulaman\u0131z\u0131 en az \u00e7abayla birinci s\u0131n\u0131fa \u00e7eviren bir framework\u00a0ar\u0131yorsan\u0131z veya uygulaman\u0131z\u0131 Google&#8217;\u0131n tasar\u0131m\u0131yla birle\u015ftirmek istiyorsan\u0131z, o zaman kesinlikle <strong><a href=\"http:\/\/materializecss.com\/\" target=\"_blank\">Materialize<\/a><\/strong>&#8216;ye bir g\u00f6z at\u0131n.<\/p>\n<p>\u00d6te yandan, denenmi\u015f ve test edilmi\u015f sa\u011flam bir front-end framework\u00a0ar\u0131yorsan\u0131z, b\u00fcy\u00fck bir topluluk, eklenti se\u00e7enekleri ve temalarla <strong><a href=\"http:\/\/getbootstrap.com\/\" target=\"_blank\">Bootstrap<\/a><\/strong>&#8216;\u0131 denemelisiniz.<\/p>\n<h3 class=\"intro\"><\/h3>\n","protected":false},"excerpt":{"rendered":"Web geli\u015ftiricileri i\u00e7in se\u00e7ebilece\u011finiz \u00e7ok \u00e7e\u015fitli front-end frameworkler sunulmakta. Ancak, daha iyi bir kullan\u0131c\u0131 deneyimi i\u00e7in en iyi&hellip;","protected":false},"author":1,"featured_media":352,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"csco_page_header_type":"","csco_page_load_nextpost":"","csco_page_subscribe_form":"","csco_page_contact_form":"","footnotes":""},"categories":[126,10],"tags":[83,86,85,87,84],"class_list":{"0":"post-351","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-css3-html5","8":"category-yazilim","9":"tag-bootstrap","10":"tag-framework","11":"tag-front-end","12":"tag-hangisi-daha-iyi","13":"tag-materialize-css","14":"cs-entry","15":"cs-video-wrap"},"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v20.5 (Yoast SEO v25.3.1) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>En \u0130yi Front-End Framework&#039;lerin Sava\u015f\u0131: Bootstrap ve Materialize CSS - Kodlar\u0131n Gizemli D\u00fcnyas\u0131<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"En \u0130yi Front-End Framework&#039;lerin Sava\u015f\u0131: Bootstrap ve Materialize CSS\" \/>\n<meta property=\"og:description\" content=\"Web geli\u015ftiricileri i\u00e7in se\u00e7ebilece\u011finiz \u00e7ok \u00e7e\u015fitli front-end frameworkler sunulmakta. Ancak, daha iyi bir kullan\u0131c\u0131 deneyimi i\u00e7in en iyi&hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/\" \/>\n<meta property=\"og:site_name\" content=\"Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" \/>\n<meta property=\"article:published_time\" content=\"2016-11-24T14:33:54+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2018-03-01T19:05:12+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2016\/11\/bootstrap-vs-materialcss.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"940\" \/>\n\t<meta property=\"og:image:height\" content=\"400\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Fatih Soysal\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Yazan:\" \/>\n\t<meta name=\"twitter:data1\" content=\"Fatih Soysal\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tahmini okuma s\u00fcresi\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/\"},\"author\":{\"name\":\"Fatih Soysal\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"headline\":\"En \u0130yi Front-End Framework&#8217;lerin Sava\u015f\u0131: Bootstrap ve Materialize CSS\",\"datePublished\":\"2016-11-24T14:33:54+00:00\",\"dateModified\":\"2018-03-01T19:05:12+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/\"},\"wordCount\":1065,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"image\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2016\/11\/bootstrap-vs-materialcss.jpg\",\"keywords\":[\"Bootstrap\",\"framework\",\"front-end\",\"hangisi daha iyi\",\"Materialize CSS\"],\"articleSection\":[\"CSS3 - HTML5\",\"Yaz\u0131l\u0131m\"],\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#respond\"]}],\"copyrightYear\":\"2016\",\"copyrightHolder\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/\",\"name\":\"En \u0130yi Front-End Framework'lerin Sava\u015f\u0131: Bootstrap ve Materialize CSS - Kodlar\u0131n Gizemli D\u00fcnyas\u0131\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2016\/11\/bootstrap-vs-materialcss.jpg\",\"datePublished\":\"2016-11-24T14:33:54+00:00\",\"dateModified\":\"2018-03-01T19:05:12+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"tr\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#primaryimage\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2016\/11\/bootstrap-vs-materialcss.jpg\",\"contentUrl\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2016\/11\/bootstrap-vs-materialcss.jpg\",\"width\":940,\"height\":400},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\/\/fatihsoysal.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"En \u0130yi Front-End Framework&#8217;lerin Sava\u015f\u0131: Bootstrap ve Materialize CSS\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/\",\"name\":\"Fatihsoysal.com\",\"description\":\"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim\",\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"tr\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\",\"name\":\"Fatih Soysal\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"tr\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"contentUrl\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"width\":512,\"height\":512,\"caption\":\"Fatih Soysal\"},\"logo\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\"},\"description\":\"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"En \u0130yi Front-End Framework'lerin Sava\u015f\u0131: Bootstrap ve Materialize CSS - Kodlar\u0131n Gizemli D\u00fcnyas\u0131","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/","og_locale":"tr_TR","og_type":"article","og_title":"En \u0130yi Front-End Framework'lerin Sava\u015f\u0131: Bootstrap ve Materialize CSS","og_description":"Web geli\u015ftiricileri i\u00e7in se\u00e7ebilece\u011finiz \u00e7ok \u00e7e\u015fitli front-end frameworkler sunulmakta. Ancak, daha iyi bir kullan\u0131c\u0131 deneyimi i\u00e7in en iyi&hellip;","og_url":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/","og_site_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","article_published_time":"2016-11-24T14:33:54+00:00","article_modified_time":"2018-03-01T19:05:12+00:00","og_image":[{"width":940,"height":400,"url":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2016\/11\/bootstrap-vs-materialcss.jpg","type":"image\/jpeg"}],"author":"Fatih Soysal","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Fatih Soysal","Tahmini okuma s\u00fcresi":"5 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#article","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/"},"author":{"name":"Fatih Soysal","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"headline":"En \u0130yi Front-End Framework&#8217;lerin Sava\u015f\u0131: Bootstrap ve Materialize CSS","datePublished":"2016-11-24T14:33:54+00:00","dateModified":"2018-03-01T19:05:12+00:00","mainEntityOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/"},"wordCount":1065,"commentCount":1,"publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"image":{"@id":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#primaryimage"},"thumbnailUrl":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2016\/11\/bootstrap-vs-materialcss.jpg","keywords":["Bootstrap","framework","front-end","hangisi daha iyi","Materialize CSS"],"articleSection":["CSS3 - HTML5","Yaz\u0131l\u0131m"],"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#respond"]}],"copyrightYear":"2016","copyrightHolder":{"@id":"https:\/\/fatihsoysal.com\/blog\/#organization"}},{"@type":"WebPage","@id":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/","url":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/","name":"En \u0130yi Front-End Framework'lerin Sava\u015f\u0131: Bootstrap ve Materialize CSS - Kodlar\u0131n Gizemli D\u00fcnyas\u0131","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#primaryimage"},"image":{"@id":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#primaryimage"},"thumbnailUrl":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2016\/11\/bootstrap-vs-materialcss.jpg","datePublished":"2016-11-24T14:33:54+00:00","dateModified":"2018-03-01T19:05:12+00:00","breadcrumb":{"@id":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/"]}]},{"@type":"ImageObject","inLanguage":"tr","@id":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#primaryimage","url":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2016\/11\/bootstrap-vs-materialcss.jpg","contentUrl":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2016\/11\/bootstrap-vs-materialcss.jpg","width":940,"height":400},{"@type":"BreadcrumbList","@id":"https:\/\/fatihsoysal.com\/blog\/en-iyi-front-end-frameworklerin-savasi-bootstrap-materialize-css\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/fatihsoysal.com\/blog\/"},{"@type":"ListItem","position":2,"name":"En \u0130yi Front-End Framework&#8217;lerin Sava\u015f\u0131: Bootstrap ve Materialize CSS"}]},{"@type":"WebSite","@id":"https:\/\/fatihsoysal.com\/blog\/#website","url":"https:\/\/fatihsoysal.com\/blog\/","name":"Fatihsoysal.com","description":"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim","publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"tr"},{"@type":["Person","Organization"],"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1","name":"Fatih Soysal","image":{"@type":"ImageObject","inLanguage":"tr","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","contentUrl":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","width":512,"height":512,"caption":"Fatih Soysal"},"logo":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/"},"description":"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.","url":"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/"}]}},"yoast_meta":{"yoast_wpseo_title":"","yoast_wpseo_metadesc":"","yoast_wpseo_canonical":""},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/351","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/comments?post=351"}],"version-history":[{"count":6,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/351\/revisions"}],"predecessor-version":[{"id":358,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/351\/revisions\/358"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media\/352"}],"wp:attachment":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media?parent=351"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/categories?post=351"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/tags?post=351"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}