Aws Amplify Kurulumu -1

Herkese selam ­čľÉ Bu yaz─▒da AmplifyÔÇÖ─▒n ne oldu─čundan ve kurulumunda bahsedece─čim. O zaman haydi ba┼člayal─▒m :)

Amplify Nedir ?

Amplify, mobil ve web uygulamalar i├žin AWS taraf─▒ndan olu┼čturulan servistir. Client taraf─▒nda yap─▒lan model vb. ayarlar ile DynamoDB kullanarak haz─▒r REST veya GraphQL olarak bir API servisi sunar.

AWS Amplify A├ž─▒kmas─▒

Amplify Cli Kurulumu

AWS, Amplify i├žin baz─▒ i┼člerimizi otomatize etmemizi sa─člayan Amplify Cli olu┼čturmu┼č. Bu paketi npm / yarn arac─▒l─▒─č─▒ ve curl ile kurabiliriz.

npm install -g @aws-amplify/cli

veya

yarn global add @aws-amplify/cli

komutu ile amplify cliÔÇÖy─▒ globalÔÇÖe kurabiliriz.

Ya da curl ile kurmak istersek:

Macos ve Linux s├╝r├╝mleri i├žin:

curl -sL https://aws-amplify.github.io/amplify-cli/install | bash && $SHELL

Windows s├╝r├╝m├╝ i├žin:

curl -sL https://aws-amplify.github.io/amplify-cli/install-win -o install.cmd && install.cmd

komutlar─▒n─▒ ├žal─▒┼čt─▒rarak kurabiliriz.

Kurulum tamamland─▒ktan amplify komutu ile versiyon kontrol├╝ yap─▒p kurulumun ger├žekle┼čti─činden emin olabiliriz.

amplify -v

Art─▒k amplifyÔÇÖ─▒ kullanabiliriz :)

Amplify Konfigrasyonu

AmplifyÔÇÖ─▒ kullanmam─▒z i├žin lokalimizdeki ayarlar─▒ d├╝zenleyip var olan AWS hesab─▒ ile ili┼čkilendirmek gerekiyor. Bunun i├žin configure komutunu ├žal─▒┼čt─▒rmak gerekiyor.

amplify configure

Bunu yapt─▒─č─▒m─▒z anda, AWS consolu a├ž─▒l─▒r. Burada amplify kullan─▒mda yetkilendirmek ├╝zere bir user eklememiz gerekir. Bunun i├žin s─▒ras─▒ ile ┼ču ayarlar gelir.

  • region (B├Âlge se├žimi)
  • user name (AmplifyÔÇÖ─▒ kullanacak olan user i├žin user name)

Bu alanlar─▒ girdiken sonra, ekledi─čimiz userÔÇÖ─▒n access ayarlar─▒n─▒ yapmam─▒z i├žin AWS consoleÔÇÖnuna gitmek gerekiyor. Ve s─▒ras─▒ ile ┼ču alanlar─▒ doldurmam─▒z gerekiyor.

Burada en ├Ânemli ┼čey, AdministratorAccess-Amplify ayarlar─▒n─▒ aktif etmeyi unutmamakt─▒r.

Bu a┼čamalar─▒ yapt─▒ktan sonra, son ekranda Access Key ID ve Secret Access Key bilgilerinin buldu─čunu ekran gelecektir.

Bu bilgileri ald─▒ktan sonra, lokalimizdeki konsoldan tekrar devam edebiliriz.

En son olarak da, Profile NameÔÇÖe localimizde bu userÔÇÖ─▒n hangi isim ile kay─▒tl─▒ olaca─č─▒n─▒ yaz─▒p i┼člemleri tamaml─▒yoruz.

Amplify ile Servis olu┼čturma

Burada ├Ârnek olarak next ile olu┼čturulmu┼č bir projeye amplify ile servis ekleyelim. Ben lokalimde create-next-app ile next-amplify ad─▒nda bir proje olu┼čturdum. Ek olarak src ad─▒nda bir klas├Âr olu┼čturup, pages ve styles klas├Ârlerini bu dizine ald─▒m.

S─▒rada amplify init ile projeye amplify y─▒ projeye eklemek var.

ProjeÔÇÖnin buldu─ču dizine gidip amplify init komutu ├žal─▒┼čt─▒r─▒yoruz. Yeni bir amplify uygulamas─▒ olu┼čturmam─▒z─▒ sa─člayacak.

Asl─▒nda amplify bize bir back-end projesi olu┼čturur. Buradaki sordu─ču ise, olu┼čturulacak back-end projesinin ad─▒d─▒r.

environment: farkl─▒ ortamlar i├žin ( geli┼čtirme ortam─▒, test, production vb.) farkl─▒ environmentÔÇÖlar eklenebilir. (Bunu bir sonra ki yaz─▒da anlataca─č─▒m). ┼×imdilik tek ortam olsun ve ad─▒na dev diyelim.

Kullan─▒d─▒─č─▒m─▒z edit├Âr se├žiyoruz.

