{"id":42144,"date":"2026-05-28T21:04:42","date_gmt":"2026-05-28T18:04:42","guid":{"rendered":"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/"},"modified":"2026-05-28T21:04:42","modified_gmt":"2026-05-28T18:04:42","slug":"google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim","status":"publish","type":"post","link":"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/","title":{"rendered":"Google Takvim \u0130\u00e7in \u0130lk Chrome Eklentimi Geli\u015ftirirken Neler \u00d6\u011frendim?"},"content":{"rendered":"<h2>Google Takvim \u0130\u00e7in \u0130lk Chrome Eklentimi Geli\u015ftirirken Neler \u00d6\u011frendim?<\/h2>\n<p>G\u00fcnl\u00fck ya\u015fant\u0131m\u0131zda dijital ara\u00e7lar, \u00f6zellikle de Google Takvim, zaman y\u00f6netimimizin vazge\u00e7ilmez bir par\u00e7as\u0131 haline geldi. Ancak bazen bu ara\u00e7lar\u0131n standart \u00f6zellikleri ihtiya\u00e7lar\u0131m\u0131z\u0131 tam olarak kar\u015f\u0131lamayabilir. \u0130\u015fte tam bu noktada, ki\u015fiselle\u015ftirilmi\u015f bir deneyim sunan Chrome uzant\u0131lar\u0131 (eklentileri) devreye giriyor. Peki, kendi Chrome uzant\u0131n\u0131z\u0131 geli\u015ftirmek kula\u011fa nas\u0131l geliyor? Bu makalede, Google Takvim deneyimimi zenginle\u015ftirmek amac\u0131yla ilk Chrome uzant\u0131m\u0131 geli\u015ftirirken edindi\u011fim bilgi ve deneyimleri ad\u0131m ad\u0131m payla\u015faca\u011f\u0131m. Bu s\u00fcre\u00e7, sadece kod yazmaktan ibaret de\u011fil, ayn\u0131 zamanda problem \u00e7\u00f6zme, kullan\u0131c\u0131 deneyimi tasar\u0131m\u0131 ve platform k\u0131s\u0131tlamalar\u0131n\u0131 anlama \u00fczerine kurulu bir \u00f6\u011frenme yolculu\u011fuydu. Haz\u0131rsan\u0131z, bu heyecan verici d\u00fcnyaya birlikte dalal\u0131m!<\/p>\n<h2>Neden Bir Chrome Eklentisi Geli\u015ftirmeliyim ve Fikrim Nas\u0131l Ortaya \u00c7\u0131kt\u0131?<\/h2>\n<p>Modern web taray\u0131c\u0131lar\u0131, sadece internet sayfalar\u0131n\u0131 g\u00f6r\u00fcnt\u00fclemekten \u00e7ok daha fazlas\u0131n\u0131 sunar. Chrome uzant\u0131lar\u0131, taray\u0131c\u0131n\u0131za yeni \u00f6zellikler eklemenize, web sitelerinin davran\u0131\u015flar\u0131n\u0131 de\u011fi\u015ftirmenize veya mevcut web uygulamalar\u0131n\u0131 ki\u015fiselle\u015ftirmenize olanak tan\u0131yan k\u00fc\u00e7\u00fck yaz\u0131l\u0131m par\u00e7alar\u0131d\u0131r. Bu eklentiler, \u00fcretkenli\u011finizi art\u0131rmaktan, web g\u00fcvenli\u011finizi sa\u011flamaya, hatta sadece e\u011flenceli yeni \u00f6zellikler eklemeye kadar geni\u015f bir yelpazede kullan\u0131labilir. Benim durumumda, Google Takvim&#8217;i yo\u011fun bir \u015fekilde kullanan biri olarak, toplant\u0131 notlar\u0131n\u0131 daha h\u0131zl\u0131 ve pratik bir \u015fekilde ekleyebilece\u011fim bir araca ihtiya\u00e7 duyuyordum. Her toplant\u0131 sonras\u0131 notlar\u0131 ayr\u0131 bir yere yazmak veya takvim etkinli\u011finin detaylar\u0131na girip manuel olarak eklemek zaman al\u0131c\u0131 ve tekrarlayan bir i\u015f haline gelmi\u015fti.<\/p>\n<p>Bu ihtiya\u00e7tan yola \u00e7\u0131karak, &#8220;Google Takvim Etkinliklerine H\u0131zl\u0131 Not Ekleme&#8221; ad\u0131n\u0131 verdi\u011fim bir eklenti fikri do\u011fdu. Temel amac\u0131, Google Takvim aray\u00fcz\u00fcnde belirli bir etkinli\u011fe t\u0131klad\u0131\u011f\u0131mda a\u00e7\u0131lan pencereye, h\u0131zl\u0131ca not ekleyebilece\u011fim bir metin alan\u0131 ve kaydet butonu eklemekti. B\u00f6ylece, toplant\u0131 bitiminde veya hemen sonras\u0131nda, takvimden ayr\u0131lmadan ilgili etkinli\u011fe \u00f6nemli maddeleri veya kararlar\u0131 not d\u00fc\u015febilecektim. Bu basit ama etkili \u00f6zellik, g\u00fcnl\u00fck i\u015f ak\u0131\u015f\u0131m\u0131 \u00f6nemli \u00f6l\u00e7\u00fcde h\u0131zland\u0131racakt\u0131. Bu fikir, sadece kendi sorunumu \u00e7\u00f6zmekle kalmay\u0131p, benzer ihtiya\u00e7lar\u0131 olan di\u011fer kullan\u0131c\u0131lar i\u00e7in de faydal\u0131 olabilece\u011fi d\u00fc\u015f\u00fcncesiyle beni daha da motive etti.<\/p>\n<p>Bir eklenti geli\u015ftirme s\u00fcrecine ba\u015flamadan \u00f6nce, projenin kapsam\u0131n\u0131 ve temel \u00f6zelliklerini net bir \u015fekilde belirlemek kritik \u00f6neme sahiptir. Benim i\u00e7in bu, a\u015fa\u011f\u0131daki sorular\u0131 yan\u0131tlamak anlam\u0131na geliyordu:<\/p>\n<ul>\n<li>Eklenti tam olarak ne yapacak? (Google Takvim etkinliklerine not ekleme)<\/li>\n<li>Hangi kullan\u0131c\u0131 aray\u00fcz\u00fc elementlerini kullanacak? (Metin alan\u0131, kaydet butonu)<\/li>\n<li>Verileri nerede saklayacak? (<code>chrome.storage<\/code> veya do\u011frudan takvim etkinli\u011fine mi?)<\/li>\n<li>Hangi taray\u0131c\u0131 izinlerine ihtiyac\u0131 olacak? (Google Takvim sayfas\u0131n\u0131 okuma ve de\u011fi\u015ftirme)<\/li>\n<li>Kullan\u0131c\u0131 deneyimi nas\u0131l olacak? (Kolay ve sezgisel)<\/li>\n<\/ul>\n<p>Bu sorulara verilen yan\u0131tlar, geli\u015ftirme s\u00fcrecinin yol haritas\u0131n\u0131 olu\u015fturmama yard\u0131mc\u0131 oldu. \u00d6zellikle, Google Takvim&#8217;in dinamik yap\u0131s\u0131 ve DOM (Belge Nesne Modeli) de\u011fi\u015fiklikleri, i\u00e7erik betiklerinin (content scripts) nas\u0131l \u00e7al\u0131\u015faca\u011f\u0131n\u0131 planlarken dikkat etmem gereken \u00f6nemli bir fakt\u00f6rd\u00fc. Ayr\u0131ca, Chrome uzant\u0131lar\u0131n\u0131n g\u00fcvenlik modeli ve Manifest V3&#8217;\u00fcn getirdi\u011fi yenilikler de ba\u015ftan ara\u015ft\u0131r\u0131lmas\u0131 gereken konulard\u0131. Bu haz\u0131rl\u0131k a\u015famas\u0131, sonraki ad\u0131mlarda kar\u015f\u0131la\u015fabilece\u011fim potansiyel sorunlar\u0131 \u00f6ng\u00f6rmemi ve daha sa\u011flam bir temel \u00fczerine in\u015fa etmemi sa\u011flad\u0131.<\/p>\n<h2>Chrome Eklentisi Geli\u015ftirmenin Temel Kavramlar\u0131 ve Manifest V3 Ge\u00e7i\u015fi Nas\u0131l Ger\u00e7ekle\u015fti?<\/h2>\n<p>Bir Chrome uzant\u0131s\u0131 geli\u015ftirmeye ba\u015flamadan \u00f6nce, temel yap\u0131 ta\u015flar\u0131n\u0131 anlamak olduk\u00e7a \u00f6nemlidir. Her uzant\u0131n\u0131n kalbinde, uzant\u0131n\u0131n ad\u0131n\u0131, s\u00fcr\u00fcm\u00fcn\u00fc, izinlerini ve hangi betiklerin ne zaman \u00e7al\u0131\u015faca\u011f\u0131n\u0131 tan\u0131mlayan bir <code>manifest.json<\/code> dosyas\u0131 bulunur. Bu dosya, uzant\u0131n\u0131z\u0131n kimlik kart\u0131 gibidir. Ayr\u0131ca, uzant\u0131lar genellikle \u00fc\u00e7 ana bile\u015fenden olu\u015fur: a\u00e7\u0131l\u0131r pencere (popup), arka plan beti\u011fi (background script) ve i\u00e7erik beti\u011fi (content script).<\/p>\n<ul>\n<li><strong>A\u00e7\u0131l\u0131r Pencere (Popup):<\/strong> Taray\u0131c\u0131 ara\u00e7 \u00e7ubu\u011fundaki uzant\u0131 simgesine t\u0131kland\u0131\u011f\u0131nda a\u00e7\u0131lan k\u00fc\u00e7\u00fck bir HTML sayfas\u0131d\u0131r. Kullan\u0131c\u0131n\u0131n uzant\u0131yla etkile\u015fim kurdu\u011fu ana aray\u00fcz\u00fc sa\u011flar. Benim not ekleme eklentimde, bu k\u0131s\u0131m belki de do\u011frudan takvim aray\u00fcz\u00fcne entegre olaca\u011f\u0131 i\u00e7in daha az \u00f6n planda olabilirdi, ancak genel ayarlar i\u00e7in kullan\u0131labilirdi.<\/li>\n<li><strong>Arka Plan Beti\u011fi (Background Script):<\/strong> Uzant\u0131n\u0131n kal\u0131c\u0131 olmayan, olay tabanl\u0131 bir beti\u011fidir. Taray\u0131c\u0131 olaylar\u0131n\u0131 (sekme olu\u015fturma, gezinme, mesajla\u015fma vb.) dinler ve yan\u0131t verir. Genellikle uzun s\u00fcreli i\u015flemler, API \u00e7a\u011fr\u0131lar\u0131 veya di\u011fer betikler aras\u0131nda koordinasyon sa\u011flamak i\u00e7in kullan\u0131l\u0131r. Manifest V3 ile birlikte &#8220;Service Worker&#8221; olarak yeniden adland\u0131r\u0131ld\u0131 ve daha verimli hale getirildi.<\/li>\n<li><strong>\u0130\u00e7erik Beti\u011fi (Content Script):<\/strong> Web sayfalar\u0131na JavaScript ve CSS enjekte ederek, o sayfalar\u0131n DOM&#8217;unu (Belge Nesne Modeli) de\u011fi\u015ftirebilen veya okuyabilen betiklerdir. Google Takvim sayfas\u0131ndaki etkinlik detaylar\u0131na not ekleme alan\u0131n\u0131 yerle\u015ftirmek i\u00e7in bu betikleri kulland\u0131m.<\/li>\n<\/ul>\n<p>Geli\u015ftirme s\u00fcrecimde kar\u015f\u0131la\u015ft\u0131\u011f\u0131m en b\u00fcy\u00fck de\u011fi\u015fikliklerden biri, Chrome uzant\u0131lar\u0131n\u0131n Manifest V2&#8217;den Manifest V3&#8217;e ge\u00e7i\u015fiydi. Bu ge\u00e7i\u015f, g\u00fcvenlik, performans ve gizlilik iyile\u015ftirmeleri getiren \u00f6nemli bir ad\u0131md\u0131. Manifest V3&#8217;\u00fcn getirdi\u011fi ba\u015fl\u0131ca de\u011fi\u015fiklikler \u015funlard\u0131:<\/p>\n<ul>\n<li><strong>Service Worker&#8217;lar:<\/strong> Arka plan betikleri yerine Service Worker&#8217;lar kullan\u0131lmaya ba\u015fland\u0131. Bu, daha verimli kaynak kullan\u0131m\u0131 ve olay tabanl\u0131 \u00e7al\u0131\u015fma anlam\u0131na geliyordu. Service Worker&#8217;lar, sadece bir olaya ihtiya\u00e7 duyuldu\u011funda etkinle\u015fir ve i\u015fleri bitti\u011finde ask\u0131ya al\u0131n\u0131r, bu da bellek ve CPU kullan\u0131m\u0131n\u0131 optimize eder.<\/li>\n<li><strong>Geli\u015ftirilmi\u015f G\u00fcvenlik:<\/strong> Uzant\u0131lar\u0131n uzaktan bar\u0131nd\u0131r\u0131lan kod \u00e7al\u0131\u015ft\u0131rmas\u0131 yasakland\u0131. T\u00fcm kodun uzant\u0131 paketi i\u00e7inde bulunmas\u0131 gerekiyor. Bu, k\u00f6t\u00fc ama\u00e7l\u0131 yaz\u0131l\u0131mlar\u0131n yay\u0131lmas\u0131n\u0131 engellemek i\u00e7in \u00f6nemli bir g\u00fcvenlik \u00f6nlemiydi.<\/li>\n<li><strong>Bildirimsel A\u011f \u0130stekleri (Declarative Net Request API):<\/strong> Web isteklerini engelleme veya de\u011fi\u015ftirme yetene\u011fi, daha g\u00fcvenli ve performans\u0131 art\u0131r\u0131lm\u0131\u015f bir API ile s\u0131n\u0131rland\u0131r\u0131ld\u0131. Bu, uzant\u0131lar\u0131n a\u011f isteklerini daha kontroll\u00fc bir \u015fekilde y\u00f6netmesini sa\u011fl\u0131yor.<\/li>\n<li><strong>Promise Tabanl\u0131 API&#8217;ler:<\/strong> Bir\u00e7ok Chrome API&#8217;si geri arama (callback) tabanl\u0131 yakla\u015f\u0131mdan Promise tabanl\u0131 yakla\u015f\u0131ma ge\u00e7ti, bu da asenkron kod yazmay\u0131 daha modern ve okunabilir hale getirdi.<\/li>\n<\/ul>\n<p>Manifest V3&#8217;e ge\u00e7i\u015f, mevcut uzant\u0131lar i\u00e7in baz\u0131 yeniden yazma gereksinimleri do\u011furmu\u015f olsa da, uzun vadede daha g\u00fcvenli, kararl\u0131 ve performansl\u0131 uzant\u0131lar geli\u015ftirmeye olanak tan\u0131yor. Benim ilk uzant\u0131m oldu\u011fu i\u00e7in do\u011frudan Manifest V3 standartlar\u0131na uygun bir \u015fekilde ba\u015flad\u0131m, bu da eski s\u00fcr\u00fcmden ge\u00e7i\u015fin getirdi\u011fi zorluklar\u0131 ya\u015famam\u0131 engelledi. Ancak, yeni API&#8217;leri ve Service Worker ya\u015fam d\u00f6ng\u00fcs\u00fcn\u00fc anlamak i\u00e7in ekstra \u00e7aba sarf etmem gerekti. \u00d6zellikle, Service Worker&#8217;lar\u0131n kal\u0131c\u0131 olmamas\u0131, durum y\u00f6netimi ve mesajla\u015fma mekanizmalar\u0131 \u00fczerinde daha dikkatli d\u00fc\u015f\u00fcnmemi sa\u011flad\u0131. \u00d6rne\u011fin, kullan\u0131c\u0131 aray\u00fcz\u00fcnden (popup veya i\u00e7erik beti\u011fi) bir Service Worker&#8217;a mesaj g\u00f6ndermek ve ondan yan\u0131t almak, uzant\u0131n\u0131n farkl\u0131 bile\u015fenlerinin birbiriyle nas\u0131l ileti\u015fim kurdu\u011funu anlamak a\u00e7\u0131s\u0131ndan kilit bir noktayd\u0131. Bu temel kavramlar\u0131 ve Manifest V3&#8217;\u00fcn getirdi\u011fi yenilikleri kavramak, ba\u015far\u0131l\u0131 bir uzant\u0131 geli\u015ftirmenin ilk ve en \u00f6nemli ad\u0131m\u0131yd\u0131.<\/p>\n<h2>Ad\u0131m Ad\u0131m \u0130lk Chrome Eklentimi Geli\u015ftirme S\u00fcreci: Koddan Ger\u00e7ekli\u011fe<\/h2>\n<p>Fikrimi netle\u015ftirdikten ve temel kavramlar\u0131 anlad\u0131ktan sonra, s\u0131ra kod yazmaya gelmi\u015fti. Google Takvim etkinliklerine h\u0131zl\u0131 not ekleme eklentimin geli\u015ftirme s\u00fcreci, a\u015fa\u011f\u0131daki ad\u0131mlar\u0131 i\u00e7eriyordu:<\/p>\n<h3>1. Proje Yap\u0131s\u0131n\u0131n Olu\u015fturulmas\u0131 ve Manifest.json Dosyas\u0131<\/h3>\n<p>\u0130lk ad\u0131m, projem i\u00e7in temel bir klas\u00f6r yap\u0131s\u0131 olu\u015fturmakt\u0131. \u0130\u00e7erisinde <code>manifest.json<\/code>, <code>popup.html<\/code>, <code>popup.js<\/code>, <code>content.js<\/code> ve belki de <code>background.js<\/code> (Service Worker) dosyalar\u0131n\u0131 bar\u0131nd\u0131racakt\u0131. <code>manifest.json<\/code> dosyas\u0131, uzant\u0131m\u0131n kimli\u011fini ve izinlerini tan\u0131mlayan en \u00f6nemli par\u00e7ayd\u0131. Manifest V3&#8217;e uygun bir \u015fekilde a\u015fa\u011f\u0131daki gibi bir yap\u0131 olu\u015fturdum:<\/p>\n<div class=\"code-container\">\n<pre><code>\n{\n  \"manifest_version\": 3,\n  \"name\": \"H\u0131zl\u0131 Takvim Notlar\u0131\",\n  \"version\": \"1.0\",\n  \"description\": \"Google Takvim etkinliklerine h\u0131zl\u0131ca not ekleyin.\",\n  \"icons\": {\n    \"16\": \"icons\/icon16.png\",\n    \"48\": \"icons\/icon48.png\",\n    \"128\": \"icons\/icon128.png\"\n  },\n  \"action\": {\n    \"default_popup\": \"popup.html\",\n    \"default_icon\": {\n      \"16\": \"icons\/icon16.png\",\n      \"48\": \"icons\/icon48.png\"\n    }\n  },\n  \"permissions\": [\n    \"activeTab\",\n    \"storage\",\n    \"scripting\"\n  ],\n  \"host_permissions\": [\n    \"https:\/\/calendar.google.com\/*\"\n  ],\n  \"background\": {\n    \"service_worker\": \"background.js\"\n  },\n  \"content_scripts\": [\n    {\n      \"matches\": [\"https:\/\/calendar.google.com\/*\"],\n      \"js\": [\"content.js\"],\n      \"css\": [\"content.css\"]\n    }\n  ]\n}\n      <\/code><\/pre>\n<\/p><\/div>\n<p>Bu manifest dosyas\u0131, uzant\u0131m\u0131n Google Takvim sayfalar\u0131nda \u00e7al\u0131\u015faca\u011f\u0131n\u0131 (<code>host_permissions<\/code>), kullan\u0131c\u0131 aray\u00fcz\u00fc i\u00e7in bir popup&#8217;a sahip olaca\u011f\u0131n\u0131 (<code>action<\/code>), verileri depolayabilece\u011fini (<code>storage<\/code>) ve mevcut sekmede betik \u00e7al\u0131\u015ft\u0131rabilece\u011fini (<code>scripting<\/code>) belirtiyordu. <code>background.js<\/code> dosyas\u0131 ise Service Worker olarak g\u00f6rev yapacakt\u0131.<\/p>\n<h3>2. \u0130\u00e7erik Beti\u011fi (Content Script) ile Google Takvim Sayfas\u0131na M\u00fcdahale<\/h3>\n<p>Eklentimin temel i\u015flevi, Google Takvim sayfas\u0131ndaki bir etkinli\u011fe t\u0131kland\u0131\u011f\u0131nda a\u00e7\u0131lan detay penceresine not ekleme alan\u0131n\u0131 yerle\u015ftirmekti. Bu, i\u00e7erik beti\u011fi (<code>content.js<\/code>) arac\u0131l\u0131\u011f\u0131yla yap\u0131ld\u0131. Google Takvim&#8217;in DOM yap\u0131s\u0131 olduk\u00e7a dinamik oldu\u011fu i\u00e7in, not alan\u0131n\u0131 eklemek istedi\u011fim \u00f6\u011feyi bulmak ve onun g\u00f6r\u00fcn\u00fcrl\u00fc\u011f\u00fcn\u00fc takip etmek zorlay\u0131c\u0131 oldu. <code>MutationObserver<\/code> API&#8217;si, DOM de\u011fi\u015fikliklerini izlemek i\u00e7in bu noktada hayat kurtar\u0131c\u0131yd\u0131. Bir etkinlik detay penceresi a\u00e7\u0131ld\u0131\u011f\u0131nda, <code>MutationObserver<\/code> bu de\u011fi\u015fikli\u011fi alg\u0131layacak ve not ekleme alan\u0131m\u0131 dinamik olarak olu\u015fturup pencereye enjekte edecekti.<\/p>\n<div class=\"code-container\">\n<pre><code>\n\/\/ content.js\nconst addNoteSection = () => {\n  const eventDetailsPanel = document.querySelector('[role=\"dialog\"][aria-modal=\"true\"]');\n  if (eventDetailsPanel && !eventDetailsPanel.querySelector('#quick-note-section')) {\n    const noteSection = document.createElement('div');\n    noteSection.id = 'quick-note-section';\n    noteSection.innerHTML = <code>&lt;h3&gt;H\u0131zl\u0131 Notlar&lt;\/h3&gt;\n      &lt;textarea id=&quot;event-note-textarea&quot; placeholder=&quot;Buraya notlar\u0131n\u0131z\u0131 yaz\u0131n...&quot; style=&quot;width:100%; height:100px; resize:vertical;&quot;&gt;&lt;\/textarea&gt;\n      &lt;button id=&quot;save-note-button&quot; style=&quot;margin-top:10px; padding:8px 15px; background-color:#4285F4; color:white; border:none; border-radius:4px; cursor:pointer;&quot;&gt;Notu Kaydet&lt;\/button&gt;<\/code>;\n    \/\/ Not alan\u0131n\u0131 uygun bir yere ekle (\u00f6rne\u011fin, a\u00e7\u0131klama k\u0131sm\u0131n\u0131n alt\u0131na)\n    const descriptionContainer = eventDetailsPanel.querySelector('div[data-ogpc-section-id=\"description\"]');\n    if (descriptionContainer) {\n      descriptionContainer.after(noteSection);\n    } else {\n      \/\/ E\u011fer a\u00e7\u0131klama k\u0131sm\u0131 yoksa, ba\u015fka bir yere ekle\n      const closeButton = eventDetailsPanel.querySelector('button[aria-label=\"Kapat\"]');\n      if (closeButton) {\n        closeButton.parentElement.after(noteSection);\n      }\n    }\n\n    document.getElementById('save-note-button').addEventListener('click', () => {\n      const note = document.getElementById('event-note-textarea').value;\n      const eventId = window.location.hash.split('\/event\/')[1]?.split('?')[0]; \/\/ Etkinlik ID'sini URL'den al\n      if (eventId && note) {\n        chrome.runtime.sendMessage({ action: \"saveNote\", eventId: eventId, note: note });\n      }\n    });\n\n    \/\/ Kaydedilmi\u015f notu y\u00fckle\n    const eventId = window.location.hash.split('\/event\/')[1]?.split('?')[0];\n    if (eventId) {\n      chrome.runtime.sendMessage({ action: \"getNote\", eventId: eventId }, (response) => {\n        if (response && response.note) {\n          document.getElementById('event-note-textarea').value = response.note;\n        }\n      });\n    }\n  }\n};\n\nconst observer = new MutationObserver((mutations) => {\n  mutations.forEach((mutation) => {\n    if (mutation.addedNodes.length > 0) {\n      \/\/ Etkinlik detay penceresinin a\u00e7\u0131ld\u0131\u011f\u0131n\u0131 kontrol et\n      const dialog = Array.from(mutation.addedNodes).find(node => node.nodeType === 1 && node.getAttribute && node.getAttribute('role') === 'dialog' && node.getAttribute('aria-modal') === 'true');\n      if (dialog) {\n        setTimeout(addNoteSection, 100); \/\/ Pencerenin tamamen y\u00fcklenmesini beklemek i\u00e7in k\u0131sa bir gecikme\n      }\n    }\n  });\n});\n\nobserver.observe(document.body, { childList: true, subtree: true });\n      <\/code><\/pre>\n<\/p><\/div>\n<p>Yukar\u0131daki kod par\u00e7ac\u0131\u011f\u0131, bir etkinlik detay penceresi a\u00e7\u0131ld\u0131\u011f\u0131nda DOM&#8217;a bir not alan\u0131 ekliyor ve kaydet butonuna t\u0131klan\u0131ld\u0131\u011f\u0131nda <code>background.js<\/code>&#8216;e bir mesaj g\u00f6nderiyor. Notlar\u0131n, etkinlik ID&#8217;si ile ili\u015fkilendirilerek <code>chrome.storage<\/code>&#8216;da saklanmas\u0131 planland\u0131.<\/p>\n<h3>3. Arka Plan Beti\u011fi (Service Worker) ile Veri Saklama<\/h3>\n<p><code>background.js<\/code> (Service Worker), i\u00e7erik beti\u011finden gelen mesajlar\u0131 dinleyecek ve notlar\u0131 <code>chrome.storage.sync<\/code> API&#8217;sini kullanarak depolayacakt\u0131. <code>chrome.storage.sync<\/code>, kullan\u0131c\u0131 verilerini Chrome hesaplar\u0131 aras\u0131nda senkronize etme avantaj\u0131 sunar, bu da kullan\u0131c\u0131lar\u0131n farkl\u0131 cihazlarda ayn\u0131 notlara eri\u015febilece\u011fi anlam\u0131na gelir.<\/p>\n<div class=\"code-container\">\n<pre><code>\n\/\/ background.js\nchrome.runtime.onMessage.addListener((request, sender, sendResponse) => {\n  if (request.action === \"saveNote\") {\n    const data = {};\n    data[request.eventId] = request.note;\n    chrome.storage.sync.set(data, () => {\n      console.log('Not kaydedildi:', request.eventId, request.note);\n      sendResponse({ status: \"success\" });\n    });\n    return true; \/\/ Asenkron yan\u0131t i\u00e7in\n  } else if (request.action === \"getNote\") {\n    chrome.storage.sync.get(request.eventId, (result) => {\n      sendResponse({ note: result[request.eventId] });\n    });\n    return true; \/\/ Asenkron yan\u0131t i\u00e7in\n  }\n});\n      <\/code><\/pre>\n<\/p><\/div>\n<p>Bu Service Worker kodu, <code>saveNote<\/code> mesaj\u0131n\u0131 ald\u0131\u011f\u0131nda notu kaydederken, <code>getNote<\/code> mesaj\u0131n\u0131 ald\u0131\u011f\u0131nda ilgili etkinli\u011fe ait notu geri d\u00f6nd\u00fcr\u00fcyor. Bu mesajla\u015fma mekanizmas\u0131 (<code>chrome.runtime.sendMessage<\/code>), uzant\u0131n\u0131n farkl\u0131 par\u00e7alar\u0131n\u0131n birbiriyle g\u00fcvenli ve verimli bir \u015fekilde ileti\u015fim kurmas\u0131n\u0131 sa\u011fl\u0131yor.<\/p>\n<h3>4. Kullan\u0131c\u0131 Aray\u00fcz\u00fc (Popup) Geli\u015ftirme<\/h3>\n<p>Bu eklentide popup, temel olarak genel ayarlar veya h\u0131zl\u0131 eri\u015fim i\u00e7in kullan\u0131labilir. \u00d6rne\u011fin, t\u00fcm notlar\u0131 g\u00f6r\u00fcnt\u00fcleme veya eklentiyi devre d\u0131\u015f\u0131 b\u0131rakma gibi se\u00e7enekler sunabilir. Basit bir <code>popup.html<\/code> ve <code>popup.js<\/code> dosyas\u0131 ile bu k\u0131sm\u0131 da tamamlad\u0131m.<\/p>\n<div class=\"code-container\"><\/div>\n<div class=\"code-container\">\n<pre><code>\n\/\/ popup.js\ndocument.getElementById('openCalendar').addEventListener('click', () => {\n  chrome.tabs.create({ url: 'https:\/\/calendar.google.com' });\n});\n      <\/code><\/pre>\n<\/p><\/div>\n<p>Bu ad\u0131mlar, eklentimin temel i\u015flevselli\u011fini olu\u015fturan \u00e7ekirdek k\u0131s\u0131mlard\u0131. Geli\u015ftirme s\u00fcreci boyunca, Google Takvim&#8217;in s\u00fcrekli de\u011fi\u015fen DOM yap\u0131s\u0131 nedeniyle baz\u0131 \u00f6\u011feleri se\u00e7mekte zorland\u0131m ve bu da beni daha esnek se\u00e7iciler kullanmaya veya <code>MutationObserver<\/code> gibi ara\u00e7lara ba\u015fvurmaya itti. Bu deneyim, web sayfalar\u0131n\u0131n dinamik do\u011fas\u0131yla ba\u015fa \u00e7\u0131kman\u0131n ve sa\u011flam i\u00e7erik betikleri yazman\u0131n \u00f6nemini vurgulad\u0131. Sonu\u00e7 olarak, ilk Chrome eklentimi ba\u015far\u0131yla hayata ge\u00e7irdim ve Google Takvim deneyimimi ki\u015fisel ihtiya\u00e7lar\u0131ma g\u00f6re uyarlamay\u0131 ba\u015fard\u0131m.<\/p>\n<h2>Kar\u015f\u0131la\u015f\u0131lan Zorluklar ve \u00c7\u00f6z\u00fcmleri: Google Takvim&#8217;in Dinamik Yap\u0131s\u0131yla Ba\u015fa \u00c7\u0131kmak<\/h2>\n<p>\u0130lk Chrome eklentimi geli\u015ftirirken, teorik bilgiden prati\u011fe ge\u00e7erken bir\u00e7ok beklenmedik zorlukla kar\u015f\u0131la\u015ft\u0131m. \u00d6zellikle Google Takvim gibi karma\u015f\u0131k ve dinamik bir web uygulamas\u0131nda \u00e7al\u0131\u015fmak, baz\u0131 \u00f6zel sorunlar\u0131 beraberinde getirdi. Bu zorluklar\u0131n \u00fcstesinden gelmek, problem \u00e7\u00f6zme becerilerimi geli\u015ftirmemi ve web geli\u015ftirmenin derinliklerine inmemi sa\u011flad\u0131.<\/p>\n<h3>1. Google Takvim&#8217;in Dinamik DOM Yap\u0131s\u0131<\/h3>\n<p>Google Takvim, React veya Angular gibi modern JavaScript framework&#8217;leri kullan\u0131larak geli\u015ftirilmi\u015f dinamik bir uygulamad\u0131r. Bu, sayfan\u0131n i\u00e7eri\u011finin kullan\u0131c\u0131 etkile\u015fimlerine veya veri g\u00fcncellemelerine g\u00f6re s\u00fcrekli olarak de\u011fi\u015fti\u011fi anlam\u0131na gelir. Benim eklentim, bir etkinlik detay penceresi a\u00e7\u0131ld\u0131\u011f\u0131nda DOM&#8217;a yeni elementler (not alan\u0131 ve kaydet butonu) eklemeyi hedefliyordu. Ancak, bu pencere her zaman ayn\u0131 HTML yap\u0131s\u0131yla veya ayn\u0131 zamanda y\u00fcklenmiyordu. \u0130lk denemelerimde, not alan\u0131n\u0131 eklemeye \u00e7al\u0131\u015ft\u0131\u011f\u0131mda ilgili DOM elementinin hen\u00fcz var olmamas\u0131 veya yanl\u0131\u015f bir elemente eklenmesi gibi sorunlarla kar\u015f\u0131la\u015ft\u0131m.<\/p>\n<p><strong>\u00c7\u00f6z\u00fcm:<\/strong> Bu sorunu a\u015fmak i\u00e7in <code>MutationObserver<\/code> API&#8217;sini kulland\u0131m. <code>MutationObserver<\/code>, belirli bir DOM a\u011fac\u0131ndaki de\u011fi\u015fiklikleri (element ekleme, silme, \u00f6znitelik de\u011fi\u015ftirme vb.) izlememe olanak tan\u0131d\u0131. B\u00f6ylece, Google Takvim sayfas\u0131nda bir etkinlik detay penceresi (<code>role=\"dialog\"<\/code> ve <code>aria-modal=\"true\"<\/code> \u00f6zniteliklerine sahip bir <code>div<\/code>) DOM&#8217;a eklendi\u011finde bunu alg\u0131layabiliyor ve not alan\u0131m\u0131 g\u00fcvenli bir \u015fekilde enjekte edebiliyordum. Ayr\u0131ca, not alan\u0131n\u0131 ekleyece\u011fim kesin konumu bulmak i\u00e7in daha esnek CSS se\u00e7icileri (\u00f6rne\u011fin, <code>div[data-ogpc-section-id=\"description\"]<\/code> gibi veri \u00f6zniteliklerini kullanan se\u00e7iciler) kulland\u0131m. Bazen, belirli bir elementin tamamen y\u00fcklenmesi i\u00e7in k\u00fc\u00e7\u00fck bir <code>setTimeout<\/code> gecikmesi eklemek de i\u015fe yarad\u0131.<\/p>\n<h3>2. Manifest V3 ve Service Worker Ya\u015fam D\u00f6ng\u00fcs\u00fc<\/h3>\n<p>Manifest V3&#8217;e ge\u00e7i\u015f, arka plan betiklerinin (background scripts) Service Worker&#8217;lara d\u00f6n\u00fc\u015fmesiyle \u00f6nemli bir paradigma de\u011fi\u015fikli\u011fi getirdi. Service Worker&#8217;lar olay tabanl\u0131d\u0131r ve i\u015fleri bitti\u011finde ask\u0131ya al\u0131n\u0131rlar. Bu, eski Manifest V2&#8217;deki gibi s\u00fcrekli \u00e7al\u0131\u015fan bir arka plan beti\u011fine sahip olamayaca\u011f\u0131m anlam\u0131na geliyordu. \u00d6zellikle, i\u00e7erik beti\u011fi ile Service Worker aras\u0131nda mesajla\u015fma yaparken veya Service Worker&#8217;\u0131n belirli bir durumu s\u00fcrd\u00fcrmesi gerekti\u011finde bu durum zorluklara yol a\u00e7t\u0131.<\/p>\n<p><strong>\u00c7\u00f6z\u00fcm:<\/strong> Service Worker&#8217;lar\u0131n olay tabanl\u0131 do\u011fas\u0131n\u0131 anlamak ve buna uygun kod yazmak kritikti. <code>chrome.runtime.onMessage.addListener<\/code> olay dinleyicisini kullanarak i\u00e7erik beti\u011fi ile Service Worker aras\u0131nda mesajla\u015fmay\u0131 sa\u011flad\u0131m. Service Worker&#8217;\u0131n durumunu s\u00fcrd\u00fcrmesi gereken durumlarda ise <code>chrome.storage<\/code> API&#8217;sini kulland\u0131m. Bu API, verileri kal\u0131c\u0131 olarak saklamam\u0131 ve Service Worker ask\u0131ya al\u0131nsa bile bu verilere tekrar eri\u015febilmemi sa\u011flad\u0131. Asenkron i\u015flemler i\u00e7in Promise tabanl\u0131 API&#8217;leri kullanmak, kodumu daha okunabilir ve y\u00f6netilebilir hale getirdi.<\/p>\n<h3>3. Etkinlik ID&#8217;sinin G\u00fcvenilir Bir \u015eekilde Al\u0131nmas\u0131<\/h3>\n<p>Notlar\u0131 do\u011fru etkinlikle ili\u015fkilendirebilmek i\u00e7in her bir Google Takvim etkinli\u011finin benzersiz bir ID&#8217;sine ihtiyac\u0131m vard\u0131. Ancak, Google Takvim aray\u00fcz\u00fcnde bu ID her zaman a\u00e7\u0131k\u00e7a g\u00f6r\u00fcn\u00fcr de\u011fildi veya kolayca eri\u015filebilir bir DOM elementinde bulunmuyordu. URL&#8217;deki karma\u015f\u0131k hash de\u011ferlerinden veya dinamik olarak olu\u015fturulan DOM \u00f6zniteliklerinden bu ID&#8217;yi \u00e7\u0131karmak gerekiyordu.<\/p>\n<p><strong>\u00c7\u00f6z\u00fcm:<\/strong> URL&#8217;deki hash k\u0131sm\u0131n\u0131 dikkatlice inceleyerek etkinlik ID&#8217;sini \u00e7\u0131karmay\u0131 ba\u015fard\u0131m. Google Takvim&#8217;de bir etkinli\u011fe t\u0131kland\u0131\u011f\u0131nda URL genellikle <code>#event\/EVENT_ID?detailsPage=...<\/code> \u015feklinde de\u011fi\u015fiyordu. Bu yap\u0131y\u0131 kullanarak <code>window.location.hash<\/code> de\u011ferini par\u00e7alara ay\u0131r\u0131p etkinlik ID&#8217;sini alabiliyordum. Bu y\u00f6ntem, \u00e7o\u011fu durumda g\u00fcvenilir olsa da, Google&#8217;\u0131n URL yap\u0131s\u0131n\u0131 de\u011fi\u015ftirmesi durumunda gelecekte potansiyel bir k\u0131r\u0131lma noktas\u0131 olabilirdi. Bu t\u00fcr d\u0131\u015f ba\u011f\u0131ml\u0131l\u0131klara kar\u015f\u0131 tetikte olmak ve d\u00fczenli testler yapmak, uzant\u0131n\u0131n uzun \u00f6m\u00fcrl\u00fc olmas\u0131 i\u00e7in \u00f6nemliydi.<\/p>\n<p>Bu zorluklar, sadece teknik bilgi de\u011fil, ayn\u0131 zamanda sab\u0131r ve s\u00fcrekli deneme-yan\u0131lma gerektiren bir \u00f6\u011frenme s\u00fcrecinin par\u00e7as\u0131yd\u0131. Her bir engeli a\u015ft\u0131\u011f\u0131mda, web geli\u015ftirme ve Chrome uzant\u0131lar\u0131n\u0131n derinlikleri hakk\u0131nda daha fazla bilgi edindim, bu da beni daha yetkin bir geli\u015ftirici yapt\u0131.<\/p>\n<h2>\u0130leri D\u00fczey \u0130pu\u00e7lar\u0131 ve En \u0130yi Uygulamalar: Uzant\u0131n\u0131z\u0131 Nas\u0131l Daha \u0130yi Hale Getirirsiniz?<\/h2>\n<p>\u0130lk Chrome uzant\u0131m\u0131 geli\u015ftirme s\u00fcrecinde edindi\u011fim temel bilgilerin yan\u0131 s\u0131ra, uzant\u0131lar\u0131 daha sa\u011flam, performansl\u0131 ve kullan\u0131c\u0131 dostu hale getirecek baz\u0131 ileri d\u00fczey ipu\u00e7lar\u0131 ve en iyi uygulamalar\u0131 da ke\u015ffettim. Bu bilgiler, sadece Google Takvim eklentim i\u00e7in de\u011fil, gelecekte geli\u015ftirece\u011fim di\u011fer uzant\u0131lar i\u00e7in de yol g\u00f6sterici oldu.<\/p>\n<h3>1. Performans Optimizasyonu ve Kaynak Y\u00f6netimi<\/h3>\n<p>Uzant\u0131lar, taray\u0131c\u0131n\u0131n kaynaklar\u0131n\u0131 (bellek, CPU) kullan\u0131r. Bu nedenle, performans optimizasyonu kritik \u00f6neme sahiptir. \u00d6zellikle Service Worker&#8217;lar, olay tabanl\u0131 \u00e7al\u0131\u015ft\u0131klar\u0131 i\u00e7in gereksiz yere uyanmamalar\u0131 ve i\u015flerini h\u0131zl\u0131ca tamamlay\u0131p ask\u0131ya al\u0131nmalar\u0131 \u00f6nemlidir.<\/p>\n<ul>\n<li><strong>Gereksiz DOM Manip\u00fclasyonlar\u0131ndan Ka\u00e7\u0131n\u0131n:<\/strong> \u0130\u00e7erik betiklerinde, DOM&#8217;u gereksiz yere taramak veya de\u011fi\u015ftirmek performans\u0131 olumsuz etkileyebilir. Yaln\u0131zca ihtiya\u00e7 duyulan elementleri se\u00e7mek ve de\u011fi\u015fiklikleri toplu halde yapmak daha iyidir.<\/li>\n<li><strong>Asenkron \u0130\u015flemler ve Promise&#8217;ler:<\/strong> A\u011f istekleri, dosya okuma\/yazma gibi zaman al\u0131c\u0131 i\u015flemleri asenkron olarak y\u00f6netin. Promise&#8217;ler ve <code>async\/await<\/code> kullan\u0131m\u0131, kodunuzu daha okunabilir ve taray\u0131c\u0131n\u0131n donmas\u0131n\u0131 engelleyen bir yap\u0131ya kavu\u015fturur.<\/li>\n<li><strong><code>chrome.storage<\/code> Kullan\u0131m\u0131n\u0131 Optimize Edin:<\/strong> B\u00fcy\u00fck veri k\u00fcmelerini saklarken veya s\u0131k s\u0131k okuma\/yazma i\u015flemleri yaparken dikkatli olun. Yaln\u0131zca ihtiya\u00e7 duyulan verileri okuyun ve yaz\u0131n.<\/li>\n<li><strong>Kaynaklar\u0131 S\u0131k\u0131\u015ft\u0131r\u0131n:<\/strong> Uzant\u0131 paketinizi yay\u0131nlamadan \u00f6nce JavaScript, CSS ve resim dosyalar\u0131n\u0131 s\u0131k\u0131\u015ft\u0131r\u0131n (minify\/uglify) ve optimize edin. Bu, uzant\u0131n\u0131n y\u00fcklenme s\u00fcresini ve bellek kullan\u0131m\u0131n\u0131 azalt\u0131r.<\/li>\n<\/ul>\n<h3>2. G\u00fcvenlik ve Gizlilik Odakl\u0131 Geli\u015ftirme<\/h3>\n<p>Chrome uzant\u0131lar\u0131, kullan\u0131c\u0131lar\u0131n hassas verilerine eri\u015febilir ve web sayfalar\u0131n\u0131 de\u011fi\u015ftirebilir. Bu nedenle, g\u00fcvenlik ve gizlilik her zaman \u00f6ncelikli olmal\u0131d\u0131r.<\/p>\n<ul>\n<li><strong>En Az Ayr\u0131cal\u0131k Prensibi:<\/strong> Uzant\u0131n\u0131z\u0131n ger\u00e7ekten ihtiya\u00e7 duydu\u011fu en az izinleri isteyin. \u00d6rne\u011fin, t\u00fcm web sitelerine eri\u015fim yerine sadece belirli bir alan ad\u0131na (<code>host_permissions<\/code>) eri\u015fim isteyin. Bu, kullan\u0131c\u0131 g\u00fcvenini art\u0131r\u0131r.<\/li>\n<li><strong>\u0130\u00e7erik G\u00fcvenlik Politikas\u0131 (Content Security Policy &#8211; CSP):<\/strong> <code>manifest.json<\/code> dosyan\u0131zda sa\u011flam bir CSP tan\u0131mlay\u0131n. Bu, uzant\u0131n\u0131z\u0131n d\u0131\u015f kaynaklardan kod \u00e7al\u0131\u015ft\u0131rmas\u0131n\u0131 veya tehlikeli komut dosyalar\u0131n\u0131 enjekte etmesini engeller. Manifest V3&#8217;te bu politika daha da s\u0131k\u0131la\u015ft\u0131r\u0131lm\u0131\u015ft\u0131r.<\/li>\n<li><strong>Kullan\u0131c\u0131 Verilerini Korumak:<\/strong> E\u011fer kullan\u0131c\u0131 verilerini topluyorsan\u0131z, bunlar\u0131 g\u00fcvenli bir \u015fekilde saklay\u0131n ve gizlilik politikalar\u0131n\u0131za uygun hareket edin. Hassas verileri asla a\u00e7\u0131k metin olarak saklamay\u0131n.<\/li>\n<li><strong>D\u0131\u015f K\u00fct\u00fcphaneleri Dikkatli Kullan\u0131n:<\/strong> Uzant\u0131n\u0131za \u00fc\u00e7\u00fcnc\u00fc taraf k\u00fct\u00fcphaneler eklerken, bunlar\u0131n g\u00fcvenilirli\u011fini ve g\u00fcvenlik a\u00e7\u0131klar\u0131n\u0131 kontrol edin. Manifest V3&#8217;te, uzaktan bar\u0131nd\u0131r\u0131lan betiklerin \u00e7al\u0131\u015ft\u0131r\u0131lmas\u0131na izin verilmedi\u011fini unutmay\u0131n.<\/li>\n<\/ul>\n<h3>3. Kullan\u0131c\u0131 Deneyimi (UX) ve Eri\u015filebilirlik<\/h3>\n<p>Harika bir uzant\u0131 sadece i\u015flevsel olmakla kalmaz, ayn\u0131 zamanda kullan\u0131c\u0131 dostu ve eri\u015filebilir olmal\u0131d\u0131r.<\/p>\n<ul>\n<li><strong>Basit ve Sezgisel Aray\u00fcz:<\/strong> Popup&#8217;\u0131n\u0131z\u0131n veya i\u00e7erik betiklerinizin ekledi\u011fi aray\u00fcz elementlerinin kolay anla\u015f\u0131l\u0131r ve kullan\u0131labilir oldu\u011fundan emin olun. Gereksiz karma\u015f\u0131kl\u0131ktan ka\u00e7\u0131n\u0131n.<\/li>\n<li><strong>Geri Bildirim Sa\u011flay\u0131n:<\/strong> Kullan\u0131c\u0131 bir i\u015flem ger\u00e7ekle\u015ftirdi\u011finde (\u00f6rne\u011fin, not kaydetti\u011finde), i\u015flemin ba\u015far\u0131l\u0131 olup olmad\u0131\u011f\u0131na dair g\u00f6rsel veya metinsel geri bildirim sa\u011flay\u0131n.<\/li>\n<li><strong>Eri\u015filebilirlik Standartlar\u0131na Uyun:<\/strong> Aray\u00fcz elementleriniz i\u00e7in uygun ARIA (Accessible Rich Internet Applications) \u00f6zniteliklerini kullan\u0131n. Klavye navigasyonunu destekleyin ve ekran okuyucularla uyumlu olun.<\/li>\n<li><strong>\u00c7oklu Dil Deste\u011fi:<\/strong> E\u011fer hedef kitleniz birden fazlaysa, uzant\u0131n\u0131z\u0131 yerelle\u015ftirmeyi d\u00fc\u015f\u00fcn\u00fcn. Chrome uzant\u0131lar\u0131, <code>_locales<\/code> klas\u00f6r\u00fc arac\u0131l\u0131\u011f\u0131yla \u00e7oklu dil deste\u011fi sunar.<\/li>\n<\/ul>\n<h3>4. Hata Y\u00f6netimi ve G\u00fcnl\u00fckleme<\/h3>\n<p>Uzant\u0131n\u0131z\u0131n beklenmedik durumlarla nas\u0131l ba\u015fa \u00e7\u0131kt\u0131\u011f\u0131n\u0131 anlamak i\u00e7in sa\u011flam bir hata y\u00f6netimi ve g\u00fcnl\u00fckleme stratejisi \u00f6nemlidir.<\/p>\n<ul>\n<li><strong><code>try-catch<\/code> Bloklar\u0131:<\/strong> Potansiyel olarak hata olu\u015fturabilecek kod bloklar\u0131n\u0131 <code>try-catch<\/code> i\u00e7ine al\u0131n.<\/li>\n<li><strong>Anlaml\u0131 Hata Mesajlar\u0131:<\/strong> Konsola veya kullan\u0131c\u0131ya g\u00f6sterilen hata mesajlar\u0131n\u0131n anla\u015f\u0131l\u0131r ve sorunu \u00e7\u00f6zmeye yard\u0131mc\u0131 olacak bilgiler i\u00e7erdi\u011finden emin olun.<\/li>\n<li><strong>G\u00fcnl\u00fckleme (Logging):<\/strong> Geli\u015ftirme s\u0131ras\u0131nda <code>console.log()<\/code> kullanmak faydal\u0131d\u0131r, ancak canl\u0131 ortamda a\u015f\u0131r\u0131 g\u00fcnl\u00fcklemeden ka\u00e7\u0131n\u0131n veya daha kontroll\u00fc bir g\u00fcnl\u00fckleme mekanizmas\u0131 kullan\u0131n.<\/li>\n<li><strong>Geli\u015ftirici Ara\u00e7lar\u0131n\u0131 Kullan\u0131n:<\/strong> Chrome&#8217;un geli\u015ftirici ara\u00e7lar\u0131, uzant\u0131n\u0131z\u0131n Service Worker&#8217;\u0131n\u0131, i\u00e7erik betiklerini ve popup&#8217;\u0131n\u0131 hata ay\u0131klamak i\u00e7in g\u00fc\u00e7l\u00fc \u00f6zellikler sunar. Konsolu, a\u011f sekmesini ve bellek profilleyicisini aktif olarak kullan\u0131n.<\/li>\n<\/ul>\n<p>Bu ipu\u00e7lar\u0131 ve en iyi uygulamalar, sadece ilk eklentimi daha iyi hale getirmekle kalmad\u0131, ayn\u0131 zamanda beni daha bilin\u00e7li ve sorumlu bir geli\u015ftirici olmaya te\u015fvik etti. Uzant\u0131 geli\u015ftirme, s\u00fcrekli \u00f6\u011frenmeyi ve adapte olmay\u0131 gerektiren dinamik bir aland\u0131r.<\/p>\n<h2>Sonu\u00e7: Chrome Eklentisi Geli\u015ftirme Yolculu\u011fumdan \u00c7\u0131kar\u0131lan Dersler<\/h2>\n<p>Google Takvim i\u00e7in ilk Chrome uzant\u0131m\u0131 geli\u015ftirme yolculu\u011fum, hem teknik hem de ki\u015fisel geli\u015fim a\u00e7\u0131s\u0131ndan olduk\u00e7a zenginle\u015ftirici bir deneyim oldu. Bu s\u00fcre\u00e7, sadece kod yazmakla kalmay\u0131p, ayn\u0131 zamanda bir problemi ba\u015ftan sona tan\u0131mlama, \u00e7\u00f6z\u00fcm \u00fcretme, mevcut ara\u00e7lar\u0131 anlama ve beklenmedik zorluklarla ba\u015fa \u00e7\u0131kma becerilerimi de peki\u015ftirdi. \u0130\u015fte bu yolculuktan \u00e7\u0131kard\u0131\u011f\u0131m en \u00f6nemli dersler:<\/p>\n<ol>\n<li><strong>Planlama Her \u015eeydir:<\/strong> Bir projeye ba\u015flamadan \u00f6nce, fikri netle\u015ftirmek, kapsam\u0131 belirlemek ve olas\u0131 zorluklar\u0131 \u00f6ng\u00f6rmek, geli\u015ftirme s\u00fcrecini \u00e7ok daha p\u00fcr\u00fczs\u00fcz hale getiriyor. \u0130yi bir <code>manifest.json<\/code> yap\u0131s\u0131 ve bile\u015fenler aras\u0131 ileti\u015fimin nas\u0131l olaca\u011f\u0131n\u0131 planlamak, temelden sa\u011flam bir uzant\u0131 in\u015fa etmenin anahtar\u0131d\u0131r.<\/li>\n<li><strong>Dok\u00fcmantasyon Hayat Kurtar\u0131r:<\/strong> Chrome uzant\u0131lar\u0131 dok\u00fcmantasyonu (\u00f6zellikle Manifest V3 ile ilgili g\u00fcncellemeler), kar\u015f\u0131la\u015ft\u0131\u011f\u0131m bir\u00e7ok sorunun cevab\u0131n\u0131 i\u00e7eriyordu. Resmi kaynaklar\u0131 d\u00fczenli olarak kontrol etmek ve API&#8217;lerin nas\u0131l \u00e7al\u0131\u015ft\u0131\u011f\u0131n\u0131 anlamak, yanl\u0131\u015f yollara sapmam\u0131 engelledi.<\/li>\n<li><strong>Dinamik Web Sayfalar\u0131 Zorlay\u0131c\u0131 Olabilir:<\/strong> Google Takvim gibi modern ve dinamik web uygulamalar\u0131yla etkile\u015fim kurmak, DOM manip\u00fclasyonlar\u0131 konusunda ekstra dikkat ve yarat\u0131c\u0131l\u0131k gerektiriyor. <code>MutationObserver<\/code> gibi ara\u00e7lar, bu t\u00fcr ortamlarla ba\u015fa \u00e7\u0131kmak i\u00e7in vazge\u00e7ilmezdir.<\/li>\n<li><strong>G\u00fcvenlik ve Performans \u00d6nceliklidir:<\/strong> Bir uzant\u0131 geli\u015ftirirken, kullan\u0131c\u0131 gizlili\u011fi ve g\u00fcvenli\u011fi her zaman \u00f6n planda tutulmal\u0131d\u0131r. En az ayr\u0131cal\u0131k prensibini benimsemek ve performans\u0131 optimize etmek, uzant\u0131n\u0131z\u0131n kullan\u0131c\u0131lar taraf\u0131ndan benimsenmesini sa\u011flar.<\/li>\n<li><strong>Sab\u0131r ve Azim:<\/strong> Kod yazmak, hata ay\u0131klamak ve tekrar denemek, bu s\u00fcrecin do\u011fal bir par\u00e7as\u0131d\u0131r. \u00d6zellikle ilk kez bir \u015fey geli\u015ftirirken, bazen saatlerce s\u00fcren bir hatay\u0131 bulmak veya bir \u00e7\u00f6z\u00fcm ke\u015ffetmek b\u00fcy\u00fck bir tatmin kayna\u011f\u0131d\u0131r.<\/li>\n<li><strong>Topluluk Deste\u011fi:<\/strong> Stack Overflow gibi platformlar ve geli\u015ftirici topluluklar\u0131, tak\u0131ld\u0131\u011f\u0131m noktalarda bana yol g\u00f6sterdi. Bilgi payla\u015f\u0131m\u0131 ve ba\u015fkalar\u0131n\u0131n deneyimlerinden faydalanmak, \u00f6\u011frenme s\u00fcrecini h\u0131zland\u0131r\u0131yor.<\/li>\n<\/ol>\n<p>Bu deneyim, web geli\u015ftirme alan\u0131ndaki yetkinliklerimi art\u0131rmakla kalmad\u0131, ayn\u0131 zamanda kendi dijital ara\u00e7lar\u0131m\u0131 ki\u015fiselle\u015ftirme ve geli\u015ftirme konusunda bana ilham verdi. E\u011fer siz de g\u00fcnl\u00fck kulland\u0131\u011f\u0131n\u0131z bir web uygulamas\u0131nda &#8220;ke\u015fke \u015f\u00f6yle bir \u00f6zelli\u011fi olsayd\u0131&#8221; diye d\u00fc\u015f\u00fcnd\u00fcyseniz, kendi Chrome uzant\u0131n\u0131z\u0131 geli\u015ftirmeyi kesinlikle denemelisiniz. Bu, hem e\u011flenceli hem de son derece \u00f6\u011fretici bir yolculuk olacakt\u0131r.<\/p>\n<h3>S\u0131k\u00e7a Sorulan Sorular<\/h3>\n<dl>\n<dt><strong>1. Chrome eklentisi geli\u015ftirmek i\u00e7in hangi programlama dillerini bilmeliyim?<\/strong><\/dt>\n<dd>Temel olarak HTML, CSS ve JavaScript bilmeniz yeterlidir. Uzant\u0131n\u0131n kullan\u0131c\u0131 aray\u00fcz\u00fc i\u00e7in HTML ve CSS, i\u015flevselli\u011fi i\u00e7in ise JavaScript kullan\u0131l\u0131r. Modern JavaScript (ES6+) bilgisi, Promise&#8217;ler ve asenkron programlama gibi konular i\u00e7in faydal\u0131d\u0131r.<\/dd>\n<dt><strong>2. Manifest V3&#8217;e ge\u00e7i\u015f neden bu kadar \u00f6nemli?<\/strong><\/dt>\n<dd>Manifest V3, Chrome uzant\u0131lar\u0131n\u0131n g\u00fcvenlik, performans ve gizlili\u011fini art\u0131rmak amac\u0131yla yap\u0131lan \u00f6nemli bir g\u00fcncellemedir. Service Worker&#8217;lar\u0131n tan\u0131t\u0131lmas\u0131, a\u011f istekleri i\u00e7in yeni API&#8217;ler ve uzaktan bar\u0131nd\u0131r\u0131lan kod yasa\u011f\u0131 gibi de\u011fi\u015fiklikler, uzant\u0131 ekosistemini daha g\u00fcvenli ve verimli hale getirmeyi hedefler. Yeni uzant\u0131lar\u0131n Manifest V3 uyumlu olmas\u0131 zorunludur.<\/dd>\n<dt><strong>3. Kendi eklentimi Google Chrome Web Ma\u011fazas\u0131&#8217;nda nas\u0131l yay\u0131nlayabilirim?<\/strong><\/dt>\n<dd>Eklentinizi geli\u015ftirdikten ve test ettikten sonra, Chrome Geli\u015ftirici Hesab\u0131 olu\u015fturman\u0131z (tek seferlik bir \u00fccreti olabilir) ve eklentinizin paketi (ZIP dosyas\u0131) ile birlikte gerekli bilgileri (a\u00e7\u0131klama, ekran g\u00f6r\u00fcnt\u00fcleri, gizlilik politikas\u0131 vb.) y\u00fcklemeniz gerekir. Google, eklentinizi inceledikten sonra yay\u0131nlar. Yay\u0131nlama s\u00fcreci, Google&#8217;\u0131n politikalar\u0131na uydu\u011funuzdan emin olmay\u0131 gerektirir.<\/dd>\n<dt><strong>4. Eklentilerimdeki hatalar\u0131 nas\u0131l ay\u0131klayabilirim (debug)?<\/strong><\/dt>\n<dd>Chrome&#8217;un geli\u015ftirici ara\u00e7lar\u0131, uzant\u0131 hatalar\u0131n\u0131 ay\u0131klamak i\u00e7in \u00e7ok g\u00fc\u00e7l\u00fcd\u00fcr. Popup i\u00e7in kendi geli\u015ftirici ara\u00e7lar\u0131n\u0131 a\u00e7abilir, Service Worker i\u00e7in arka plan sayfas\u0131n\u0131 inceleyebilir ve i\u00e7erik betikleri i\u00e7in ilgili web sayfas\u0131n\u0131n geli\u015ftirici ara\u00e7lar\u0131n\u0131 kullanabilirsiniz. <code>console.log<\/code>, kesme noktalar\u0131 (breakpoints) ve ad\u0131m ad\u0131m kod y\u00fcr\u00fctme, hata ay\u0131klama s\u00fcrecinde en s\u0131k kullan\u0131lan y\u00f6ntemlerdir.<\/dd>\n<dt><strong>5. Mevcut bir web sitesinin DOM&#8217;unu de\u011fi\u015ftirmek ne kadar g\u00fcvenli ve etik?<\/strong><\/dt>\n<dd>Bir eklenti arac\u0131l\u0131\u011f\u0131yla web sitesinin DOM&#8217;unu de\u011fi\u015ftirmek teknik olarak m\u00fcmk\u00fcnd\u00fcr ve bir\u00e7ok uzant\u0131 bu \u015fekilde \u00e7al\u0131\u015f\u0131r. Ancak, bu i\u015flem dikkatli yap\u0131lmal\u0131d\u0131r. De\u011fi\u015fiklikler, web sitesinin i\u015flevselli\u011fini bozmamal\u0131 veya kullan\u0131c\u0131 deneyimini olumsuz etkilememelidir. Ayr\u0131ca, kullan\u0131c\u0131lar\u0131n beklentilerini kar\u015f\u0131lamak ve gizliliklerini ihlal etmemek etik a\u00e7\u0131dan \u00f6nemlidir. Eklentinizin sadece kullan\u0131c\u0131n\u0131n kendi deneyimini iyile\u015ftirmeye odakland\u0131\u011f\u0131ndan emin olun ve yetkisiz veri toplama gibi davran\u0131\u015flardan ka\u00e7\u0131n\u0131n.<\/dd>\n<\/dl>\n<p>#ChromeEklentisi #WebGeli\u015ftirme #GoogleTakvim #ManifestV3 #JavaScript<\/p>\n","protected":false},"excerpt":{"rendered":"G\u00fcnl\u00fck ya\u015fant\u0131m\u0131zda dijital ara\u00e7lar, \u00f6zellikle de Google Takvim, zaman y\u00f6netimimizin vazge\u00e7ilmez bir par\u00e7as\u0131 haline geldi.","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-42144","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>Google Takvim \u0130\u00e7in \u0130lk Chrome Eklentimi Geli\u015ftirirken Neler \u00d6\u011frendim? - 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\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Google Takvim \u0130\u00e7in \u0130lk Chrome Eklentimi Geli\u015ftirirken Neler \u00d6\u011frendim?\" \/>\n<meta property=\"og:description\" content=\"G\u00fcnl\u00fck ya\u015fant\u0131m\u0131zda dijital ara\u00e7lar, \u00f6zellikle de Google Takvim, zaman y\u00f6netimimizin vazge\u00e7ilmez bir par\u00e7as\u0131 haline geldi.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/\" \/>\n<meta property=\"og:site_name\" content=\"Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" \/>\n<meta property=\"article:published_time\" content=\"2026-05-28T18:04:42+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=\"24 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/\"},\"author\":{\"name\":\"Fatih Soysal\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"headline\":\"Google Takvim \u0130\u00e7in \u0130lk Chrome Eklentimi Geli\u015ftirirken Neler \u00d6\u011frendim?\",\"datePublished\":\"2026-05-28T18:04:42+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/\"},\"wordCount\":4291,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/#respond\"]}],\"copyrightYear\":\"2026\",\"copyrightHolder\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/\",\"name\":\"Google Takvim \u0130\u00e7in \u0130lk Chrome Eklentimi Geli\u015ftirirken Neler \u00d6\u011frendim? - Kodlar\u0131n Gizemli D\u00fcnyas\u0131\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\"},\"datePublished\":\"2026-05-28T18:04:42+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\/\/fatihsoysal.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Google Takvim \u0130\u00e7in \u0130lk Chrome Eklentimi Geli\u015ftirirken Neler \u00d6\u011frendim?\"}]},{\"@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":"Google Takvim \u0130\u00e7in \u0130lk Chrome Eklentimi Geli\u015ftirirken Neler \u00d6\u011frendim? - 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\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/","og_locale":"tr_TR","og_type":"article","og_title":"Google Takvim \u0130\u00e7in \u0130lk Chrome Eklentimi Geli\u015ftirirken Neler \u00d6\u011frendim?","og_description":"G\u00fcnl\u00fck ya\u015fant\u0131m\u0131zda dijital ara\u00e7lar, \u00f6zellikle de Google Takvim, zaman y\u00f6netimimizin vazge\u00e7ilmez bir par\u00e7as\u0131 haline geldi.","og_url":"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/","og_site_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","article_published_time":"2026-05-28T18:04:42+00:00","author":"Fatih Soysal","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Fatih Soysal","Tahmini okuma s\u00fcresi":"24 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/#article","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/"},"author":{"name":"Fatih Soysal","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"headline":"Google Takvim \u0130\u00e7in \u0130lk Chrome Eklentimi Geli\u015ftirirken Neler \u00d6\u011frendim?","datePublished":"2026-05-28T18:04:42+00:00","mainEntityOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/"},"wordCount":4291,"commentCount":0,"publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/#respond"]}],"copyrightYear":"2026","copyrightHolder":{"@id":"https:\/\/fatihsoysal.com\/blog\/#organization"}},{"@type":"WebPage","@id":"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/","url":"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/","name":"Google Takvim \u0130\u00e7in \u0130lk Chrome Eklentimi Geli\u015ftirirken Neler \u00d6\u011frendim? - Kodlar\u0131n Gizemli D\u00fcnyas\u0131","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/#website"},"datePublished":"2026-05-28T18:04:42+00:00","breadcrumb":{"@id":"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fatihsoysal.com\/blog\/google-takvim-icin-ilk-chrome-eklentimi-gelistirirken-neler-ogrendim\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/fatihsoysal.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Google Takvim \u0130\u00e7in \u0130lk Chrome Eklentimi Geli\u015ftirirken Neler \u00d6\u011frendim?"}]},{"@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\/42144","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=42144"}],"version-history":[{"count":0,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/42144\/revisions"}],"wp:attachment":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media?parent=42144"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/categories?post=42144"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/tags?post=42144"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}