quickxd 1
quickxd
noisiv 1
noisiv
Manwe Work 1
Manwe Work
Scarlet 1
Scarlet
Bvural41 1
Bvural41
Hikaye Ekle

Altın Konu Node.js TypeScript Nasıl Kullanılır?

  • Konuyu başlatan Konuyu başlatan ByMoDuS
  • Başlangıç tarihi Başlangıç tarihi
  • Cevaplar Cevaplar 2
  • Görüntüleme Görüntüleme 612

HERAKLES Otomatik Avlı kalıcı sunucu. 19 Haziran'da açılıyor. Atius & Wizard güvencesiyle hemen kayıt ol, ön kayıt ödülleri aktif. HEMEN TIKLA!

1.jpg

Node.js TypeScript Nasıl Kullanılır?


Node.JS'de TypeScript Nasıl Kurulur

Node.js projenizle TypeScript'i kullanmaya başlamak için burada ve orada birkaç yapılandırma çekmeniz gerekecek.

Ancak, devam etmeden önce Node.js npm paketini kurduğunuzdan emin olun.

Bir package.json Dosyasını Başlatın

Terminalinizi açın ve bir proje klasörü oluşturun. Ardından, bu yeni dizini girin ve bir Node.js projesini başlatın:

Yukarıdaki komut, bağımlılıklarınızı depolamak için bir package.json dosyası oluşturur.

TypeScript ve Diğer Bağımlılıkları Yükleyin

Ardından devam edin ve TypeScript'i Node.js projenize yükleyin:
npm i -D typescript

-D anahtar sözcüğü, TypeScript'in package.json içindeki devDependencies'in bir parçası olarak yüklenmesini sağlar.

Ayrıca, Express.js için bir TypeScript tanımı olan @types/express yüklemeniz gerekir:
npm install -D @types/express

Ardından, bir tsconfig.json dosyası başlatın. Bu, projeniz için temel derleyici seçeneklerini detaylandırır:
npx tsc --init

Yukarıdaki komut, proje kök klasörünüzde bir tsconfig.json dosyası oluşturur. Ayrıca, Express.js'yi yükleyin.

Sunucuları yalnızca Node.js'nin yerleşik HTTP temel öğeleriyle yönetmeyi düşünüyorsanız bunu atlayabilirsiniz. Ancak Express.js bunu kolaylaştırır:
npm install express

Ardından, kodunuzda herhangi bir değişiklik olduğunda sunucunuzu otomatik olarak yeniden başlatan bir paket olan nodemon'u yükleyin.

Çalışması için bunu global olarak yüklediğinizden emin olun:
npm install -g nodemon


2.jpg

TypeScript'i Node.JS ile Yapılandırma

Seçtiğiniz kod düzenleyiciyi kullanarak daha önce başlattığınız tsconfig.json dosyasını açın. Bu dosyada çok şey olabilir.

Bu dosyayı mevcut haliyle yapılandırabilirken, daha basit hale getirmek için tüm içeriğini aşağıdakiyle değiştirebilirsiniz.

Başlamak için tsconfig.json'da ihtiyacınız olan şey şudur:
{
"compilerOptions": {
"module": "commonjs",
"esModuleInterop": true,
"target": "es6",
"moduleResolution": "node",
"sourceMap": true,
"outDir": "dist" //Specifies the transpiler directory.
},
"lib": ["es2015"]
}

Şimdi package.json dosyasını açın, TypeScript ve Express'i yükledikten sonra şu anda nasıl göründüğü:

Ardından, komut dizisi dizisine aşağıdaki yapılandırmaları ekleyin:
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "npx tsc",
"start": "node ./dist/app.js",
"dist": "tsc -p .",
"dev": "nodemon ./src/app.ts", //Replace this with the correct directory path for app.ts in your case
"type": "module"
}

Bu nedenle, geliştirme ortamını başlattığınızda nodemon, app.ts dosyasını çalıştırır.

Node.js daha sonra bunu HTTP sunucusuyla iletişim kuran app.js içindeki JavaScript'te derler.

Ardından, proje kök dizininizde bir src klasörü oluşturun. Bu klasörün içinde boş bir TypeScript dosyası oluşturun ve onu app.ts olarak adlandırın .

Aktarıcı Dizini Oluşturun

Aktarıcı, TypeScript kodunu yerel JavaScript'te derleyen bir JavaScript dosyasıdır.

Bu, sunucunun kesinlikle yazılan komut dosyası yerine JavaScript olarak kodunuzla ilişki kurmasını sağlar.

TypeScript kod yapısını işlerken, aktarıcı dosyası onu JavaScript'te derler.

Şimdi, dist aktarıcı dizinini otomatik olarak oluşturmak için derleme komut dosyasını çalıştırın:
npm run build

Yukarıdaki komut, TypeScript kodunuzu JavaScript'te derler. Oluşturulan klasör iki dosya içerir;
app.js ve app.js.map

package.json'u tekrar açınız. Main adlı dizide bir anahtar göreceksiniz. Değerinin index.js'ye işaret ettiğini görebilirsiniz.

Bunu app.js (aktarıcı) dosya dizini ile değiştirin:
"main": "./dist/app.js",

Biçimlendirmeden sonra package.json şöyle görünmelidir:

HTTP İsteği Oluşturun ve Çalıştırın


Şimdi kodunuzun gerektiği gibi derlenip derlenmediğini görmek için Express.js sunucusu aracılığıyla bir HTTP isteği oluşturup çalıştırmayı deneyin.

app.ts'nin içinde :

import express, {Request, Response} from 'express'

const app = express()

app.get('/', async (req: Request, res: Response)=>{
console.log('Hello world')
res.send('Hello world')
})

const port = 8080

app.listen(port, (): void=>{
console.log(`App is listening at :${port}`)
})

Ardından, projenizin kök dizinine giden komut satırını açın ve projenizi başlatmak için dev komut dosyasını çalıştırın:
npm run dev

Tarayıcınızı açın ve localhost:8080'e gidin, yanıtı göreceksiniz.

Yukarıdaki örnekte yaptığımız gibi console.log komutunu uyguladıysanız, bunu terminalde de göreceksiniz.

3.jpg
 

Şu an konuyu görüntüleyenler (Toplam : 0, Üye: 0, Misafir: 0)

Geri
Üst