[ad_1]
JHipster, modern reaktif ön uçlar kullanarak tam yığın Java uygulamalarının geliştirilmesini kolaylaştırmaya adanmış, uzun ömürlü ve iddialı bir karma Java ve JavaScript projesidir. JHipster geliştirme ekibi, endüstri değişikliklerine ayak uydurmak için sürekli olarak yeni sürümler yayınladı. Basit bir uygulama oluşturarak bu çerçevenin neler yapabileceğini öğrenelim.
JHipster nedir?
Kutunun dışında, JHipster ön uç için React, Vue ve Angular’ı destekler. Planlar olarak bilinen eklentiler aracılığıyla Svelte dahil diğer çerçeveleri destekler. Arka uçta, Spring Boot ağır kaldırma işini yapıyor. Bu bağlamda, JHipster Hilla çerçevesine benzer, ancak çok çeşitli ön uç yığınlarını destekleme konusunda daha iddialı bir hedefe sahiptir. Temelde JHipster, Java ve JavaScript oluşturma araç zincirlerini birleştiren ve çeşitli yönetim yeteneklerini üstte katmanlayan gelişmiş bir oluşturma aracıdır.
JHipster, tam yığın uygulamalara ek olarak, mikro hizmet bileşenleri oluşturmayı destekler ve hem JPA tabanlı ilişkisel veri depoları hem de MongoDB ve Cassandra gibi NoSQL veri depoları için yapı iskelesine sahiptir. Ayrıca günlüğe kaydetme ve analiz için özelliklere sahiptir.
JHipster’ın araç seti, bir komut satırı ve bir alana özgü dil (DSL) içerir. görsel veri modelleyici ve bir web tabanlı kurucu (Steroidler üzerinde Spring Initializr’i düşünün). Başlamak için komut satırını kullanacağız. Oldukça güncel Java, Node.js ve Git sürümlerinin yüklü olduğu bir sisteme ihtiyacınız olacağını unutmayın.
JHipster örnek uygulama
Takip et JHipster hızlı başlangıç yüklemek için jeneratör-jhipster NPM paketini açın ve oluşturucuyu çalıştırmak için yeni bir dizin oluşturun.
Şekil 1’de gösterilene benzer bir etkileşimli bilgi istemi göreceksiniz.
Varsayılanların çoğunu kabul edebilirsiniz, ancak bu örnek için veritabanı olarak MongoDB’yi ve ön uç çerçeve olarak React’i kullanacağız (Ruh halinizi yansıtan Bootswatch temasını seçin). Bu seçenekleri bir kez ayarladığınızda, JHipster işini yapacak ve az önce oluşturduğunuz dizinde sizi yeni bir uygulama ile baş başa bırakacaktır.
Uygulamayı oluşturun ve çalıştırın
JHipster şimdi tam yığın bir Java ve JavaScript uygulamasının iki yarısını oluşturdu. Arka uç Maven ile inşa edilmiştir ve ön uç ile inşa edilmiştir web paketi. Uygulamayı başlatmak için iki yarıyı aynı anda çalıştırabilirsiniz. (Arka planda çalışan MongoDB’ye de ihtiyacınız olduğunu unutmayın.)
Bir kabukta şunu girin: ./mvn -P-webapp
. Bu komut Java arka ucunu oluşturacak ve çalıştıracaktır. kullanıyoruz -P-webapp
Maven’in şeylerin web paketi bölümünü çalıştırmasını önlemek için bayrak.
Başka bir kabukta şunu girin: npm start
. Bu komut ön ucu oluşturur ve yeni başlattığınız Java sunucusuna yönlendirilen API çağrıları ile web paketinin geliştirme modunda çalıştırır.
Her şey yolunda gittiyse, localhost:8080’de Şekil 2’de gösterilene benzer bir ekranla karşılaşacaksınız.
Bir test kullanıcısı oluşturun
Uygulamayı kurcalarsanız, burada çok şey olduğunu hemen keşfedeceksiniz. JHipster’ın oluşturucusu, işlevsel kullanıcı yönetimi ve JWT tabanlı bir kimlik doğrulama sistemi dahil olmak üzere, tipik aracınızdan çok daha fazlasını verir. Uygulama ayrıca, bir test kullanıcısı oluşturmak için kullanacağımız varsayılan hesaplara sahiptir.
Başlamak için, Kayıt ol Yeni bir kullanıcı oluşturmak için uygulama ekranının sağ üst tarafındaki seçeneği. Ardından, bir test kullanıcısı oluşturun ([email protected]), ardından giriş yapmak ve varsayılanı seçin yönetici/yönetici kullanıcı. Kullanıcı yönetimi ekranına gidin (Yönetim -> Kullanıcı Yönetimi). Yeni kullanıcınızın listelendiğine dikkat edin. Etkin olmayan düğmeyi etkin duruma getirerek kullanıcıyı etkinleştirebilir ve ardından test kullanıcısı olarak oturum açabilirsiniz. Bu kullanıcının yönetici konsoluna erişemediğine dikkat edin.
Dediğim gibi, bu, özellikle JHipster’ın yalnızca React ve MongoDB yığınını değil, aynı zamanda Angular, Vue ve bir dizi SQL ve NoSQL veri deposunu da desteklediğini düşündüğünüzde, kullanıma hazır bir çok işlevdir.
Kodu keşfedin
Tüm bu işlevselliği desteklemek için, tahmin edebileceğiniz gibi, JHipster’ın oldukça fazla kodu vardır. Neyse ki, büyük ölçüde günceldir ve programlamanın en iyi uygulamalarını takip eder. Örneğin, React kodu işlevsel bileşenleri kullanır, kancalardan yararlanır ve merkezi bir Redux mağazasına karşı çalışır.
Uygulama dizinine bir göz atın ve şöyle bir yapı göreceksiniz:
/foundry-jhipster/
/webpack/
: Web paketi paketi için yapılandırma/kullanımlar/src/main/
/java/
: Java kaynakları/webapp/
: Ön uç kaynaklar
/target/
: Her iki yapı için çıktı dizini/webapp/
: Ön uç derleme çıktısı/java/
: Arka uç derleme çıktısı/docker/
: Kapsayıcılaştırmayı destekleyen dosyalar
Java uygulaması için ana sınıf src/main/java/com/mycompany/myapp/JhipsterApp.java
. Özünde bir Spring Boot web uygulamasıdır ve komut satırı argümanlarıyla yapılandırılabilir. --spring.profiles.active=your-active-profile
.
Kutudan çıkan Java uygulaması, Spring Security aracılığıyla kimlik doğrulama ve yetkilendirme zorlaması ile temelde kullanıcı CRUD (oluşturma, okuma, güncelleme ve silme) işlevleri için API’dir. Spring Security sistemi şurada yapılandırılmıştır: /myapp/security
. JHipster’ın JSON Web Token kullandığını unutmayın, bu nedenle desteklenecek sınıflar /security/jwt
.
Uygulamanın etki alanı modelleri şurada tanımlanmıştır: /domain
ön ucun karşılığı olan /entities
az sonra göreceğiniz dizin.
Şuna bakarak mevcut ön uç komut dosyalarını bulun package.json
. Buna ek olarak dev mode
şu anda kullandığımız komut, diğer özellikler arasında bir mongodb prune
komut, testler ve üretim oluşturma komutları.
Müşteri girişi şurada: /src/main/webapp/index.html
ama asıl iş şurada başlıyor /sec/main/webapp/app/app.tsx
uygulama yönlendiricisini tanımlayan (rotalar router.tsx
) çeşitli sayfa bileşenlerini barındıracak.
Uygulamanın tanımlı web sayfası bileşenlerini bulabilirsiniz. main/webapp/app/modules
; örneğin, /home/home.tsx
ana sayfa tanımına sahiptir.
İçinde /main/webapp/app/shared
dizinde, uygulamada kullanılan kodu bulacaksınız. Bunun çoğu, model tanımı ve redüktörler gibi merkezi mağazaya ayrılmıştır. Şu anda, uygulama yalnızca kullanıcılarla ilgilenir, bu nedenle yalnızca bu bileşenler ve kimlik doğrulama kodu paylaşılan dizinde bulunur.
bu /entities
klasör, modellenmiş varlıklarınızı destekleyecek kodu içerir. Ancak, kullanıcı modelinin paylaşılan dizinde saklandığını unutmayın. Henüz varlık yok, o yüzden biraz ekleyelim.
Bir model tanımlayın: JDL ve JDL-Studio
JDL, uygulama modellerini tanımlamak için JHipster’ın etki alanına özgü dilidir. Bundan çok daha fazlasını yapar—JDL meta verileriyle tüm bir uygulamayı tanımlayabilirsiniz—ancak biz modele odaklanacağız.
Başlamak için kullanalım JDL-Stüdyo, JHipster’ın bir etki alanı modeli için bazı CRUD işlevlerini hızlı bir şekilde oluşturmak için çevrimiçi aracı. Şekil 3’te gösterilene benzer bir varlık ilişkisi oluşturucu göreceksiniz.
JDL oluşturucu, varlıkların ve özelliklerinin yanı sıra bunlar arasındaki ilişkileri tanımlamayı destekler. Oldukça açıklayıcı olduğu için burada sözdizimine dalmayacağız. Sol taraftaki tanımda değişiklikler yaparak ve bunların görsel ekranda nasıl ifade edildiğini gözlemleyerek söz dizimini keşfedebilirsiniz.
Verilen ilişkileri kabul edelim ve üzerine basarak dışa aktaralım. Bu JDL kaynağını indirin Ekranın sağ üst köşesindeki düğmesine basın. (İşlerin nasıl görüneceğini ve davranacağını yapılandırmak için araç çubuğunda birkaç seçenek olduğuna dikkat edin.)
Dosyayı aldıktan sonra, proje kökündeki komut satırınıza gidin ve şunu yazın jhipster jdl my-jdl-file.jdl
nerede my-jdl-file.jdl
az önce dışa aktardığınız dosyanın adıdır.
Komut istemi, birkaç dosyanın üzerine yazmak isteyip istemediğinizi soracaktır. Devam et ve bunu yap. Tamamlandığında, sunucuları yeniden başlatabilir ve uygulamaya ne eklediğinizi görebilirsiniz. Tarayıcıya geri dönün ve uygulamayı 9000 numaralı bağlantı noktasında tekrar açın ve şu şekilde oturum açın: yönetici/yönetici.
Şimdi, açtığınızda varlıklar Navigasyon çubuğundaki menü öğesi, az önce içe aktardığınız tüm varlıkları, bunları yönetmek için tam olarak gerçekleştirilmiş bir konsolla birlikte alırsınız. Örneğin, yeni bir “Ülke” varlığı oluşturabilir, ardından yeni bir “Konum” varlığı oluşturabilir ve yeni oluşturulan ülkeyi bulunduğunuz yerde kullanabilirsiniz. Tüm CRUD yeteneklerinin de orada olduğuna dikkat edin.
İzleme ve API yönetimi
Yönetici kullanıcılar için birkaç ek özellik dikkate değer. bu Yönetim menü içerir Metrikler Şekil 4’te gösterildiği gibi, çalışan JVM’nin özelliklerine ilişkin fikir sağlayan seçenek. Onun hakkında daha fazla bilgi için JHipster belgelerine bakın. izleme özellikleri.
JHipster ayrıca arka uç uç noktaları için OpenAPI/Swagger tanımları ve bunlarla etkileşim kurmak için basit bir konsol oluşturur. Şekil 5, API yönetim ekranını göstermektedir.
JHipster, tüm bunları farklı veri depolarına ve ön uç çerçevelere izin veren esnek bir mimariyle sunar. Sonuç olarak, etkileyici bir çerçeve.
Telif Hakkı © 2022 IDG Communications, Inc.
[ad_2]
Kaynak : https://www.infoworld.com/article/3661308/intro-to-jhipster-a-full-stack-framework-for-java-and-javascript.html#tk.rss_all