Etiket: react

GitHub Paketlerini kullanarak özel npm paketleri yayınlama

Bu makalemde firmanıza/kendinize özel npm paketlerinizi yayınlamak için GitHub Paketlerini nasıl kullanacağınıza değineceğim. Bu işlem ile geliştirdiğiniz paketleri diğer uygulamalarınızda da kullanacaksınız. Asıl amacım her projem için geliştirdiğim react componentlerimi farklı uygulamalarımda da kopyalama yapmak yerine oluşturduğum npm paketinden çekmek olacak.

Öncelikle github üzerinde ki işlemlerimizi yapacağız.

“Generate Token” butonuna bastıktan sonra bir kod üretecek. Bu kodu not ediniz. Ayrıca ileride git action kullanarak publish etmek için ilgili kodu repostory içinde secret içine ekleyebilirsiniz.

Bu işlemleri yaptıktan sonra yeni açtığımız repositoryinizi clone yaptığınız dizinde package.json dosyasını oluşturacağız. Bunun için ilgili dizinde aşağı da ki komutu çalıştırın.

npm init

Oluştururken name alanını aşağıda ki formata dikkat ederek oluşturun

"name": "@your_username/your_project_name"

Oluşan dosyasına aşağıda ki satırları kendi bilgileriniz ile ekleyin.

"publishConfig": {
"registry": "https://npm.pkg.github.com/your_username"
},
"repository": {
"type": "git",
"url": "ssh://git@github.com:your_username/your_project_name.git",
"directory": "@your_username/your_project_name"
}

Oluşan dosya index.js dosyası oluşturup, console.log(“bir şeyler”); ekleyin.

Oluşturduğumuz Paketlere Erişim

Oluşturduğumuz paketi yine npm komutları ile kullanacağımız için oluşturduğumuz npm paketi bilgilerini bilgisayarımıza tanımlamalıyız. Bu tanımlamayı .nmprc dosyası ile yapıyoruz. Oluşturacağınız dosyanın path görmek için CMDde aşağıda ki komut sonucu HOME pathte oluşturmanz gerekiyor.

npm config list

Dosya içeriği de aşağıda ki tanımı ekleyiniz.

registry=https://npm.pkg.github.com/@your_username
registry=https://registry.npmjs.org
registry=https://registry.npmjs.org/

.npmrc dosyasını oluşturduktan sonra aşağıda ki komut CMD çalıştırın. Password yerine bir önceki adımda oluşturduğumuz token bilgisini girmeniz gerekmektedir. Bu işlemleri yaptığınızda .npmrc dosyasının değiştiğini göreceksiniz.

npm login —registry=https://npm.pkg.github.com —scope=your_username

.npmrc dosyası aşağıda ki şekilde olacaktır.

registry=https://registry.npmjs.org/
@your_username:registry=https://npm.pkg.github.com/
//npm.pkg.github.com/:_authToken=xxx

Ayrıca npm paketlerini kullanmaya devam edebilmek için aşağıda ki bloğuda .npmrc ekleyebilirsiniz

registry=https://registry.npmjs.org/

Login olunduktan sonra projenizi publish etmeiz gerekmektedir.

npm publish

Oluşturulan paketleri projeye eklenmesi

Oluşturulan paketleri kullanacak projenize aşağıda ki npm komutu ile ekleyebilirsiniz.

npm install @your_username/your_project_name@version

1 | React – Template Kurulumu

Genellikle .net platforumda kurumsal firmaların iç uygulamalarını geliştirdim. Js tarafında herkes gibi jquery kullanarak hep çözüme ulaştırdım. Zaten web tarafında devexpress kurtarıcımız oluyordu. Şuan çalıştığım firmamda önemli dönüşümler yapıyoruz. Bunlarında bir tanesi de ön yüzü react.js ile yine yazmak oluyor. Buradan edindiğimi tecrübelerimi bir .netçi gözü ile yazı dizimi yapmayı hedefledim. React ile temel konulara girmeyeceğim. Zaten temel olarak aradığınızda çoğu yerden bulabiliyorsunuz. Benim yapmak istediğim; yazdığım web api ile haberleşen, typescript kullanarak amatör olmayan bir framework oluşturmak.

Öncelikle yeniden tasarım yapmamak için hazır template indirmekle başlayalım. Aşağıda adresini paylaştığım template indirin, bilgisayarınızda klasöre kopyalayın.

Node modules leri kurmasını sağlayın ve başlatın. Uygulamaız açılmasını bekliyorum.

npm install
npm start

Template içinde ki bileşenleri incelemnizde fayda var, çoğunu react component olarak yapacağız.

https://coreui.io/react/