{"id":103,"date":"2023-08-25T22:09:22","date_gmt":"2023-08-25T22:09:22","guid":{"rendered":"https:\/\/www.mucahitakin.com\/blog\/?p=103"},"modified":"2023-08-25T22:09:33","modified_gmt":"2023-08-25T22:09:33","slug":"sifirdan-react-projesi-olusturma","status":"publish","type":"post","link":"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/","title":{"rendered":"S\u0131f\u0131rdan React Uygulamas\u0131 Olu\u015fturma"},"content":{"rendered":"\n<p>React ile proje geli\u015ftirme \u00e7ok e\u011flencelidir. \u00d6ncelikle proje olu\u015fturmak i\u00e7in bir IDE kullanmal\u0131y\u0131z. Genellikle yaz\u0131l\u0131m geli\u015ftiricilerin tercihi <a href=\"https:\/\/code.visualstudio.com\"><strong><em>visual studio code<\/em><\/strong><\/a> &#8216;dur.<\/p>\n\n\n\n<p>\u00d6ncelikle bir klas\u00f6r olu\u015fturuyoruz. Genellikle cmd kullanarak bu i\u015flemi yapmak bence daha kolay.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong><em>Windows <\/em><\/strong>kullan\u0131yorsak <strong><em>komut istemini<\/em><\/strong> a\u00e7\u0131yoruz.<\/li>\n\n\n\n<li><strong><em>Macos <\/em><\/strong>kullan\u0131yorsak <strong><em>mac terminalini<\/em><\/strong> a\u00e7\u0131yoruz.<\/li>\n\n\n\n<li>mkdir komutunu kullanarak bir klas\u00f6r olu\u015fturuyoruz.<\/li>\n<\/ul>\n\n\n\n<p><code>mkdir first-react-project<\/code><\/p>\n\n\n\n<p><code>cd first-react-project <\/code><\/p>\n\n\n\n<p>kodu ile klas\u00f6r&#8217;e giri\u015f yap\u0131yoruz.Sonras\u0131nda code . diyerek first-react-project klas\u00f6r\u00fcn\u00fcn i\u00e7erisinde visual studio code&#8217;u a\u00e7\u0131yoruz.<\/p>\n\n\n\n<p><code><strong><em>npx create-react-app my-app<\/em><\/strong><\/code><br><br>kodunu kullanarak my-app isimli bir <em><strong>react projesi<\/strong><\/em> olu\u015fturuyoruz. Bu durum birka\u00e7 dakika sizi bekletebilir. Gerekli paketler y\u00fcklenecektir.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_001259176.png\" alt=\"\" class=\"wp-image-104\" style=\"width:563px;height:200px\" width=\"563\" height=\"200\" srcset=\"https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_001259176.png 623w, https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_001259176-300x106.png 300w\" sizes=\"auto, (max-width: 563px) 100vw, 563px\" \/><\/figure>\n<\/div>\n\n\n<p>Sonras\u0131nda bu ekranda birka\u00e7 dakika bekliyoruz. \u0130nternet h\u0131z\u0131n\u0131za g\u00f6re paketlerin y\u00fcklenme s\u00fcresi h\u0131zl\u0131 olacakt\u0131r.<\/p>\n\n\n\n<p>Klas\u00f6r\u00fcn\u00fcze default olarak indirilecek olan dosyalar : <\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>node_modules : node paketlerinin bulundu\u011fu dosyad\u0131r.<\/li>\n\n\n\n<li>public : favicon, index.html, manifest.json,robot.txt dosyalar\u0131n\u0131 bar\u0131nd\u0131r\u0131r.<\/li>\n\n\n\n<li>src : gerekli kodlar\u0131m\u0131z\u0131 yazd\u0131\u011f\u0131m\u0131z dosyad\u0131r.\u0130\u00e7erisinde app.js , app.css , index.js , index.css gibi dosyalar\u0131 i\u00e7erisinde bar\u0131nd\u0131r\u0131r. <strong><em>Components <\/em><\/strong>klas\u00f6r\u00fcm\u00fcz\u00fc bu k\u0131s\u0131mda olu\u015ftururuz. <\/li>\n\n\n\n<li>.gitignore<\/li>\n\n\n\n<li>package-lock.json<\/li>\n\n\n\n<li>package.json<\/li>\n<\/ul>\n\n\n\n<p>Default olarak klas\u00f6r\u00fcn\u00fcze indirilecek dosyalar bunlard\u0131r.<\/p>\n\n\n\n<p>\u00f6ncelikle projemizi ba\u015flatal\u0131m. Yapmam\u0131z gereken visual studio code&#8217; da sol \u00fcst k\u0131s\u0131mda bulunan terminal  k\u0131sm\u0131na t\u0131kl\u0131yoruz. Yeni terminal (new terminal) k\u0131sm\u0131na t\u0131klayarak terminal ekran\u0131n\u0131 a\u00e7\u0131yoruz. Sonras\u0131nda yazmam\u0131z gereken kod :<\/p>\n\n\n\n<p><code><strong><em>npm start<\/em><\/strong><\/code><\/p>\n\n\n\n<p>Bu kod projemizi aya\u011fa kald\u0131racakt\u0131r. Ve local&#8217;de projemizi \u00e7al\u0131\u015ft\u0131rmam\u0131za yard\u0131mc\u0131 olacakt\u0131r.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_002834000.png\" alt=\"npm start\" class=\"wp-image-105\" style=\"width:408px;height:279px\" width=\"408\" height=\"279\" srcset=\"https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_002834000.png 472w, https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_002834000-300x205.png 300w\" sizes=\"auto, (max-width: 408px) 100vw, 408px\" \/><\/figure>\n<\/div>\n\n\n<p>Projemizi a\u00e7t\u0131ktan sonra localhost:3000 portunda projemiz a\u00e7\u0131lacakt\u0131r. Projemizin default k\u0131sm\u0131 bu g\u00f6rselde g\u00f6r\u00fcnd\u00fc\u011f\u00fc gibidir.<\/p>\n\n\n\n<p>Visual studio code&#8217;u a\u00e7\u0131yoruz. src dosyam\u0131za components klas\u00f6r\u00fcm\u00fcz\u00fc olu\u015fturuyoruz. Bu dosyada componentslerimizi tan\u0131mlanaya\u011f\u0131z.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>import '.\/App.css';\nimport BasicForm from '.\/components\/BasicForm';\n\nfunction App() {\n  return (\n    &lt;div className=\"App\">\n      &lt;BasicForm\/>\n    &lt;\/div>\n  );\n}\n\nexport default App;\n<\/code><\/pre>\n\n\n\n<p>Projemizi aya\u011fa kald\u0131ran app.js dosyam\u0131zd\u0131r.<\/p>\n\n\n\n<p>Kod blo\u011funu anlatmak gerekirse ;<\/p>\n\n\n\n<p>Bir function app&#8217;imiz var. Bu app.js dosyam\u0131zda \u00e7al\u0131\u015ft\u0131rd\u0131\u011f\u0131m\u0131z bir components var. BasicForm componenti. Bu componenti bir &lt;div> elementinin i\u00e7erisinde yaz\u0131yoruz sebebi ise birden fazla elementi kullanmak istedi\u011fimizde <strong><em><a href=\"https:\/\/www.mucahitakin.com\">react<\/a><\/em><\/strong> bizlerden bir div istiyor. bizde burada o divi yerine koyduk. \u0130mport komutu ile componentimizi app.js dosyam\u0131za import ettik.<\/p>\n\n\n\n<p>Yazm\u0131\u015f oldu\u011fum BasicForm componentinin kodunu payla\u015f\u0131yorum.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>import React, { Component } from 'react'\r\n\r\nexport default class BasicForm extends Component {\r\n    constructor(props) {\r\n      super(props)\r\n    \r\n      this.state = {\r\n         username:'',\r\n         lesson:'',\r\n         date:''\r\n      }\r\n    }\r\n    chaneUsername=(event)=>{\r\n        this.setState({\r\n            username:event.target.value\r\n        })\r\n    }\r\n    chaneLesson=(event)=>{\r\n        this.setState({\r\n            lesson:event.target.value\r\n        })\r\n    }\r\n    chaneDate=(event)=>{\r\n        this.setState({\r\n            date:event.target.value\r\n        })\r\n    }\r\n    submitHandler=(event)=>{\r\n        alert(`\u0130sim : ${this.state.username} Ders : ${this.state.lesson} Tarih ${this.state.date}`)\r\n        event.preventDefault()\r\n    }\r\n    \r\n  render() {\r\n    return (\r\n      &lt;div>\r\n        &lt;form>\r\n            &lt;div>\r\n            &lt;input onChange={this.chaneUsername} value={this.state.username} type='text'\/>\r\n            &lt;\/div> \r\n            &lt;div>\r\n                &lt;select onChange={this.chaneLesson} value={this.state.lesson}>\r\n                    &lt;option>Python&lt;\/option>\r\n                    &lt;option>Java&lt;\/option>\r\n                    &lt;option>PHP&lt;\/option>\r\n                &lt;\/select>\r\n            &lt;\/div>\r\n            &lt;div>\r\n                &lt;input onChange={this.chaneDate } value={this.state.lesson} type='date'\/>\r\n            &lt;\/div>\r\n            &lt;button onClick={this.submitHandler} type='submit'>G\u00f6nder&lt;\/button>\r\n        &lt;\/form>\r\n      &lt;\/div>\r\n    )\r\n  }\r\n}\r\n<\/code><\/pre>\n\n\n\n<p>npm start ile kodumuzu \u00e7al\u0131\u015ft\u0131r\u0131yoruz.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"358\" src=\"https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_005052247-1024x358.png\" alt=\"ilk react projem\" class=\"wp-image-106\" srcset=\"https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_005052247-1024x358.png 1024w, https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_005052247-300x105.png 300w, https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_005052247-768x269.png 768w, https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_005052247.png 1429w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Sayfam\u0131z\u0131n g\u00f6r\u00fcnt\u00fcs\u00fc bu \u015fekilde.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">React Component Olu\u015fturma K\u0131sayollar\u0131 <\/h2>\n\n\n\n<p>\u00d6ncelikle visual studio code&#8217;da react kullan\u0131rken <strong><em>react extensions<\/em><\/strong>&#8216;\u0131n\u0131 indirmeniz gerekir.<\/p>\n\n\n\n<p>Bu extensions ile kullanabilece\u011finiz baz\u0131 kolayl\u0131klar bulunuyor.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>rcc : <strong><em>react class component<\/em> <\/strong> olu\u015fturmam\u0131za yard\u0131mc\u0131 olacakt\u0131r.<\/li>\n\n\n\n<li>rfc : <strong><em>react function component<\/em><\/strong> olu\u015fturman\u0131za yard\u0131mc\u0131 olacakt\u0131r.<\/li>\n<\/ul>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>React ile proje geli\u015ftirme \u00e7ok e\u011flencelidir. \u00d6ncelikle proje olu\u015fturmak i\u00e7in bir IDE kullanmal\u0131y\u0131z. Genellikle yaz\u0131l\u0131m geli\u015ftiricilerin tercihi visual studio code &#8216;dur. \u00d6ncelikle bir klas\u00f6r olu\u015fturuyoruz. Genellikle cmd kullanarak bu i\u015flemi yapmak bence daha kolay. mkdir first-react-project cd first-react-project kodu ile klas\u00f6r&#8217;e giri\u015f yap\u0131yoruz.Sonras\u0131nda code . diyerek first-react-project klas\u00f6r\u00fcn\u00fcn i\u00e7erisinde visual studio code&#8217;u a\u00e7\u0131yoruz. npx create-react-app [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":105,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[20],"tags":[85,82,84,86,83,81],"class_list":["post-103","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-yazilim","tag-component-olusturma","tag-react","tag-react-component","tag-react-kisayollari","tag-sifirdan-react-uygulamasi","tag-visual-studio-code"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>S\u0131f\u0131rdan React Uygulamas\u0131 Olu\u015fturma - Mucahit Akin<\/title>\n<meta name=\"description\" content=\"S\u0131f\u0131rdan react uygulamas\u0131 olusturma, react projelerimiz ile tamamen e\u011fitici ve basit bir \u015fekilde react&#039;\u0131 kolayca \u00f6\u011freneceksiniz.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"S\u0131f\u0131rdan React Uygulamas\u0131 Olu\u015fturma - Mucahit Akin\" \/>\n<meta property=\"og:description\" content=\"S\u0131f\u0131rdan react uygulamas\u0131 olusturma, react projelerimiz ile tamamen e\u011fitici ve basit bir \u015fekilde react&#039;\u0131 kolayca \u00f6\u011freneceksiniz.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/\" \/>\n<meta property=\"og:site_name\" content=\"Mucahit Akin\" \/>\n<meta property=\"article:published_time\" content=\"2023-08-25T22:09:22+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-08-25T22:09:33+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_002834000.png\" \/>\n\t<meta property=\"og:image:width\" content=\"472\" \/>\n\t<meta property=\"og:image:height\" content=\"323\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Mucahit Akin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Mucahit Akin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/\",\"url\":\"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/\",\"name\":\"S\u0131f\u0131rdan React Uygulamas\u0131 Olu\u015fturma - Mucahit Akin\",\"isPartOf\":{\"@id\":\"https:\/\/www.mucahitakin.com\/blog\/#website\"},\"datePublished\":\"2023-08-25T22:09:22+00:00\",\"dateModified\":\"2023-08-25T22:09:33+00:00\",\"author\":{\"@id\":\"https:\/\/www.mucahitakin.com\/blog\/#\/schema\/person\/b9afcbf2f9b8279516ed7d93361c751b\"},\"description\":\"S\u0131f\u0131rdan react uygulamas\u0131 olusturma, react projelerimiz ile tamamen e\u011fitici ve basit bir \u015fekilde react'\u0131 kolayca \u00f6\u011freneceksiniz.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.mucahitakin.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"S\u0131f\u0131rdan React Uygulamas\u0131 Olu\u015fturma\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.mucahitakin.com\/blog\/#website\",\"url\":\"https:\/\/www.mucahitakin.com\/blog\/\",\"name\":\"Mucahit Akin\",\"description\":\"Developer\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.mucahitakin.com\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.mucahitakin.com\/blog\/#\/schema\/person\/b9afcbf2f9b8279516ed7d93361c751b\",\"name\":\"Mucahit Akin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.mucahitakin.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/d73f6416cb16f0abe000533f648d6f824e3d9e0d73d0c686c8196cf8bcfa9957?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/d73f6416cb16f0abe000533f648d6f824e3d9e0d73d0c686c8196cf8bcfa9957?s=96&d=mm&r=g\",\"caption\":\"Mucahit Akin\"},\"sameAs\":[\"https:\/\/mucahitakin.com\"],\"url\":\"https:\/\/www.mucahitakin.com\/blog\/author\/akin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"S\u0131f\u0131rdan React Uygulamas\u0131 Olu\u015fturma - Mucahit Akin","description":"S\u0131f\u0131rdan react uygulamas\u0131 olusturma, react projelerimiz ile tamamen e\u011fitici ve basit bir \u015fekilde react'\u0131 kolayca \u00f6\u011freneceksiniz.","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:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/","og_locale":"en_US","og_type":"article","og_title":"S\u0131f\u0131rdan React Uygulamas\u0131 Olu\u015fturma - Mucahit Akin","og_description":"S\u0131f\u0131rdan react uygulamas\u0131 olusturma, react projelerimiz ile tamamen e\u011fitici ve basit bir \u015fekilde react'\u0131 kolayca \u00f6\u011freneceksiniz.","og_url":"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/","og_site_name":"Mucahit Akin","article_published_time":"2023-08-25T22:09:22+00:00","article_modified_time":"2023-08-25T22:09:33+00:00","og_image":[{"width":472,"height":323,"url":"https:\/\/www.mucahitakin.com\/blog\/wp-content\/uploads\/2023\/08\/resim_2023-08-26_002834000.png","type":"image\/png"}],"author":"Mucahit Akin","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Mucahit Akin","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/","url":"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/","name":"S\u0131f\u0131rdan React Uygulamas\u0131 Olu\u015fturma - Mucahit Akin","isPartOf":{"@id":"https:\/\/www.mucahitakin.com\/blog\/#website"},"datePublished":"2023-08-25T22:09:22+00:00","dateModified":"2023-08-25T22:09:33+00:00","author":{"@id":"https:\/\/www.mucahitakin.com\/blog\/#\/schema\/person\/b9afcbf2f9b8279516ed7d93361c751b"},"description":"S\u0131f\u0131rdan react uygulamas\u0131 olusturma, react projelerimiz ile tamamen e\u011fitici ve basit bir \u015fekilde react'\u0131 kolayca \u00f6\u011freneceksiniz.","breadcrumb":{"@id":"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.mucahitakin.com\/blog\/sifirdan-react-projesi-olusturma\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.mucahitakin.com\/blog\/"},{"@type":"ListItem","position":2,"name":"S\u0131f\u0131rdan React Uygulamas\u0131 Olu\u015fturma"}]},{"@type":"WebSite","@id":"https:\/\/www.mucahitakin.com\/blog\/#website","url":"https:\/\/www.mucahitakin.com\/blog\/","name":"Mucahit Akin","description":"Developer","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.mucahitakin.com\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.mucahitakin.com\/blog\/#\/schema\/person\/b9afcbf2f9b8279516ed7d93361c751b","name":"Mucahit Akin","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.mucahitakin.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/d73f6416cb16f0abe000533f648d6f824e3d9e0d73d0c686c8196cf8bcfa9957?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d73f6416cb16f0abe000533f648d6f824e3d9e0d73d0c686c8196cf8bcfa9957?s=96&d=mm&r=g","caption":"Mucahit Akin"},"sameAs":["https:\/\/mucahitakin.com"],"url":"https:\/\/www.mucahitakin.com\/blog\/author\/akin\/"}]}},"_links":{"self":[{"href":"https:\/\/www.mucahitakin.com\/blog\/wp-json\/wp\/v2\/posts\/103","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mucahitakin.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.mucahitakin.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.mucahitakin.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mucahitakin.com\/blog\/wp-json\/wp\/v2\/comments?post=103"}],"version-history":[{"count":1,"href":"https:\/\/www.mucahitakin.com\/blog\/wp-json\/wp\/v2\/posts\/103\/revisions"}],"predecessor-version":[{"id":107,"href":"https:\/\/www.mucahitakin.com\/blog\/wp-json\/wp\/v2\/posts\/103\/revisions\/107"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.mucahitakin.com\/blog\/wp-json\/wp\/v2\/media\/105"}],"wp:attachment":[{"href":"https:\/\/www.mucahitakin.com\/blog\/wp-json\/wp\/v2\/media?parent=103"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.mucahitakin.com\/blog\/wp-json\/wp\/v2\/categories?post=103"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.mucahitakin.com\/blog\/wp-json\/wp\/v2\/tags?post=103"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}