{"id":35181,"date":"2025-11-26T16:41:48","date_gmt":"2025-11-26T13:41:48","guid":{"rendered":"https:\/\/fatihsoysal.com\/blog\/?p=35181"},"modified":"2025-11-26T16:41:48","modified_gmt":"2025-11-26T13:41:48","slug":"typescript-ve-visual-studio-code-kurulumu","status":"publish","type":"post","link":"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/","title":{"rendered":"TypeScript ve Visual Studio Code Kurulumu"},"content":{"rendered":"

<\/p>\n

G\u00fcn\u00fcm\u00fcz web geli\u015ftirme d\u00fcnyas\u0131nda, b\u00fcy\u00fck ve karma\u015f\u0131k uygulamalar\u0131n y\u00f6netimi giderek daha zorlu hale gelmektedir. JavaScript’in esnek yap\u0131s\u0131, bazen beklenmedik hatalara ve bak\u0131m zorluklar\u0131na yol a\u00e7abilir. \u0130\u015fte tam bu noktada TypeScript devreye girer. TypeScript, JavaScript’e statik tip denetimi ekleyerek kodunuzu daha g\u00fcvenli, daha okunabilir ve daha s\u00fcrd\u00fcr\u00fclebilir hale getiren bir s\u00fcper k\u00fcmesidir. Visual Studio Code (VS Code) ise, TypeScript ile \u00e7al\u0131\u015fmak i\u00e7in adeta bi\u00e7ilmi\u015f kaftan olan, Microsoft taraf\u0131ndan geli\u015ftirilmi\u015f pop\u00fcler ve \u00fccretsiz bir kod d\u00fczenleyicidir. Bu rehberde, TypeScript’i Visual Studio Code ile nas\u0131l etkili bir \u015fekilde kullanaca\u011f\u0131n\u0131z\u0131, kurulumdan geli\u015fmi\u015f \u00f6zelliklere kadar ad\u0131m ad\u0131m \u00f6\u011freneceksiniz.<\/p>\n

TypeScript ve Visual Studio Code Kurulumu<\/h2>\n

TypeScript ile geli\u015ftirme yapmaya ba\u015flamadan \u00f6nce, gerekli ara\u00e7lar\u0131 kurman\u0131z gerekmektedir. Visual Studio Code, TypeScript i\u00e7in m\u00fckemmel bir entegrasyon sunar ve \u00e7o\u011fu \u00f6zelli\u011fi kutudan \u00e7\u0131kt\u0131\u011f\u0131 gibi destekler.<\/p>\n

Node.js ve npm Kurulumu<\/h3>\n

TypeScript derleyicisi (tsc<\/code>) bir Node.js paketi olarak da\u011f\u0131t\u0131ld\u0131\u011f\u0131 i\u00e7in, sisteminizde Node.js ve paket y\u00f6neticisi npm’in kurulu olmas\u0131 gerekmektedir. E\u011fer kurulu de\u011filse, Node.js resmi web sitesinden<\/a> i\u015fletim sisteminize uygun s\u00fcr\u00fcm\u00fc indirip kurabilirsiniz. Kurulumdan sonra, terminalinizde a\u015fa\u011f\u0131daki komutlar\u0131 \u00e7al\u0131\u015ft\u0131rarak Node.js ve npm’in do\u011fru bir \u015fekilde kuruldu\u011funu do\u011frulayabilirsiniz:<\/p>\n

node -v\nnpm -v<\/code><\/pre>\n
Visual Studio Code Kurulumu<\/h3>\n
Visual Studio Code’u hen\u00fcz y\u00fcklemediyseniz, VS Code resmi web sitesinden<\/a> indirip kurun. VS Code, TypeScript i\u00e7in yerle\u015fik destek sunar, bu nedenle ek bir eklenti y\u00fcklemenize gerek kalmaz. Ancak, geli\u015ftirme deneyiminizi daha da zenginle\u015ftirecek baz\u0131 eklentileri daha sonra \u00f6nerece\u011fiz.<\/p>\n
TypeScript Derleyicisi Kurulumu<\/h3>\n
TypeScript derleyicisini global olarak kurmak, herhangi bir dizinde tsc<\/code> komutunu kullanman\u0131za olanak tan\u0131r. Terminalinizde a\u015fa\u011f\u0131daki komutu \u00e7al\u0131\u015ft\u0131r\u0131n:<\/p>\n
npm install -g typescript<\/code><\/pre>\n
Bu, TypeScript’in en son s\u00fcr\u00fcm\u00fcn\u00fc sisteminize y\u00fckleyecektir. Kurulumun ba\u015far\u0131l\u0131 oldu\u011funu do\u011frulamak i\u00e7in:<\/p>\n
tsc -v<\/code><\/pre>\n
Bu komut, kurulu TypeScript derleyicisinin s\u00fcr\u00fcm\u00fcn\u00fc g\u00f6sterecektir.<\/p>\n
\u0130lk TypeScript Projenizi Olu\u015fturma<\/h2>\n
\u015eimdi temel kurulumlar\u0131 tamamlad\u0131\u011f\u0131m\u0131za g\u00f6re, ilk TypeScript projenizi VS Code i\u00e7inde nas\u0131l olu\u015fturaca\u011f\u0131n\u0131z\u0131 ve yap\u0131land\u0131raca\u011f\u0131n\u0131z\u0131 g\u00f6relim.<\/p>\n
Proje Klas\u00f6r\u00fc Olu\u015fturma<\/h3>\n
\u00d6ncelikle, yeni projeniz i\u00e7in bir klas\u00f6r olu\u015fturun ve bu klas\u00f6re terminal \u00fczerinden gidin:<\/p>\n
mkdir my-ts-app\ncd my-ts-app<\/code><\/pre>\n
package.json Olu\u015fturma<\/h3>\n
Projenizin ba\u011f\u0131ml\u0131l\u0131klar\u0131n\u0131 ve betiklerini y\u00f6netmek i\u00e7in bir package.json<\/code> dosyas\u0131na ihtiyac\u0131n\u0131z olacak. Bunu h\u0131zl\u0131ca olu\u015fturmak i\u00e7in:<\/p>\n
npm init -y<\/code><\/pre>\n
TypeScript’i Projeye Ekleme<\/h3>\n
Global olarak kurmu\u015f olsak da, her projenin kendi TypeScript s\u00fcr\u00fcm\u00fcn\u00fc y\u00f6netmesi iyi bir pratiktir. B\u00f6ylece farkl\u0131 projeler farkl\u0131 TypeScript s\u00fcr\u00fcmlerini kullanabilir. TypeScript’i projenize geli\u015ftirme ba\u011f\u0131ml\u0131l\u0131\u011f\u0131 olarak ekleyin:<\/p>\n
npm install --save-dev typescript<\/code><\/pre>\n
tsconfig.json Yap\u0131land\u0131rmas\u0131<\/h3>\n
tsconfig.json<\/code> dosyas\u0131, TypeScript derleyicisinin projenizi nas\u0131l derlemesi gerekti\u011fini belirleyen yap\u0131land\u0131rma dosyas\u0131d\u0131r. Bu dosyay\u0131 otomatik olarak olu\u015fturmak i\u00e7in:<\/p>\n
npx tsc --init<\/code><\/pre>\n
Bu komut, projenizin k\u00f6k dizinine bir tsconfig.json<\/code> dosyas\u0131 ekleyecektir. Bu dosya bir\u00e7ok yorum sat\u0131r\u0131 i\u00e7erir ve \u00e7e\u015fitli derleyici se\u00e7eneklerini g\u00f6sterir. Temel olarak kullanaca\u011f\u0131n\u0131z baz\u0131 \u00f6nemli se\u00e7enekler \u015funlard\u0131r:<\/p>\n
    \n
  • \"target\": \"es2016\"<\/code>: TypeScript kodunuzun hangi ECMAScript s\u00fcr\u00fcm\u00fcne derlenece\u011fini belirtir. Genellikle daha yeni bir s\u00fcr\u00fcm tercih edilir.<\/li>\n
  • \"module\": \"commonjs\"<\/code>: Derlenen JavaScript kodunun hangi mod\u00fcl sistemini kullanaca\u011f\u0131n\u0131 belirtir (\u00f6rn. CommonJS, ESNext).<\/li>\n
  • \"outDir\": \".\/dist\"<\/code>: Derlenen JavaScript dosyalar\u0131n\u0131n hangi dizine kaydedilece\u011fini belirtir.<\/li>\n
  • \"rootDir\": \".\/src\"<\/code>: TypeScript kaynak dosyalar\u0131n\u0131n bulundu\u011fu k\u00f6k dizini belirtir.<\/li>\n
  • \"strict\": true<\/code>: T\u00fcm kat\u0131 tip denetim se\u00e7eneklerini etkinle\u015ftirir. Bu, daha g\u00fcvenli kod yazmak i\u00e7in \u015fiddetle tavsiye edilir.<\/li>\n
  • \"esModuleInterop\": true<\/code>: CommonJS mod\u00fcllerinden ES mod\u00fcllerine daha iyi uyumluluk sa\u011flar.<\/li>\n<\/ul>\n
    \u00d6rnek bir tsconfig.json<\/code>:<\/p>\n
    {\n  \"compilerOptions\": {\n    \"target\": \"es2016\",\n    \"module\": \"commonjs\",\n    \"outDir\": \".\/dist\",\n    \"rootDir\": \".\/src\",\n    \"strict\": true,\n    \"esModuleInterop\": true,\n    \"skipLibCheck\": true,\n    \"forceConsistentCasingInFileNames\": true\n  },\n  \"include\": [\n    \"src\/<\/em>\/*\"\n  ],\n  \"exclude\": [\n    \"node_modules\",\n    \"<\/em>\/*.spec.ts\"\n  ]\n}<\/code><\/pre>\n
    \u0130lk TypeScript Dosyas\u0131<\/h3>\n
    \u015eimdi src<\/code> ad\u0131nda bir klas\u00f6r olu\u015fturun ve i\u00e7ine app.ts<\/code> ad\u0131nda bir dosya ekleyin. Bu, ilk TypeScript kodunuzu i\u00e7erecektir:<\/p>\n
    \/\/ src\/app.ts\nfunction greet(person: string) {\n  return Merhaba, ${person}!<\/code>;\n}\n\nlet user = \"Alice\";\nconsole.log(greet(user));\n\n\/\/ Bir hata \u00f6rne\u011fi: Say\u0131 bekleyen yere string g\u00f6ndermek\n\/\/ let age: number = \"otuz\"; \/\/ VS Code hemen hata verecektir!\n\n\/\/ Tip \u00e7\u0131kar\u0131m\u0131 (Type Inference)\nlet message = \"TypeScript harika!\"; \/\/ message otomatik olarak string tipinde olur\n\/\/ message = 123; \/\/ Hata: 'number' tipindeki de\u011fer 'string' tipine atanamaz.\n\ninterface User {\n    id: number;\n    name: string;\n    email?: string; \/\/ Opsiyonel \u00f6zellik\n}\n\nconst newUser: User = {\n    id: 1,\n    name: \"Bob\",\n    \/\/ email: \"bob@example.com\" \/\/ Opsiyonel oldu\u011fu i\u00e7in yazmasak da olur\n};\n\nconsole.log(Kullan\u0131c\u0131: ${newUser.name} (ID: ${newUser.id})<\/code>);\n<\/code><\/pre>\n
    VS Code’da bu dosyay\u0131 a\u00e7t\u0131\u011f\u0131n\u0131zda, TypeScript’in yerle\u015fik dil servisleri sayesinde an\u0131nda tip hatalar\u0131n\u0131 (\u00f6rne\u011fin age<\/code> de\u011fi\u015fkenindeki hatay\u0131) g\u00f6receksiniz. Ayr\u0131ca, de\u011fi\u015fkenlerin \u00fczerine geldi\u011finizde tip bilgilerini ve otomatik tamamlama (IntelliSense) \u00f6nerilerini de fark edeceksiniz.<\/p>\n
    TypeScript Temelleri ve VS Code Deste\u011fi<\/h2>\n
    TypeScript’in temel yap\u0131 ta\u015flar\u0131n\u0131 ve VS Code’un bu temelleri nas\u0131l destekledi\u011fini inceleyelim.<\/p>\n
    Tip Tan\u0131mlamalar\u0131 (Type Annotations)<\/h3>\n
    TypeScript’in en temel \u00f6zelli\u011fi, de\u011fi\u015fkenlere, fonksiyon parametrelerine ve d\u00f6n\u00fc\u015f de\u011ferlerine tip tan\u0131mlamalar\u0131 ekleyebilmenizdir. VS Code, bu tip tan\u0131mlamalar\u0131n\u0131 kullanarak size an\u0131nda geri bildirim sa\u011flar.<\/p>\n
    let userName: string = \"Ay\u015fe\";\nlet userAge: number = 30;\nlet isActive: boolean = true;\nlet anything: any = \"bu herhangi bir tip olabilir\";\n\nfunction calculateSum(a: number, b: number): number {\n  return a + b;\n}\n\n\/\/ VS Code, 'a' veya 'b' parametresine string ge\u00e7meye \u00e7al\u0131\u015ft\u0131\u011f\u0131n\u0131zda hata verecektir.\n\/\/ calculateSum(\"1\", 2); \/\/ Argument of type 'string' is not assignable to parameter of type 'number'.\n<\/code><\/pre>\n
    VS Code, kodunuzu yazarken tip uyumsuzluklar\u0131n\u0131 k\u0131rm\u0131z\u0131 dalgal\u0131 \u00e7izgilerle vurgular ve fare imlecinizi hatan\u0131n \u00fczerine getirdi\u011finizde detayl\u0131 hata mesajlar\u0131 sunar. Bu, hatalar\u0131 derleme a\u015famas\u0131ndan \u00f6nce, yani geli\u015ftirme a\u015famas\u0131nda yakalaman\u0131z\u0131 sa\u011flar.<\/p>\n
    Aray\u00fczler (Interfaces) ve Tipler (Types)<\/h3>\n
    Karma\u015f\u0131k veri yap\u0131lar\u0131n\u0131 tan\u0131mlamak i\u00e7in aray\u00fczleri (interfaces) ve tipleri (types) kullan\u0131r\u0131z. VS Code, bu yap\u0131lar\u0131 anlar ve otomatik tamamlama ile tip kontrol\u00fcnde size yard\u0131mc\u0131 olur.<\/p>\n
    interface Product {\n  id: number;\n  name: string;\n  price: number;\n  description?: string; \/\/ Opsiyonel \u00f6zellik\n}\n\ntype UserProfile = {\n  username: string;\n  email: string;\n  age: number;\n};\n\nconst myProduct: Product = {\n  id: 101,\n  name: \"Laptop\",\n  price: 1200\n};\n\nconst adminUser: UserProfile = {\n  username: \"admin\",\n  email: \"admin@example.com\",\n  age: 40\n};\n\n\/\/ myProduct.price = \"oniki y\u00fcz\"; \/\/ Hata: 'string' tipindeki de\u011fer 'number' tipine atanamaz.\n\/\/ VS Code, myProduct. derken id, name, price, description \u00f6nerilerini sunacakt\u0131r.\n<\/code><\/pre>\n
    S\u0131n\u0131flar (Classes)<\/h3>\n
    TypeScript, ECMAScript 2015 (ES6) ile tan\u0131t\u0131lan s\u0131n\u0131flar\u0131 destekler ve bunlara tip g\u00fcvenli\u011fi ve eri\u015fim belirleyiciler (public<\/code>, private<\/code>, protected<\/code>) gibi ek \u00f6zellikler getirir.<\/p>\n
    class Animal {\n  private name: string; \/\/ Sadece s\u0131n\u0131f i\u00e7inden eri\u015filebilir\n  protected species: string; \/\/ S\u0131n\u0131f ve alt s\u0131n\u0131flar\u0131ndan eri\u015filebilir\n\n  constructor(name: string, species: string) {\n    this.name = name;\n    this.species = species;\n  }\n\n  public makeSound(sound: string): void {\n    console.log(${this.name} (${this.species}) makes a ${sound} sound.<\/code>);\n  }\n}\n\nclass Dog extends Animal {\n  constructor(name: string) {\n    super(name, \"Dog\");\n  }\n\n  bark(): void {\n    this.makeSound(\"Woof\");\n  }\n}\n\nconst myDog = new Dog(\"Buddy\");\nmyDog.bark();\n\/\/ myDog.name; \/\/ Hata: 'name' \u00f6zelli\u011fi 'private' oldu\u011fundan eri\u015filemez.\n\/\/ myDog.species; \/\/ Hata: 'species' \u00f6zelli\u011fi 'protected' oldu\u011fundan eri\u015filemez.\n<\/code><\/pre>\n
    VS Code, s\u0131n\u0131f \u00fcyelerini ve metotlar\u0131n\u0131 otomatik olarak tamamlar, eri\u015fim belirleyicilere g\u00f6re eri\u015filebilirlik hatalar\u0131n\u0131 g\u00f6sterir ve kal\u0131t\u0131m hiyerar\u015fisini anlaman\u0131za yard\u0131mc\u0131 olur.<\/p>\n
    Derleme ve \u00c7al\u0131\u015ft\u0131rma<\/h3>\n
    TypeScript kodunuzu do\u011frudan taray\u0131c\u0131da veya Node.js ortam\u0131nda \u00e7al\u0131\u015ft\u0131ramazs\u0131n\u0131z. \u00d6nce onu JavaScript’e derlemeniz gerekir.<\/p>\n
    Terminalde, projenizin k\u00f6k dizinindeyken a\u015fa\u011f\u0131daki komutu \u00e7al\u0131\u015ft\u0131r\u0131n:<\/p>\n
    npx tsc<\/code><\/pre>\n
    Bu komut, tsconfig.json<\/code> dosyan\u0131zdaki ayarlara g\u00f6re src<\/code> klas\u00f6r\u00fcndeki t\u00fcm TypeScript dosyalar\u0131n\u0131 derleyecek ve \u00e7\u0131kt\u0131lar\u0131 dist<\/code> klas\u00f6r\u00fcne (veya outDir<\/code> olarak belirtti\u011finiz yere) JavaScript dosyalar\u0131 olarak kaydedecektir. \u00d6rne\u011fin, src\/app.ts<\/code> dosyan\u0131z dist\/app.js<\/code> olarak derlenecektir.<\/p>\n
    Derlenen JavaScript dosyas\u0131n\u0131 \u00e7al\u0131\u015ft\u0131rmak i\u00e7in:<\/p>\n
    node dist\/app.js<\/code><\/pre>\n
    Geli\u015ftirme s\u00fcrecini h\u0131zland\u0131rmak i\u00e7in package.json<\/code> dosyan\u0131za betikler ekleyebilirsiniz:<\/p>\n
    {\n  \"name\": \"my-ts-app\",\n  \"version\": \"1.0.0\",\n  \"description\": \"\",\n  \"main\": \"dist\/app.js\",\n  \"scripts\": {\n    \"build\": \"tsc\",\n    \"start\": \"node dist\/app.js\",\n    \"dev\": \"tsc --watch & node dist\/app.js\" \/\/ Geli\u015ftirme i\u00e7in izleme modu\n  },\n  \"keywords\": [],\n  \"author\": \"\",\n  \"license\": \"ISC\",\n  \"devDependencies\": {\n    \"typescript\": \"^5.0.0\"\n  }\n}<\/code><\/pre>\n
    \u015eimdi terminalde npm run build<\/code> ile derleyebilir ve npm run start<\/code> ile \u00e7al\u0131\u015ft\u0131rabilirsiniz. npm run dev<\/code> ile hem dosyalar\u0131n\u0131z\u0131 izleyebilir (tsc --watch<\/code>) hem de uygulaman\u0131z\u0131 \u00e7al\u0131\u015ft\u0131rabilirsiniz. VS Code’un entegre terminali (Ctrl+<\/code> veya Cmd+<\/code>) bu komutlar\u0131 \u00e7al\u0131\u015ft\u0131rmak i\u00e7in m\u00fckemmeldir.<\/p>\n
    VS Code Geli\u015fmi\u015f \u00d6zellikleri ve Verimlilik \u0130pu\u00e7lar\u0131<\/h2>\n
    Visual Studio Code, TypeScript ile \u00e7al\u0131\u015f\u0131rken verimlili\u011finizi art\u0131racak bir\u00e7ok geli\u015fmi\u015f \u00f6zellik sunar.<\/p>\n
    Hata Ay\u0131klama (Debugging)<\/h3>\n
    VS Code’un yerle\u015fik hata ay\u0131klay\u0131c\u0131s\u0131, TypeScript kodunuzu do\u011frudan hata ay\u0131klaman\u0131za olanak tan\u0131r. Taray\u0131c\u0131da veya Node.js ortam\u0131nda \u00e7al\u0131\u015fan kodunuz i\u00e7in kolayca hata ay\u0131klama yap\u0131land\u0131rmalar\u0131 olu\u015fturabilirsiniz.<\/p>\n
      \n
    1. app.ts<\/code> dosyan\u0131zda bir sat\u0131ra t\u0131klayarak bir kesme noktas\u0131 (breakpoint) belirleyin.<\/li>\n
    2. Sol taraftaki “Run and Debug” (\u00c7al\u0131\u015ft\u0131r ve Hata Ay\u0131kla) simgesine t\u0131klay\u0131n.<\/li>\n
    3. “create a launch.json file” (launch.json dosyas\u0131 olu\u015ftur) se\u00e7ene\u011fine t\u0131klay\u0131n ve “Node.js” ortam\u0131n\u0131 se\u00e7in. Bu, projenizin .vscode<\/code> klas\u00f6r\u00fcne bir launch.json<\/code> dosyas\u0131 ekleyecektir.<\/li>\n
    4. program<\/code> \u00f6zelli\u011fini \"${workspaceFolder}\/dist\/app.js\"<\/code> olarak g\u00fcncelleyin (e\u011fer ana dosyan\u0131z buysa).<\/li>\n
    5. F5<\/code> tu\u015funa basarak veya “Start Debugging” (Hata Ay\u0131klamay\u0131 Ba\u015flat) d\u00fc\u011fmesine t\u0131klayarak hata ay\u0131klamay\u0131 ba\u015flat\u0131n.<\/li>\n<\/ol>\n
      Kodunuz kesme noktas\u0131na ula\u015ft\u0131\u011f\u0131nda duracak ve de\u011fi\u015fkenlerin de\u011ferlerini inceleyebilir, ad\u0131mlayabilir ve \u00e7a\u011fr\u0131 y\u0131\u011f\u0131n\u0131n\u0131 g\u00f6rebilirsiniz. VS Code’un bu \u00f6zelli\u011fi, karma\u015f\u0131k hatalar\u0131 bulmak i\u00e7in vazge\u00e7ilmezdir.<\/p>\n
      \u00d6rnek .vscode\/launch.json<\/code>:<\/p>\n
      {\n  \"version\": \"0.2.0\",\n  \"configurations\": [\n    {\n      \"type\": \"node\",\n      \"request\": \"launch\",\n      \"name\": \"Launch Program\",\n      \"skipFiles\": [\n        \"\/<\/em>\"\n      ],\n      \"program\": \"${workspaceFolder}\/dist\/app.js\",\n      \"preLaunchTask\": \"tsc: build - tsconfig.json\", \/\/ Hata ay\u0131klamadan \u00f6nce derleme yapar\n      \"outFiles\": [\n        \"${workspaceFolder}\/dist\/<\/em>\/*.js\"\n      ]\n    }\n  ]\n}<\/code><\/pre>\n
      Kod D\u00fczenleme ve Refactoring<\/h3>\n
      VS Code, TypeScript’in dil hizmetlerinden tam olarak yararlanarak kod d\u00fczenleme ve yeniden d\u00fczenleme (refactoring) ara\u00e7lar\u0131 sunar:<\/p>\n
        \n
      • IntelliSense:<\/strong> Otomatik tamamlama, parametre bilgisi, h\u0131zl\u0131 bilgi ve \u00fcye listeleri, kod yazarken size rehberlik eder.<\/li>\n
      • Hata ve Uyar\u0131lar:<\/strong> Tip hatalar\u0131 ve potansiyel sorunlar an\u0131nda vurgulan\u0131r.<\/li>\n
      • H\u0131zl\u0131 D\u00fczeltmeler (Quick Fixes):<\/strong> Hata \u0131\u015f\u0131\u011f\u0131na t\u0131klayarak veya Ctrl+.<\/code> (Windows\/Linux) \/ Cmd+.<\/code> (macOS) tu\u015flar\u0131na basarak \u00f6nerilen d\u00fczeltmeleri g\u00f6rebilirsiniz. \u00d6rne\u011fin, eksik bir import’u otomatik olarak ekleyebilir.<\/li>\n
      • Yeniden Adland\u0131rma (Rename Symbol):<\/strong> Bir sembol\u00fc (de\u011fi\u015fken, fonksiyon, s\u0131n\u0131f) yeniden adland\u0131rd\u0131\u011f\u0131n\u0131zda, VS Code projenin tamam\u0131nda ilgili t\u00fcm kullan\u0131mlar\u0131 g\u00fcnceller.<\/li>\n
      • Kodu Formatlama (Format Document):<\/strong> Shift+Alt+F<\/code> (Windows\/Linux) \/ Shift+Option+F<\/code> (macOS) ile kodunuzu otomatik olarak formatlayabilirsiniz.<\/li>\n<\/ul>\n
        G\u00f6revler (Tasks)<\/h3>\n
        VS Code, derleme, test \u00e7al\u0131\u015ft\u0131rma gibi yayg\u0131n geli\u015ftirme g\u00f6revlerini otomatikle\u015ftirmek i\u00e7in “G\u00f6revler” (Tasks) \u00f6zelli\u011fini kullanman\u0131za olanak tan\u0131r. Ctrl+Shift+B<\/code> (Windows\/Linux) \/ Cmd+Shift+B<\/code> (macOS) ile derleme g\u00f6revini \u00e7al\u0131\u015ft\u0131rabilirsiniz.<\/p>\n
        Bir TypeScript derleme g\u00f6revi otomatik olarak olu\u015fturulur. \u0130sterseniz .vscode\/tasks.json<\/code> dosyas\u0131n\u0131 kendiniz de d\u00fczenleyebilirsiniz:<\/p>\n
        {\n  \"version\": \"2.0.0\",\n  \"tasks\": [\n    {\n      \"type\": \"typescript\",\n      \"tsconfig\": \"tsconfig.json\",\n      \"option\": \"watch\", \/\/ Dosya de\u011fi\u015fikliklerini izler\n      \"problemMatcher\": [\n        \"$tsc-watch\"\n      ],\n      \"group\": \"build\",\n      \"label\": \"tsc: watch - tsconfig.json\"\n    },\n    {\n      \"type\": \"typescript\",\n      \"tsconfig\": \"tsconfig.json\",\n      \"problemMatcher\": [\n        \"$tsc\"\n      ],\n      \"group\": {\n        \"kind\": \"build\",\n        \"isDefault\": true\n      },\n      \"label\": \"tsc: build - tsconfig.json\"\n    }\n  ]\n}<\/code><\/pre>\n
        Eklentiler ve Entegrasyonlar<\/h3>\n
        VS Code’un g\u00fcc\u00fcn\u00fc art\u0131ran bir\u00e7ok eklenti bulunmaktad\u0131r:<\/p>\n
          \n
        • ESLint:<\/strong> TypeScript ile de kullan\u0131labilen pop\u00fcler bir linting arac\u0131d\u0131r. Kod kalitesini ve tutarl\u0131l\u0131\u011f\u0131n\u0131 sa\u011flamak i\u00e7in TypeScript ESLint eklentilerini (@typescript-eslint\/parser<\/code>, @typescript-eslint\/eslint-plugin<\/code>) kullanabilirsiniz.<\/li>\n
        • Prettier:<\/strong> Kodunuzu otomatik olarak belirli bir stile g\u00f6re formatlayan bir kod formatlay\u0131c\u0131d\u0131r. ESLint ile birlikte kullan\u0131ld\u0131\u011f\u0131nda \u00e7ok g\u00fc\u00e7l\u00fcd\u00fcr.<\/li>\n
        • Git Entegrasyonu:<\/strong> VS Code, yerle\u015fik Git entegrasyonu sayesinde versiyon kontrol\u00fcn\u00fc kolayla\u015ft\u0131r\u0131r. De\u011fi\u015fiklikleri g\u00f6rsel olarak takip edebilir, commit yapabilir ve dallar aras\u0131nda ge\u00e7i\u015f yapabilirsiniz.<\/li>\n<\/ul>\n
          Sonu\u00e7<\/h2>\n
          TypeScript, modern JavaScript geli\u015ftirmesinde devrim niteli\u011finde bir ara\u00e7t\u0131r. Statik tip kontrol\u00fc, geli\u015ftirme s\u00fcrecindeki hatalar\u0131 en aza indirirken, kodunuzun daha anla\u015f\u0131l\u0131r ve bak\u0131m\u0131 kolay olmas\u0131n\u0131 sa\u011flar. Visual Studio Code ise, TypeScript i\u00e7in sundu\u011fu kapsaml\u0131 dil hizmetleri, ak\u0131ll\u0131 otomatik tamamlama, entegre hata ay\u0131klay\u0131c\u0131 ve zengin eklenti ekosistemi ile bu deneyimi zirveye ta\u015f\u0131r. Bu rehberde \u00f6\u011frendi\u011finiz kurulum ad\u0131mlar\u0131, temel \u00f6zellikler ve geli\u015fmi\u015f ipu\u00e7lar\u0131 sayesinde, TypeScript projelerinizi VS Code ile verimli bir \u015fekilde geli\u015ftirmeye ba\u015flayabilir ve yaz\u0131l\u0131m kalitenizi \u00f6nemli \u00f6l\u00e7\u00fcde art\u0131rabilirsiniz. TypeScript ve VS Code’un bu g\u00fc\u00e7l\u00fc kombinasyonu, her seviyeden geli\u015ftirici i\u00e7in vazge\u00e7ilmez bir ara\u00e7 tak\u0131m\u0131d\u0131r.<\/p>\n
          SSS (S\u0131k\u00e7a Sorulan Sorular)<\/h2>\n
          TypeScript’i JavaScript ile birlikte kullanabilir miyim?<\/h3>\n
          Evet, kesinlikle! TypeScript, a\u015famal\u0131 olarak benimsenecek \u015fekilde tasarlanm\u0131\u015ft\u0131r. Mevcut bir JavaScript projesine yava\u015f yava\u015f TypeScript dosyalar\u0131 ekleyebilir ve bunlar\u0131 JavaScript ile yan yana derleyip \u00e7al\u0131\u015ft\u0131rabilirsiniz. TypeScript, JavaScript dosyalar\u0131n\u0131 da anlayabilir ve tip \u00e7\u0131kar\u0131m\u0131 yapabilir.<\/p>\n
          any<\/code> tipi ne zaman kullan\u0131lmal\u0131?<\/h3>\n
          any<\/code> tipi, TypeScript’in tip denetimini tamamen devre d\u0131\u015f\u0131 b\u0131rak\u0131r. Genellikle a\u015fa\u011f\u0131daki durumlarda kullan\u0131l\u0131r:<\/p>\n
            \n
          • Mevcut bir JavaScript k\u00fct\u00fcphanesiyle entegre olurken ve o k\u00fct\u00fcphane i\u00e7in tip tan\u0131mlamalar\u0131 (@types\/<\/code> paketleri) mevcut de\u011filse.<\/li>\n
          • Veri yap\u0131s\u0131n\u0131 tam olarak bilmedi\u011finiz veya bilmenizin \u00e7ok zor oldu\u011fu durumlarda (\u00f6rne\u011fin, dinamik API yan\u0131tlar\u0131).<\/li>\n
          • H\u0131zl\u0131 prototipleme yaparken.<\/li>\n<\/ul>\n
            Ancak, any<\/code> kullan\u0131m\u0131 tip g\u00fcvenli\u011fini ortadan kald\u0131rd\u0131\u011f\u0131 i\u00e7in m\u00fcmk\u00fcn oldu\u011funca ka\u00e7\u0131n\u0131lmal\u0131 veya ge\u00e7ici \u00e7\u00f6z\u00fcmler olarak g\u00f6r\u00fclmelidir.<\/p>\n
            interface<\/code> ve type<\/code> aras\u0131ndaki temel fark nedir?<\/h3>\n
            Hem interface<\/code> hem de type<\/code> karma\u015f\u0131k veri yap\u0131lar\u0131n\u0131 tan\u0131mlamak i\u00e7in kullan\u0131l\u0131r, ancak baz\u0131 farklar\u0131 vard\u0131r:<\/p>\n
              \n
            • Geni\u015fletilebilirlik:<\/strong> interface<\/code>‘ler ayn\u0131 isimde birden fazla kez tan\u0131mlanabilir ve TypeScript bunlar\u0131 otomatik olarak birle\u015ftirir (declaration merging). type<\/code>‘lar ise bir kez tan\u0131mlan\u0131r ve birle\u015ftirilemez.<\/li>\n
            • Kullan\u0131m Alan\u0131:<\/strong> interface<\/code>‘ler genellikle nesne \u015fekillerini ve s\u0131n\u0131flar\u0131n uygulad\u0131\u011f\u0131 s\u00f6zle\u015fmeleri tan\u0131mlamak i\u00e7in tercih edilir. type<\/code>‘lar ise nesne \u015fekillerinin yan\u0131 s\u0131ra ilkel tipleri (type ID = string | number;<\/code>), birle\u015fim tiplerini (union types), kesi\u015fim tiplerini (intersection types) ve tuple tiplerini tan\u0131mlamak i\u00e7in daha esnektir.<\/li>\n<\/ul>\n
              \u00c7o\u011fu durumda, nesne \u015fekilleri tan\u0131mlamak i\u00e7in interface<\/code> kullanmak iyi bir ba\u015flang\u0131\u00e7t\u0131r. Daha karma\u015f\u0131k tip manip\u00fclasyonlar\u0131 gerekti\u011finde type<\/code> kullanmay\u0131 d\u00fc\u015f\u00fcnebilirsiniz.<\/p>\n
              TypeScript’i hangi projelerde kullanmal\u0131y\u0131m?<\/h3>\n
              TypeScript, \u00f6zellikle a\u015fa\u011f\u0131daki t\u00fcrdeki projelerde b\u00fcy\u00fck fayda sa\u011flar:<\/p>\n
                \n
              • B\u00fcy\u00fck \u00d6l\u00e7ekli Uygulamalar:<\/strong> Kod taban\u0131 b\u00fcy\u00fcd\u00fck\u00e7e, tip denetimi hatalar\u0131 yakalamay\u0131 ve kodun anla\u015f\u0131lmas\u0131n\u0131 kolayla\u015ft\u0131r\u0131r.<\/li>\n
              • Ekip \u00c7al\u0131\u015fmas\u0131:<\/strong> Farkl\u0131 geli\u015ftiricilerin ayn\u0131 kod taban\u0131 \u00fczerinde \u00e7al\u0131\u015f\u0131rken tutarl\u0131l\u0131k sa\u011flar ve yanl\u0131\u015f anlamalar\u0131 azalt\u0131r.<\/li>\n
              • Uzun \u00d6m\u00fcrl\u00fc Projeler:<\/strong> Uzun vadede kodun bak\u0131m\u0131 ve refactoring’i kolayla\u015f\u0131r.<\/li>\n
              • API Geli\u015ftirme (Node.js):<\/strong> Sunucu taraf\u0131nda da tip g\u00fcvenli\u011fi sa\u011flayarak daha sa\u011flam API’ler olu\u015fturman\u0131za yard\u0131mc\u0131 olur.<\/li>\n
              • K\u00fct\u00fcphane Geli\u015ftirme:<\/strong> Di\u011fer geli\u015ftiricilerin k\u00fct\u00fcphanenizi daha kolay ve do\u011fru bir \u015fekilde kullanmas\u0131n\u0131 sa\u011flar.<\/li>\n<\/ul>\n
                VS Code’da TypeScript hatalar\u0131n\u0131 nas\u0131l gizleyebilirim?<\/h3>\n
                Genellikle TypeScript hatalar\u0131n\u0131 gizlemek iyi bir uygulama de\u011fildir, \u00e7\u00fcnk\u00fc tip denetiminin temel amac\u0131 hatalar\u0131 erken yakalamakt\u0131r. Ancak, belirli durumlarda (\u00f6rne\u011fin, eski bir JavaScript dosyas\u0131n\u0131 a\u015famal\u0131 olarak TypeScript’e ge\u00e7irirken) hatalar\u0131 ge\u00e7ici olarak g\u00f6rmezden gelmek isteyebilirsiniz:<\/p>\n
                  \n
                • Tek bir dosya i\u00e7in:<\/strong> Dosyan\u0131n ba\u015f\u0131na \/\/ @ts-nocheck<\/code> ekleyerek o dosyadaki t\u00fcm tip denetimini devre d\u0131\u015f\u0131 b\u0131rakabilirsiniz.<\/li>\n
                • Belirli bir sat\u0131r i\u00e7in:<\/strong> \/\/ @ts-ignore<\/code> veya \/\/ @ts-expect-error<\/code> yorumlar\u0131n\u0131 kullanarak sonraki sat\u0131rdaki tip hatas\u0131n\u0131 yoksayabilirsiniz.<\/li>\n
                • tsconfig.json<\/code> ayarlar\u0131:<\/strong> \"noImplicitAny\": false<\/code> veya \"strict\": false<\/code> gibi ayarlar\u0131 kapatmak, daha az kat\u0131 tip denetimine yol a\u00e7ar, ancak bu genellikle \u00f6nerilmez. Ayr\u0131ca \"exclude\"<\/code> b\u00f6l\u00fcm\u00fcne belirli dosyalar\u0131 veya klas\u00f6rleri ekleyerek derleme d\u0131\u015f\u0131 b\u0131rakabilirsiniz.<\/li>\n<\/ul>\n
                  Unutmay\u0131n, bu y\u00f6ntemler genellikle ge\u00e7ici \u00e7\u00f6z\u00fcmlerdir ve m\u00fcmk\u00fcn oldu\u011funca tip hatalar\u0131n\u0131 d\u00fczeltmeye \u00e7al\u0131\u015fmal\u0131s\u0131n\u0131z.<\/p>\n
                  <\/body><\/p>\n","protected":false},"excerpt":{"rendered":"G\u00fcn\u00fcm\u00fcz web geli\u015ftirme d\u00fcnyas\u0131nda, b\u00fcy\u00fck ve karma\u015f\u0131k uygulamalar\u0131n y\u00f6netimi giderek daha zorlu hale gelmektedir. JavaScript’in esnek yap","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-35181","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-genel","7":"cs-entry","8":"cs-video-wrap"},"yoast_head":"\nTypeScript ve Visual Studio Code Kurulumu - 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\/typescript-ve-visual-studio-code-kurulumu\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"TypeScript ve Visual Studio Code Kurulumu\" \/>\n<meta property=\"og:description\" content=\"G\u00fcn\u00fcm\u00fcz web geli\u015ftirme d\u00fcnyas\u0131nda, b\u00fcy\u00fck ve karma\u015f\u0131k uygulamalar\u0131n y\u00f6netimi giderek daha zorlu hale gelmektedir. JavaScript'in esnek yap\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/\" \/>\n<meta property=\"og:site_name\" content=\"Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" \/>\n<meta property=\"article:published_time\" content=\"2025-11-26T13:41:48+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=\"14 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/\"},\"author\":{\"name\":\"Fatih Soysal\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"headline\":\"TypeScript ve Visual Studio Code Kurulumu\",\"datePublished\":\"2025-11-26T13:41:48+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/\"},\"wordCount\":2249,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/#respond\"]}],\"copyrightYear\":\"2025\",\"copyrightHolder\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/\",\"name\":\"TypeScript ve Visual Studio Code Kurulumu - Kodlar\u0131n Gizemli D\u00fcnyas\u0131\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\"},\"datePublished\":\"2025-11-26T13:41:48+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\/\/fatihsoysal.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"TypeScript ve Visual Studio Code Kurulumu\"}]},{\"@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":"TypeScript ve Visual Studio Code Kurulumu - 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\/typescript-ve-visual-studio-code-kurulumu\/","og_locale":"tr_TR","og_type":"article","og_title":"TypeScript ve Visual Studio Code Kurulumu","og_description":"G\u00fcn\u00fcm\u00fcz web geli\u015ftirme d\u00fcnyas\u0131nda, b\u00fcy\u00fck ve karma\u015f\u0131k uygulamalar\u0131n y\u00f6netimi giderek daha zorlu hale gelmektedir. JavaScript'in esnek yap","og_url":"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/","og_site_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","article_published_time":"2025-11-26T13:41:48+00:00","author":"Fatih Soysal","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Fatih Soysal","Tahmini okuma s\u00fcresi":"14 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/#article","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/"},"author":{"name":"Fatih Soysal","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"headline":"TypeScript ve Visual Studio Code Kurulumu","datePublished":"2025-11-26T13:41:48+00:00","mainEntityOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/"},"wordCount":2249,"commentCount":0,"publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/#respond"]}],"copyrightYear":"2025","copyrightHolder":{"@id":"https:\/\/fatihsoysal.com\/blog\/#organization"}},{"@type":"WebPage","@id":"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/","url":"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/","name":"TypeScript ve Visual Studio Code Kurulumu - Kodlar\u0131n Gizemli D\u00fcnyas\u0131","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/#website"},"datePublished":"2025-11-26T13:41:48+00:00","breadcrumb":{"@id":"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fatihsoysal.com\/blog\/typescript-ve-visual-studio-code-kurulumu\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/fatihsoysal.com\/blog\/"},{"@type":"ListItem","position":2,"name":"TypeScript ve Visual Studio Code Kurulumu"}]},{"@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\/35181","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=35181"}],"version-history":[{"count":1,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/35181\/revisions"}],"predecessor-version":[{"id":35182,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/35181\/revisions\/35182"}],"wp:attachment":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media?parent=35181"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/categories?post=35181"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/tags?post=35181"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}