Sizlere typescript projesi nasıl oluşturulur? Oluşturduktan sonra Typescriptte kullanılan temel tiplerden bahsedicem. Typescripttin en sevdiğim özelliklerinden bir tanesi temel ve custom tiplerle temiz kod yazmamızı sağlamasıdır. Ayrıca javascriptte gözden kaçırdığımız hataları typescript ile daha hızlı bir şekilde tespit edebilmemiz.

         Typescript projesi nasıl oluşturulur?

Ben proje oluşumunu Visual Studio Code üzerinden yapıcam. VS Code indirmek için buraya tıklayabilirsiniz. Projeyi oluşturmadan önce makinamıza ilk önce node.js yüklüyoruz. Node.js’i bu adresden indirebilirsiniz. İndirme işlemi tamamlandıktan sonra typescript’i indirelim. Bunun için command prompt açıp yükleme komutunu yazıyoruz.

npm install -g typescript

Yükleme işlemi tamamlandıktan sonra VS Code içerisinden proje dosyasını oluşturalım. Projede şuan için html ve .ts uzantılı iki dosya oluşturdum. .ts uzantılı dosyamız Typescript’tir 🙂

VS Code içerisinde oluşturduğumuz projeyi run edebilmek için node.js den biraz yardım alalım. Visual Studio Code içerisinden terminal’i açıyoruz. Projeye package.json dosyasını oluşturmak için npm init komutu yazıyoruz.

Ardından npm install –save-dev lite-server ile dev ortamını oluşturuyoruz. package.json içerisinde start: lite-server satırını ekleyip programa start verebiliriz.

Npm Lite-server ile programı başlattığımızda yapacağımız tüm değişiklikler için html, javascript dosyalarını yeniden okur anlık olarak değişikliklerin hepsini canlı olarak görmemizi sağlar. Böylelikle Projemizi kapatıp tekrar başlatmamıza gerek kalmaz. 🙂 

{
  "name": "typescript_example",
  "version": "1.0.0",
  "description": "test",
  "main": "helper.js",
  "scripts": {
    "test": "test",
    "start" : "lite-server"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "lite-server": "^2.5.4"
  }
}<span id="mce_marker" data-mce-type="bookmark" data-mce-fragment="1">​</span>

İşlemler tamamlandıysa çalıştırmayı npm start komutuyla yapıyoruz. Şimdi Typescript’i javascript diline çevirelim.

helper.ts içerisinde toplama işlemi yapan bir fonksiyon yazalım.

function Add(number1,number2) {
    const total = number1 + number2;
    return total;
}

console.log(Add(5,6));

Tekrar terminali açıyoruz. tsc helper.ts komutunu çalıştıralım ve karşımızda typescriptin javascript versiyonu .js dosyayı 🙂

Typescript kullanabilmek için html ‘de oluşturduğumuz .js dosyasını kaynak olarak kullanın. Browser .ts dosyasını okuyamaz ve kodlarınız da çalışmamış olur. Bir sonraki yazımda TypeScript temel tiplerden bahsedicem.

Proje oluşturma kısmında anlayışılmayan kısımlar için yazabilir, hata alırsanız yardımcı olmaya çalışabilirim.

The post Typescript nedir? appeared first on Dinamik Network.