Burada ise, client uygulamas─▒ ne ile ├žal─▒┼čacak bunu se├žiyoruz. Ben Next kulland─▒─č─▒m i├ži javascript ÔÇśi se├žtim.

Kulland─▒─č─▒m─▒z framework├╝ se├žiyoruz.( E─čer framework kullanmayacaksak none i se├žece─čiz)

Kurulum tamamlad─▒ktan olu┼čacak API ba─člant─▒lar─▒n─▒n hangi dizin i├žinde olaca─č─▒n─▒ yaz─▒yoruz.

Proje build al─▒nd─▒ktan sonra hangi klas├Ârden yay─▒na girece─čini yaz─▒yoruz. Bu Next projesi i├žin out klas├Âr├╝.

Build ve start scriptlerini yaz─▒yoruz.

Var olan bir AWS userÔÇÖ─▒ m─▒ kullan─▒lacak yoksa yeni bir user m─▒ olu┼čturacak bunu se├žiyoruz. Ben ilk a┼čamada olu┼čturdu─čumuz userÔÇÖ─▒ kullanaca─č─▒m

Evet, Amplify Projesi olu┼čturdu─čumuza g├Âre art─▒k API olu┼čturabiliriz.

Bunun i├žin amplify add api komutunu ├žal─▒┼čt─▒rmam─▒z gerekiyor.

─░lk olarak API t├╝r├╝n├╝ se├žiyoruz. GraphQL veya Rest olarak. Ben GraphQLÔÇÖi se├žtim.

Provide API name: API ad─▒

Authentication t├╝r├╝n├╝ se├žiyoruz.( Ben default olu┼čan API keyÔÇÖi se├žtim ┼ču anl─▒k.)

Sonra ki a┼čamalar s─▒ras─▒ ile:

  • API key description: API Key i├žin herhangi bir a├ž─▒klama / zorunlu
  • After how many days from now the API key should expire: API keyÔÇÖin ka├ž g├╝n sonra s├╝resinin dolaca─č─▒n─▒ yaz─▒yoruz. (1 ile 365 g├╝n aras─▒nda)
  • Do you want to configure advanced settings for the GraphQL API : GraphQL API i├žin geli┼čmi┼č bir ayar yapmak isteyip istemedi─čimizi soruyoruz. Ben hay─▒r dedim. (No, I am done se├žene─čini se├žip)
  • Do you have an annotated GraphQL schema: Bir GraphQL ┼čemam─▒z─▒n olup olmad─▒─č─▒n─▒ soruyor. Benim olmad─▒─č─▒ i├žin Hay─▒rÔÇÖ─▒ se├žtim.
  • Choose a schema template: Buradaki bahsetti─či ise, olu┼čacak veri taban─▒ modelleri aras─▒nda bir ba─člant─▒ olup olmayaca─č─▒. Bunu sonradan ayarlayabiliriz diyerek ben basit olan─▒ se├žtim ┼čuan.

Ve son olarak ┼čemay─▒ editleyece─čimizi s├Âyl├╝yoruz ve api olu┼čturma s├╝reci tamamlan─▒yor.

projede /amplify/backend/schema.graphql dosyas─▒n─▒ a├žarak modeli g├Ârebiliriz.

Mesela bize ├Ârnek olmas─▒ i├žin burada Todo bir model olu┼čturmu┼č. Bu modele done ad─▒nda Boolean bir field ekleyebiliriz.

Bunu ekledikten sonra, APIÔÇÖy─▒ lokalimizde

amplify mock

komutu ile ├žal─▒┼čabiliriz.

benzer ┼čekilde javascriptÔÇÖi se├žmemiz ve otomatik olu┼čacak query ve mutationlar─▒ onaylamam─▒z gerekiyor. Ve sonunda src dizinine grapqhl ad─▒nda bir klas├Âr olu┼čuyor. Burada otomatik olu┼čturulan query, mutation, subscriptionÔÇÖlar─▒ g├Ârebiliriz.

Not: Bu dosyalar, schema.graphql dosyas─▒nda var olan typeÔÇÖlara g├Âre otomatik olu┼čur ve de─či┼čtirilmemesi gerekir. Zaten amplify bunun overwrite edildi─čini s├Âyl├╝yor dosya ba┼č─▒nda.

Mock i┼člemi tamamlad─▒─č─▒nda uygun olan ip adres ve portta API servisini aya─ča kald─▒r─▒yor. APIÔÇÖ─▒ buradan test edebiliriz.

API geli┼čtirilmesi tamamlad─▒ktan sonra (veya bir de─či┼čiklik yapt─▒ktan sonra),

amplify push

diyerek APIÔÇÖ─▒ AWS ye g├Ânderebiliriz. Vee projemiz olu┼čtu :)

Evett ┼čimdilik bu kadar, bir sonra ki yaz─▒da AmplifyÔÇÖ─▒ aray├╝zde nas─▒l kullanaca─č─▒m─▒z─▒ ve baz─▒ ek bilgiler daha verece─čim ­čÄë

S├╝r├ž-i klavye ettiysek affola ­čÖĆ

Front-End Developer And Mathematician ­čôę edisdev14@gmail.com https://github.com/edisdev

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store