{"id":8916,"date":"2025-01-07T20:15:10","date_gmt":"2025-01-07T17:15:10","guid":{"rendered":"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/"},"modified":"2025-01-07T20:15:10","modified_gmt":"2025-01-07T17:15:10","slug":"tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma","status":"publish","type":"post","link":"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/","title":{"rendered":"TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma"},"content":{"rendered":"<p>TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma<\/p>\n<p>Merhaba!  Bu yaz\u0131da, TanStack Table, Zod ve ShadCN\/UI k\u00fct\u00fcphanelerini kullanarak Google Sheets&#8217;e benzer, g\u00fc\u00e7l\u00fc ve \u00f6zelle\u015ftirilebilir bir tablo bile\u015feni nas\u0131l olu\u015fturaca\u011f\u0131n\u0131z\u0131 ad\u0131m ad\u0131m a\u00e7\u0131klayaca\u011f\u0131m.  Bu bile\u015fen, veri do\u011frulama, performans ve kullan\u0131c\u0131 deneyimi a\u00e7\u0131s\u0131ndan Google Sheets&#8217;in sundu\u011fu bir\u00e7ok avantaj\u0131 taklit edecek.  \u00d6ncelikle, her bir k\u00fct\u00fcphanenin rol\u00fcn\u00fc ve neden tercih edildi\u011fini inceleyelim.<\/p>\n<h2>Neden TanStack Table, Zod ve ShadCN\/UI?<\/h2>\n<p>TanStack Table, performansl\u0131 ve \u00f6zellik dolu bir tablo k\u00fct\u00fcphanesidir.  B\u00fcy\u00fck veri k\u00fcmelerinde bile h\u0131zl\u0131 ve sorunsuz \u00e7al\u0131\u015fmas\u0131n\u0131 sa\u011flayan optimize edilmi\u015f algoritmalara sahiptir.  Zod ise veri do\u011frulama i\u00e7in m\u00fckemmel bir ara\u00e7t\u0131r.  Veri giri\u015fini kontrol ederek hatalar\u0131 \u00f6nlememizi ve uygulaman\u0131n g\u00fcvenilirli\u011fini art\u0131rmam\u0131z\u0131 sa\u011flar. Son olarak, ShadCN\/UI, modern ve \u015f\u0131k bir aray\u00fcz sunan bir UI k\u00fct\u00fcphanesidir.  Bu \u00fc\u00e7 k\u00fct\u00fcphane bir araya gelerek, hem g\u00fc\u00e7l\u00fc hem de g\u00f6rsel a\u00e7\u0131dan \u00e7ekici bir tablo bile\u015feni olu\u015fturmam\u0131z\u0131 sa\u011flar.  \u00d6rne\u011fin, Zod sayesinde yanl\u0131\u015f veri giri\u015fini engeller ve kullan\u0131c\u0131 deneyimini iyile\u015ftiririz.  Sonu\u00e7 olarak, kullan\u0131c\u0131lara daha verimli ve hatas\u0131z bir \u00e7al\u0131\u015fma ortam\u0131 sunar\u0131z.<\/p>\n<h2>Ad\u0131m Ad\u0131m Uygulama<\/h2>\n<p>\u015eimdi, ad\u0131m ad\u0131m bir Google Sheets benzeri tablo bile\u015feni olu\u015fturma s\u00fcrecini inceleyelim.  \u00d6ncelikle, gerekli k\u00fct\u00fcphaneleri projemize eklememiz gerekiyor.  Bunun i\u00e7in npm veya yarn kullanabilirsiniz:<\/p>\n<pre><code class=\"language-bash\">\nnpm install @tanstack\/react-table zod @shadcn\/ui\n<\/code><\/pre>\n<p>Ard\u0131ndan, basit bir tablo yap\u0131s\u0131 olu\u015fturabiliriz.  A\u015fa\u011f\u0131daki kod \u00f6rne\u011fi, TanStack Table kullanarak temel bir tablo olu\u015fturmay\u0131 g\u00f6stermektedir:<\/p>\n<pre><code class=\"language-jsx\">\nimport { Table } from '@tanstack\/react-table';\n\nconst data = [\n  { name: 'Fatih Soysal', age: 30 },\n  { name: 'John Doe', age: 25 },\n];\n\nconst columns = [\n  { header: '\u0130sim', accessor: 'name' },\n  { header: 'Ya\u015f', accessor: 'age' },\n];\n\n&lt;Table data={data} columns={columns} \/&gt;\n<\/code><\/pre>\n<p>Bu temel tabloya, Zod kullanarak veri do\u011frulama ekleyebiliriz.  \u00d6rne\u011fin, ya\u015f alan\u0131n\u0131n say\u0131sal bir de\u011fer almas\u0131n\u0131 sa\u011flayabiliriz:<\/p>\n<pre><code class=\"language-typescript\">\nimport { z } from 'zod';\n\nconst userSchema = z.object({\n  name: z.string(),\n  age: z.number().min(0),\n});\n<\/code><\/pre>\n<p>Son olarak, ShadCN\/UI kullanarak tablomuzu daha g\u00f6rsel olarak \u00e7ekici hale getirebiliriz.  Bu k\u00fct\u00fcphane, haz\u0131r bile\u015fenler ve stillerle tabloya g\u00fczel bir g\u00f6r\u00fcn\u00fcm kazand\u0131rmam\u0131z\u0131 sa\u011flar.  Ayr\u0131ca, ShadCN\/UI&#8217;nin \u00f6zelle\u015ftirme se\u00e7eneklerini kullanarak tabloyu kendi markan\u0131zla uyumlu hale getirebilirsiniz.  \u00d6rne\u011fin, renk paletinizi, yaz\u0131 tiplerinizi ve di\u011fer tasar\u0131m \u00f6\u011felerinizi \u00f6zelle\u015ftirebilirsiniz.<\/p>\n<p>Daha fazla \u00f6zellik eklemek isterseniz, TanStack Table&#8217;\u0131n sa\u011flad\u0131\u011f\u0131 geli\u015fmi\u015f \u00f6zelliklerden faydalanabilirsiniz.  \u00d6rne\u011fin, s\u0131ralama, filtreleme, grupland\u0131rma ve sayfalama gibi \u00f6zellikler kolayca eklenebilir.  Ayr\u0131ca, \u00f6zelle\u015ftirilebilir s\u00fctunlar, sat\u0131r d\u00fczenleme ve toplam hesaplama gibi ek \u00f6zellikler de geli\u015fmi\u015f kullan\u0131c\u0131 deneyimi sunar.<\/p>\n<p>Bu makalede, temel bir Google Sheets benzeri tablo bile\u015feni olu\u015fturmay\u0131 a\u00e7\u0131klad\u0131m.  Daha geli\u015fmi\u015f \u00f6zellikler eklemek i\u00e7in TanStack Table, Zod ve ShadCN\/UI belgelerini inceleyebilirsiniz.  Umar\u0131m bu makale size yard\u0131mc\u0131 olmu\u015ftur.  Daha fazla bilgi ve \u00f6rnek i\u00e7in <a href=\"https:\/\/fatihsoysal.com\">fatihsoysal.com<\/a> adresini ziyaret edebilirsiniz.  Ayr\u0131ca, TanStack Table d\u00f6k\u00fcmantasyonu i\u00e7in <a href=\"https:\/\/tanstack.com\/table\/v8\">https:\/\/tanstack.com\/table\/v8<\/a> adresine, Zod d\u00f6k\u00fcmantasyonu i\u00e7in <a href=\"https:\/\/zod.dev\/\">https:\/\/zod.dev\/<\/a> adresine ve ShadCN\/UI d\u00f6k\u00fcmantasyonu i\u00e7in <a href=\"https:\/\/ui.shadcn.com\/\">https:\/\/ui.shadcn.com\/<\/a> adresine g\u00f6z atabilirsiniz.<\/p>\n<p>Umar\u0131m bu makale size yard\u0131mc\u0131 olmu\u015ftur!  Herhangi bir sorunuz varsa bana ula\u015fmaktan \u00e7ekinmeyin.<\/p>\n<p>#Etiketler: TanStack Table, Zod, ShadCN\/UI, Google Sheets, Tablo Bile\u015feni, React, Veri Do\u011frulama, UI K\u00fct\u00fcphanesi, JavaScript, Web Geli\u015ftirme,  #FrontEnd<\/p>\n","protected":false},"excerpt":{"rendered":"TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma Merhaba! Bu yaz\u0131da, TanStack Table, Zod&hellip;","protected":false},"author":1,"featured_media":0,"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":[1],"tags":[],"class_list":{"0":"post-8916","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-genel","7":"cs-entry","8":"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>TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma<\/title>\n<meta name=\"description\" content=\"Merhaba! Bu yaz\u0131da, TanStack Table, Zod ve ShadCN\/UI k\u00fct\u00fcphanelerini kullanarak Google Sheets&#039;e benzer, g\u00fc\u00e7l\u00fc ve \u00f6zelle\u015ftirilebilir bir tablo bile\u015feni nas\u0131l olu\u015fturaca\u011f\u0131n\u0131z\u0131 ad\u0131m ad\u0131m a\u00e7\u0131klayaca\u011f\u0131m. Bu bile\u015fen, veri do\u011frulama, performans ve kullan\u0131c\u0131 deneyimi a\u00e7\u0131s\u0131ndan Google Sheets&#039;in sundu\u011fu bir\u00e7ok avantaj\u0131 taklit edecek. \u00d6ncelikle, her bir k\u00fct\u00fcphanenin rol\u00fcn\u00fc ve neden tercih edildi\u011fini inceleyelim.\" \/>\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\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma\" \/>\n<meta property=\"og:description\" content=\"Merhaba! Bu yaz\u0131da, TanStack Table, Zod ve ShadCN\/UI k\u00fct\u00fcphanelerini kullanarak Google Sheets&#039;e benzer, g\u00fc\u00e7l\u00fc ve \u00f6zelle\u015ftirilebilir bir tablo bile\u015feni nas\u0131l olu\u015fturaca\u011f\u0131n\u0131z\u0131 ad\u0131m ad\u0131m a\u00e7\u0131klayaca\u011f\u0131m. Bu bile\u015fen, veri do\u011frulama, performans ve kullan\u0131c\u0131 deneyimi a\u00e7\u0131s\u0131ndan Google Sheets&#039;in sundu\u011fu bir\u00e7ok avantaj\u0131 taklit edecek. \u00d6ncelikle, her bir k\u00fct\u00fcphanenin rol\u00fcn\u00fc ve neden tercih edildi\u011fini inceleyelim.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/\" \/>\n<meta property=\"og:site_name\" content=\"Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" \/>\n<meta property=\"article:published_time\" content=\"2025-01-07T17:15:10+00:00\" \/>\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=\"3 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/\"},\"author\":{\"name\":\"Fatih Soysal\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"headline\":\"TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma\",\"datePublished\":\"2025-01-07T17:15:10+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/\"},\"wordCount\":586,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/#respond\"]}],\"copyrightYear\":\"2025\",\"copyrightHolder\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/\",\"name\":\"TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\"},\"datePublished\":\"2025-01-07T17:15:10+00:00\",\"description\":\"Merhaba! Bu yaz\u0131da, TanStack Table, Zod ve ShadCN\/UI k\u00fct\u00fcphanelerini kullanarak Google Sheets'e benzer, g\u00fc\u00e7l\u00fc ve \u00f6zelle\u015ftirilebilir bir tablo bile\u015feni nas\u0131l olu\u015fturaca\u011f\u0131n\u0131z\u0131 ad\u0131m ad\u0131m a\u00e7\u0131klayaca\u011f\u0131m. Bu bile\u015fen, veri do\u011frulama, performans ve kullan\u0131c\u0131 deneyimi a\u00e7\u0131s\u0131ndan Google Sheets'in sundu\u011fu bir\u00e7ok avantaj\u0131 taklit edecek. \u00d6ncelikle, her bir k\u00fct\u00fcphanenin rol\u00fcn\u00fc ve neden tercih edildi\u011fini inceleyelim.\",\"breadcrumb\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\/\/fatihsoysal.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma\"}]},{\"@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":"TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma","description":"Merhaba! Bu yaz\u0131da, TanStack Table, Zod ve ShadCN\/UI k\u00fct\u00fcphanelerini kullanarak Google Sheets'e benzer, g\u00fc\u00e7l\u00fc ve \u00f6zelle\u015ftirilebilir bir tablo bile\u015feni nas\u0131l olu\u015fturaca\u011f\u0131n\u0131z\u0131 ad\u0131m ad\u0131m a\u00e7\u0131klayaca\u011f\u0131m. Bu bile\u015fen, veri do\u011frulama, performans ve kullan\u0131c\u0131 deneyimi a\u00e7\u0131s\u0131ndan Google Sheets'in sundu\u011fu bir\u00e7ok avantaj\u0131 taklit edecek. \u00d6ncelikle, her bir k\u00fct\u00fcphanenin rol\u00fcn\u00fc ve neden tercih edildi\u011fini inceleyelim.","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\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/","og_locale":"tr_TR","og_type":"article","og_title":"TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma","og_description":"Merhaba! Bu yaz\u0131da, TanStack Table, Zod ve ShadCN\/UI k\u00fct\u00fcphanelerini kullanarak Google Sheets'e benzer, g\u00fc\u00e7l\u00fc ve \u00f6zelle\u015ftirilebilir bir tablo bile\u015feni nas\u0131l olu\u015fturaca\u011f\u0131n\u0131z\u0131 ad\u0131m ad\u0131m a\u00e7\u0131klayaca\u011f\u0131m. Bu bile\u015fen, veri do\u011frulama, performans ve kullan\u0131c\u0131 deneyimi a\u00e7\u0131s\u0131ndan Google Sheets'in sundu\u011fu bir\u00e7ok avantaj\u0131 taklit edecek. \u00d6ncelikle, her bir k\u00fct\u00fcphanenin rol\u00fcn\u00fc ve neden tercih edildi\u011fini inceleyelim.","og_url":"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/","og_site_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","article_published_time":"2025-01-07T17:15:10+00:00","author":"Fatih Soysal","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Fatih Soysal","Tahmini okuma s\u00fcresi":"3 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/#article","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/"},"author":{"name":"Fatih Soysal","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"headline":"TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma","datePublished":"2025-01-07T17:15:10+00:00","mainEntityOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/"},"wordCount":586,"commentCount":0,"publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/#respond"]}],"copyrightYear":"2025","copyrightHolder":{"@id":"https:\/\/fatihsoysal.com\/blog\/#organization"}},{"@type":"WebPage","@id":"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/","url":"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/","name":"TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/#website"},"datePublished":"2025-01-07T17:15:10+00:00","description":"Merhaba! Bu yaz\u0131da, TanStack Table, Zod ve ShadCN\/UI k\u00fct\u00fcphanelerini kullanarak Google Sheets'e benzer, g\u00fc\u00e7l\u00fc ve \u00f6zelle\u015ftirilebilir bir tablo bile\u015feni nas\u0131l olu\u015fturaca\u011f\u0131n\u0131z\u0131 ad\u0131m ad\u0131m a\u00e7\u0131klayaca\u011f\u0131m. Bu bile\u015fen, veri do\u011frulama, performans ve kullan\u0131c\u0131 deneyimi a\u00e7\u0131s\u0131ndan Google Sheets'in sundu\u011fu bir\u00e7ok avantaj\u0131 taklit edecek. \u00d6ncelikle, her bir k\u00fct\u00fcphanenin rol\u00fcn\u00fc ve neden tercih edildi\u011fini inceleyelim.","breadcrumb":{"@id":"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fatihsoysal.com\/blog\/tanstack-table-zod-ve-shadcn-ui-ile-google-sheets-benzeri-tablo-bileseni-olusturma\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/fatihsoysal.com\/blog\/"},{"@type":"ListItem","position":2,"name":"TanStack Table, Zod ve ShadCN\/UI ile Google Sheets Benzeri Tablo Bile\u015feni Olu\u015fturma"}]},{"@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\/8916","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=8916"}],"version-history":[{"count":0,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/8916\/revisions"}],"wp:attachment":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media?parent=8916"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/categories?post=8916"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/tags?post=8916"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}