Photo by Jack Hamilton on Unsplash

React

Vite + React + TypeScript ile Counter Uygulaması

Vite son zamanlarda adını sıkça duyduğumuz bir Frontend Tooling aracı. Amacı Webpack’e göre daha hızlı çıktılar ve Hot Module Reloading yaparak kompleks projelerin hızlı geliştirilmesini sağlamak

2 min readSep 25, 2022

--

Vite ile uygulama geliştirmek istediğimizde yapmamız gereken oldukça basit bir işlem var.

  • Vite ortamınıza kurun.
  • .code ile VSCode içerisinde projenizi açın ve aşağıdaki komutları terminalde çalıştırarak projeyi tarayıcıda deneyin.
cd counter
npm install
npm run dev
  • Bu kısma kadar terminalden komut satırı çalıştırarak işlerimizi yaptık. 2 tane Counter oluşturalım. Bir tanesi functional component, diğeri ise class component oluşturalım.

Bu uygulamadaki Counter 2 default değerlerini dışarıdan tanımlayacağız.

Interface’ler üzerinden CounterProps ve CounterState tanımlayıp bunları oluşturduğumuz Function ve Class Component’larda kullanıyoruz.

Function Component

Class Component

Okumaya Devam Et 😃

Bu yazının devamı veya yazı grubundaki(TypeScript) diğer yazılara erişmek için bu linke tıklayabilirsiniz.

Bu yazının devamı veya yazı grubundaki(Webpack & FE Tooling) diğer yazılara erişmek için bu linke tıklayabilirsiniz.

--

--