JHIPSTER6.1.2
の編集
Top
/ JHIPSTER6.1.2
[
トップ
] [
編集
|
差分
|
バックアップ
|
添付
|
リロード
] [
新規
|
一覧
|
単語検索
|
最終更新
|
ヘルプ
]
-- 雛形とするページ --
10の質問
ABC予想
AI
AI API
AI プロンプト
AIでつかわれているtransformerのまとめ
AIの話題
ANTLR
ANTLR v3 FAQ よくある質問
ANTLR 独学
ANTLR4 独学
ANTLRでOracleのDDLを解析してみる
ANTLRチュートリアル
AOP
API
ARMマイコン基盤
ATOM SHELL理論
Access VBAメモ
Access-Control-Allow-Origin
AndroidとTensorflow
Android開発
Android開発 入門
AngularJS
Anko
Apache Bench
ArchUnitを学ぶ
Axiosとは
Axis2
BI Publisherで始めるデータ駆動型レポート作成
BPMNの勉強
BackTrack4
Blog from iPhone
Bootstrapとは
BracketName
C3 AI Applications
C3 AI エクスマキナ
CSS備忘録
CentOS
ChatGPTの話題
Chevrotainのパーサメソッド
Chevrotain一覧
Chromeエクステンション
Cocoa Touch Static Library
CoffeeScript
Confluent Control Centerやってみる
C言語でオブジェクト志向な記述方法
DDD ドメイン駆動設計
DDL生成ツール
DJUnit
DMM.comのAPIとか
DOSコマンドメモ
Dashcode
DeepFloyd IF
Dockerが動かない場合の対処
ES2015
Eclipse Monkey
Eclipse Plugin
Eclipseの色設定
Eclipse使いがXCode使い初めて知りたいこと
ElasticMQメモ
Elixir
Emmet
Erlangメモ
ExcelファイルをAIに読ませる
Exceptionを見やすく
Expression Tree
FLEX
FLEX リフレクション
Fisheye
FlashやJavascriptを使った演出
FormattingRules
FrontPage
GAE
GAE Data Store API
GENERAL SQL PARSER JAVA を試してみる
GLOBAL
GPT4ALL
GQL
GUIからMacPortsを管理するアプリケーション - Porticus
Generative Adversarial Networks
Gin JavaScriptで構文解析
Git Blame
GitHubアクションを使ったトロイの木馬のまとめ
GitLab
GitLabRunnerを増やす
GitLabでPlantUML使ってみる
GitLabでプロジェクト管理する
GitLabの機能をそのまま使って認証システム作ったらどこまでできる?
GitLabサーバインストールとメンテ注意事項
GitとAntとSpringとJUnit
Google Cloud Platform
Googleの裏技
Google認定プロジェクトマネージャの勉強メモ
Grails
GraphQL
HTM 階層型時間メモリ
HTML スクレイピング
HTML パース
HTML5
HTML5 Canvas
Hadoop
Help
If Then Maybe プログラミング
Inkscape script
InterWiki
InterWikiName
InterWikiSandBox
JAVAの記事一覧
JBoss
JDBC テーブル一覧を得る
JDBC カラム一覧を得る
JDT eclipse
JGRIB
JHIPSTER JDL
JHIPSTER OpenAPI
JHIPSTER エンティティをフィルタリングする
JHIPSTER6.1.2
JHIPSTERでスマホサイト
JHIPSTERのBLUEPRINTを作る
JHIPSTER一覧
JHipster
JHipster API FirstDepelop
JHipster エンティティを更新する
JHipster7をつかってみる
JHipsterでBuleprintを使いこなす
JHipsterのコード生成を改造
JHipsterのプロジェクトをGitLabでCI/CDする
JHipsterのプロジェクトをデプロイする
JMeter
JOOQとは
JSFとStruts
JSqlParser
Java Closure
Java Compiler API
Java Function
Java SQL Parserを調査する
Java Spring AOP
Java Spriteを設計してみる
Java オブジェクトのダンプ
Java ドラックできる曲線
Java 備忘録
Java 文字化け
Java11以降のJRE
Java7サンプルコード
JavaFx
JavaScriptでパーサを作る Chevrotain
Javaasist 動的にクラスを編集
Javascript グラフィックライブラリ
Javascript コーディングパターン
Javascript界隈
Javassist
JavaでSVG
Javaで関数型で引数をとる
JavaのジェネリクスTip
Javaのラムダ式
Javaの有名なライブラリ紹介
Javaは、IDEのテンプレートを使いこなせばいいよ
Javaプログラマ向けモナド
Javaメモリリーク
Jenkins
Jenkins(Hudson)メモ
Jestとは
Jhipsterマイグレーション
Json Yaml Xml Hash Scala
Kafka REST Proxy さわってみる
Kotolin
LDAPサーバをdockerで立ち上げる
Linux メモ
LiquiBaseとは
Lombok
MDBをコンパクトにするVBA
MQL5 小作品
MT4
MT5 EA
MYSQL
MacTool
Macにしゃべらせる
Mac用のメモ
Mattermostを使ってオンプレミスでチャット環境を作る
Maven
Mementoパターン
MenuBar
NILScript
NetBeanでプロファイル
Network Service Desk Engineer
Node-RED
Node-Red
NumPy
OQL オブジェクト問い合わせ言語
OSコマンドインジェクション
ObjctiveC サウンド
ObjectMapperの備忘録
ObjectiveC NSString
ObjectiveC サーバ
ObjectiveC ターミナル用コマンドを作る
ObjectiveC バックグラウンド
ObjectiveC ワーニング
Oculusアプリの開発
OpenFeint
OpenOffice
OpenResty
Outlook VBA
PHP
POSTGRESQL
Pandas Python Data Analysis Library
PdfBox Java用PDFライブラリ
Plagger
PukiWiki
PukiWiki/1.4
PukiWiki/1.4/Manual
PukiWiki/1.4/Manual/Plugin
PukiWiki/1.4/Manual/Plugin/A-D
PukiWiki/1.4/Manual/Plugin/E-G
PukiWiki/1.4/Manual/Plugin/H-K
PukiWiki/1.4/Manual/Plugin/L-N
PukiWiki/1.4/Manual/Plugin/O-R
PukiWiki/1.4/Manual/Plugin/S-U
PukiWiki/1.4/Manual/Plugin/V-Z
PyHipster
QuartzCore
RAD
REST
RWKV
Rails3
Railsと差分開発についての考察
React.js
React.js モーダル画面
RecentDeleted
RedmineLE
Redshift
Relumeでサイトの骨格を作る
Require.js
Rubycocoa
RubyでScalaをコンパイルするツールをつくる
Rubyアソシエーション認定証
Ruby入門
SCALA REPL
SCALA support tool
SCALAの記事一覧
SELinux
SEO
SEO Yahoo対策
SEO対策一覧
SPAM対策
SQLite
SSH
SVNをJavaで操作
SakuraZencoding
SandBox
Scala / Hadoop
Scala Process exec
Scala 遅延評価
Scala/LiftでSlim3
ScalaSigParser
ScalaWithExcel
Scala チュートリアル
Scalaで3D
ScalaでLisp
ScalaとGroovyのPOJO比較
ScalaのIDEについて
Scala言語を学ぶやさしいツール「Kojo」
Slack API やってみる
SocketAppender
Spring
Spring bootでのテストのTIPS
SpringBootのSTSの新規プロジェクトでるエラーの対応
SpringSecurity SAML
Sqlite
Squirrel
StringTemplate
Stringクラス拡張
TALEND
ThreadLocal
Todo一覧
Trac Lightning
Twitter
UltraEdit
Unityでシューティングゲーム作る際のメモ
VBAのコード
VBAをOpenOffice.org Basicにする
VBAをOpenOffice.org+Basicにする
VPN構築の勉強メモ
VPSやIaaSメモ
VSCodeでRuby開発
VSCodeメモ
VSCode用ChatGptのPlugin
VSCode設定
VirtualBox On Mac
Visual Studio Code プラグイン開発
Vuexとは
WBS管理の弊害
WIN32API
WSDL
Watson
WebDesign探訪
WebLogic フィルタ
WikiEngines
WikiName
WikiWikiWeb
Windows10のPowerShell でキーボードの言語切り替え
WindowsTool
Worker Thread パターン
XBee
XDOCLET
XForms
XPath
XSL
YahooPIPES
Yahooインフォセンター
Yet Another Pragger
YouTuber
YukiWiki
anacondaをcygwinで使う
ansible
antlr snippet
antlr 再入門
antlrと日本語
autoit
automator
bluemix
bootstrap2
bower
ccze Colorize log files on CentOS and Ubuntu using ccze tool
centos7
cglibを使って動的コード生成
cocos2d
cygwin
diff
dockerのローカルイメージをDocker-in-Dockerで参照する
eclipse設定
emacs 備忘録
emacs 文字列置換
emacsをviライクにする
excel tips
expectで自動化
figmaにプラグインをインストールする
ftp自動化
gemini
generator-jhipster-gql
git diffを使った構成管理の省力化
goをやってみる
grizzly
gulp
homebrew
iPhone Bluetoothプログラミング
iPhone iAd
iPhone 実機テスト手続き
iPhoneでグラフィックのHellowWorld
iPhoneとGmailメール
iPhoneに実機転送
iPhoneプログラミング
iPhoneプログラミング/ビューを理解すればiPhoneアプリの基礎を押さえられる
iPhoneプログラミング一覧
iPhoneプログラミング入門
iPhone開発/Interface Builder Plug-in
iPhone開発/キャプチャの取り方
intra-mart
jQuery.Flickableのメモ
java spring boot 認証 memo
jersey
jhipster-codeにアノテーション追加してみる
jhipsterのテンプレート改造準備
jparsecドキュメント日本語訳
jparsec入門
kafkaの勉強
log4j2の脆弱性
mac diff
mailcowのインストール
memcached
minecraft マイクラ あるきながら、高速ダンジョン作成
mqttの勉強
nginx_lua
nginxのメモ
node_moduleをnpm linkを使って自分用にする
npm
openapi generator
openapi-generatorをコンパイル
openstack
oraclerac
play framework 1.2.5 sample
play! framework
play!framework selenium
playframework テンプレート
postmanとopenapi
prezi プレゼン
pukiwikiで行動管理
pukiwikiに類似したツール
pukiwiki勉強
pukiwiki記事一覧
python
python3のwindowsでの日本語文字化け対応
pythonでseleniumを使う
pythonのテストに使うライブラリ
rails5
reactでポップアップ表示
redmine
ruby on rails 6.0.0
scala
scala 99problem 32~
scala prototype.zip
scala repl
scala sbaz
scala spring
scala/インストール
scalaでまだ不勉強なところ
scalaのインストール
selenium
slack api
spark
spring boot
spring initializerをつかってプロジェクトのひな型をゲットする
spring-test
springboot
springboot env
storybook
sublimetext2
swagger
tracについて
ubuntu
vaadin
vue を typescriptで開発
vue 共通部品作成
vue.js memo
vue.jsとは
vue.jsのデバッグ
vue一覧
webの編集画面のよくあるパターン
windows環境構築
wordpress
xamppについて
•Axis2の本家のスタートガイドによるWebサービスの作り方
【Javascript】【CLIライブラリ】commanderの勉強
【MQL5】KuniRangeBreakoutEA
いまさらながらC++
びっくりする短いコード
アクター
アニメーション
アノテーション
アプリコット
アプリコット PukiWiki
アプリコード
アプリコード林邦行
イラストのエフェクト
インテンショナルプログラミング
カスタマイズjhipster7.9.3イメージ
カブロボ
ガイガーカウンター
クラスとハッシュマップの関係
クラック対策
クロス集計
コマンドラインという概念への考察
コミニュケーション
コード生成
サロゲートキーを使ったテーブル設計
シェルのサンプル
シェルサンプル
スクレイピング
スレッドプログラミングメモ
ソースtoソース変形
ターミナルをAppleScriptで制御
テキストエディタ作成javascriptフレームワーク
テスト用まっさらDBをdockerでたてる
テスト駆動
テレワーク環境の比較
ドット絵
バイオビルダー合成生物学メモ
バグの少ない設計のためのValueObject
パフォーマンスチューニング
フロントエンドのテストの結合テストを減らすには?
プッシュ技術
プログラマーじゃない人に覚えてほしいプログラムのコメントの書き方
プロジェクト管理スプレッドシート
マイクラ 有名ディメンション モッド
マクスウェル方程式
メタ
ラムダ計算について考える
リベリカJava13いいみたい
リモートワークでのプロジェクト注意点
レイアウトツール
ログ解析
世界の構文解析グラマーたち
予定表
予定表/2009-12-14
予定表/2009-12-18
予定表/2009-12-19
予定表/2009-12-22
予定表/2009-12-23
予定表/2009-12-24
事業の心構え
事業計画方針
人工知能とCUDA
人工知能コンペKaggle
仕様書のフォーマットについての考察
他言語サイトサンプル作成
仮説Oracleの罠
作曲と効果音作り
共和分
口コミ
古いRails5を入れる
哲学
大文字小文字変換
学習をHackする
扶養とシステム
投薬のみのガンの治療薬
擬似コーディングのすすめ
放射能対策
数式を扱う
文章を書く
新エネルギー
新年の抱負2010
新技術 プログラム編
日本のゼネコン式IT開発が失敗する理由
最近更新したページ
未来技術/新技術
枯れた技術の水平思考
株価データ
業界の動向
構文解析の記事一覧
正規表現
気象データ
流れるようなインタフェース
管理画面の生成におけるopenapiとJDLなどの考察
細胞の若返り
経済のことをまとめてみる
脆弱性
自分でPlaggerみたいなのを作るためのメモ
論語/学而第一
負荷テスト
販売/デスクトップPC
販売/ノートパソコン
販売/外部ストレージ
起業
酸化グラフェン
開発哲学
電子出版
電子出版の記事一覧
非可換幾何学
顧客分析のデシル分析とRFM分析
DIコンテナについて考える
MP3から携帯着うたを作る方法
[[JHIPSTER一覧]] *目次 [#zc4d56ef] #contents [[JHIPSTER JDL]] * JHIPSTERとは、 [#v6981c80] spring bootのscaffoldをするツールです。vueとはangularとか選べます。 内部でyoemanをつかって、生成しているのですが、 その時に使うコマンドラインは、cmd.exeやgit for windowsや、cygwinではだめです。 https://cmder.net/ をつかってください。(日本語のファイル名、表示できるけど、カーソル移動がまだ、だめなので、ファイル名はアルファベットでやりましょう。PowerShellためしてみるか) yoemanの公式ページで、しっかりと、指定されてました。 cmdは、yoemanのインタラクティブなやりとりで、文字化けや色が適切に表示されません。 git for windows や cygwinでは、矢印キーでの選択ができないのです。 というか、microsoftは、このcmderを、windowsのデフォルトのターミナルにすべきです。 ** 本家 [#na91159e] https://www.jhipster.tech/ ** 書籍 [#eed9fd46] *** THE JHIPSTER MINI-BOOK [#aaa6aedc] https://corneliu.cl/docs/jHipster-5.pdf *** Full Stack Development with JHipster [#q3720804] https://www.oreilly.com/library/view/full-stack-development/9781788476317/ ** JHIPSTERの目標 [#b59e03d0] - 完全で最新のWebアプリケーションまたはマイクロサービスアーキテクチャをあなたに代わって生成することです。 - Spring Bootによるサーバーサイドの高性能で堅牢なJavaスタック - Angular、React、Bootstrapを搭載した、洗練されたモダンでモバイル初のフロントエンド - JHipster Registry、Netflix OSS、Elastic StackおよびDockerを使用した堅牢なマイクロサービスアーキテクチャ - Yeoman、Webpack、Maven / Gradleを使ってアプリケーションを構築するための強力なワークフロー ** ためしてみる [#q8a2659e] JHipster Quick Start の訳です。 *** 試してみた結果の結論 [#a5432428] 試してみた結果、2019/08/01の時点では、追加機能の面からいうと、下記のサイトを みるかぎり、JHIPSTER6よりも、JHIPSTER5のほうが、充実しているし、機能を追加しやすくする、jhipster-moduleは、jhipster6に、対応できていない。(hipsterでは、getConfigに置き換わっている)。まあ、そのうちなおるとおもう。 https://www.jhipster.tech/modules/marketplace/#/list ちょっと、枯れた技術のJHIPSTER5を選択するのが、いろいろ、なやまされなくていいかもしれない。 JHIPSTER6からは、jhipster-moduleのかわりに、bule-printという機能が、主力になってくるのだろう。今は、過渡期なので、対応してる機能がすくないだけなんだと思う。 以下は、そんなことも、しらずに、インストールしていったときに、書いた文章になります。 *** JHipsterをインストールする [#ee94119c] npm install -g generator-jhipster バージョンを指定してインストールすることもできるから、もし、変なバグがはいっているバージョンが最新だったら、それで回避しよう。 *** JHipsterをアップデートする [#x04a9249] 一旦削除して、インストールしたらいい。 npm uninstall -g generator-jhipster npm install -g generator-jhipster *** 新しいディレクトリを作成してそこに行く [#p919b41c] mkdir myApp && cd myApp *** JHipsterを実行して画面の指示に従います [#zb5a9989] ここで、 https://cmder.net/ または、PowerShell をつかわないと、windowsでは、正しくインタラクティブしてくれない。 jhipster ここでwindows10ではエラーがでる。ps1ファイルが実行できないように設定されているからだ。 PowerShell Get-ExecutionPolicy で確認 PowerShell Set-ExecutionPolicy RemoteSigned すると、下記のような質問がでてくる。 ? Which *type* of application would you like to create? > Monolithic application (recommended for simple projects) Microservice application Microservice gateway JHipster UAA server (for microservice OAuth2 authentication) これは、yoemanを使っているためだ (あと、だれか、このしょっぱなの、英語の質問メニュー、日本語対応してくれたらうれしいです。お願いします。) 成功すると、次のメッセージが表示されるだろう。 Server application generated successfully. Run your Spring Boot application: ./mvnw (mvnw if using Windows Command Prompt) Client application generated successfully. Start your Webpack development server with: npm start > my-app@0.0.0 cleanup C:\jhip\myApp > rimraf target/classes/static/ target/classes/aot INFO! Congratulations, JHipster execution is complete! しまった、デフォルト設定だと、gradleではなく、mavenをつかうようになっていた。 それに、vue.jsは、選択肢にはなかった。 もう一回、やってみる。次は、vue.jsはJHIPSTER5で登場したブループリントが インストールされてなくてはならないので、次のコマンドで、ブループリント使えるようにする。 npm i -g generator-jhipster-vuejs そんでもって、下記のコマンドでためしてみる。 jhipster --blueprint vuejs 今度は、gradle使うようにした、フロントエンドは、vueしか選べないようになっていた。 ここで、gitに登録しておこう。後で、エンティティにフィールド追加しようとか、 いろいろ、こまごま変更しようとして、やらかしたときに、復活できるようにしておこう。 git init git add . --all git commit -m 'first commit' とかでいいだろうな。 さてと、ここで、サーバを ./gradlew で起動させて、 フロントエンドを npm start で起動させると、ホーム画面が生成された。 すごい量のコードがビルドされていく、自前で、組んでいたら、2か月ぐらいの作業量だろうか。 で、さっきのコマンドラインでの、インタラクティブな、英語攻めの設定は、 .yo-rc.json というファイルにまとめられているという。 これだけをコピーして、もう一回、myAppフォルダをごっそりして、この.yo-rc.jsonファイルだけあれば、復元できるか実験してみる。 やってみたこと .yo-rc.jsonをバックアップしておく myAppフォルダを空っぽにする .yo-rc.jsonファイルだけ戻す jhipster --blueprint vuejs さあ、これで、質問攻めにあわなくてすむだろう。。。。 *** JDL Studioを使用してエンティティをモデル化 [#te3b447b] サンプルサイト https://github.com/jhipster/jdl-samples サンプルとして、下記のサイトのコードを https://www.jhipster.tech/jdl-studio/ jhipster-jdl.jh として、ダウンロードしてください。 *** であなたのエンティティを生成する [#u0525727] jhipster import-jdl jhipster-jdl.jh ** 自動生成されたサンプル [#e9e2322b] *** 自動生成されたAngularサンプル [#f7eb3204] https://github.com/jhipster/jhipster-sample-app *** 自動生成されたReactサンプル [#pc8c4f52] https://github.com/jhipster/jhipster-sample-app-react *** 自動生成されたVueサンプル [#r2a85d6d] https://github.com/jhipster/jhipster-sample-app-vuejs *** 自動生成されたKotlinサンプル [#ra738fee] https://github.com/jhipster/jhipster-sample-app-kotlin *** 自動生成された.NETサンプル [#k52f1bb7] https://github.com/jhipster/jhipster-net-sample-app-template ** Windowsにいれるには [#m16edda8] 公式ドキュメントには、書いてないところを書き足してみます。 まあ、公式にWindowsでの、入れ方が書いてないということは、ねぇ。Macユーザがつくってるんでしょうね。 *** gradle つかいたいよね [#s607f8cf] https://github.com/gradle/gradle-completion *** sdkmanいるかわかんないけど、いれとく [#k68077f2] https://sdkman.io/install *** でもそのまえに、gowいれないと、zipコマンドとかつかえないよ。 [#x0a89bd3] https://github.com/bmatzelle/gow/releases ** ひさしぶりに、JHIPSTERやってみる。 [#hb550fd4] VUEも対応するように、なってる。時代の波に乗っていこうとするツールの開発者が感じられる。 気に入ったよ。おれも、ついていこう。 というわけで、インストールしてみる。ちなみに、いまこの記事を書いているバージョンは、6.1.2が最新だ。 進化がはやい。 さて、どこから、手をつけよう。ちょっと、どんなさいとがあるのかしらべてみた。 * JHIPSTERから、VUEプロジェクトを生成する方法を紹介しているサイト [#y9ae231e] ** ブラウザ上で使いながら、学べそうなサイト [#f95d742c] https://www.jhipster.tech/using-vue/ ** JHipster-vuejs [#e02fe8c4] https://github.com/jhipster/jhipster-vuejs 簡単な手順が書いてある、概念的な説明は乏しい感じがする。 ** Using Vue [#kff7387c] 本家サイトの紹介ページ 一番信頼できると思う。 ** Creating a modern Web app using Vue.js and Spring Boot with JHipster [#tf8557cf] わかりやすそうな、サイト https://blog.ippon.tech/creating-a-modern-web-app-using-vuejs-and-spring-boot-with-jhipster/ ** generator-jhipster-vuejs [#ofa3f8d8] npmのプロジェクト https://www.npmjs.com/package/generator-jhipster-vuejs ** インド人が、英語でしゃべっている、解説動画 [#sda0c4d9] https://www.youtube.com/watch?v=Cbtdvp6e36Q ナマステ、よくわからないが、BGMがわりに、聞いておこう。 上記の、わかりやすそうな、解説サイトを、Googleで翻訳したのを手直して貼ってみる。 * Vue.jsとSpring Bootを使用してJHipsterで最新のWebアプリケーションを作成する [#y87a822b] *** 訳者注 [#x15eab19] 以下の記事は、テオレブランさんが、 2019年2月21日 に、 https://blog.ippon.tech/creating-a-modern-web-app-using-vuejs-and-spring-boot-with-jhipster/ で紹介した記事の、英語が苦手な人が、翻訳してみたバージョンです。 画像を張るのは、このブログの仕組みでは大変なため、、元の英語のほうの記事をみてくださいね。 ** 初めに [#rd0eb5d5] Vue.jsはJavascriptフロントエンドの世界における新しいトレンドフレームワークであり、そのシンプルさによってWebアプリケーションをかなり速く構築することができます。 Vue.jsアプリケーションの構造は、ページを構築するためにコンポーネントとテンプレートを使用するという点でAngularアプリケーションと非常によく似ています。このビデオ *** vue.js [#h2988cd2] https://www.vuemastery.com/courses/intro-to-vue-js/vue-instance/ は、特にAngularまたはReactを使用したことがない場合にVue.jsを使い始めるための優れた入門書です。 これは現在人気のあるフレームワークのサイズ比較(縮小)です(詳細はこちら)。 https://gist.github.com/Restuta/cda69e50a853aa64912d | Name | Size | | ------------------------ | ----- | | Angular 2 | 566K | | Ember 2.2.0 | 435K | | React 0.14.5 + React DOM | 133K | | React 16.2.0 + React DOM | 97K | | Vue 2.4.2 | 58K | | Inferno 1.2.2 | 48K | | Preact 7.2.0 | 16K | 前にも述べたように、Vue.jsのシンプルさは非常に軽量で他のライブラリや既存のプロジェクトとの統合を容易にします。 一方、Vue.jsは適切なツールを使用して堅牢なシングルページアプリケーションを構築することができ、JHipsterはそれに最適です。 ** JHipster の チュートリアル動画 [#ecb98c3c] JHipsterに慣れていないのであれば、このビデオ https://www.youtube.com/watch?v=-VQ_SVkaXbs を見て、JHipsterで何ができるか、英語ですが、インストールから、わかりやすく解説されています。 (やはりmacユーザですね。) * JHipsterブループリントを使ったVue.js [#jec57dd3] https://www.jhipster.tech/modules/creating-a-blueprint/ デフォルトでは、JHipsterはフロントエンドフレームワークに対してAngularかReactのどちらかを選択するように求めます。青写真の概念はJHipsterバージョン5で導入されました、そして、目標はあなたがあなた自身のサブジェネレータを使わせることによってJHipsterの機能性を拡張することです。ブループリントを作成して使用する方法に関する詳細情報は、ドキュメント https://www.jhipster.tech/modules/creating-a-blueprint/ にあります。 ** インストール [#dd84ee75] フロントエンドの生成には、公式のVue.jsブループリントが使用されています。ブループリントリポジトリ https://github.com/jhipster/jhipster-vuejs のインストール手順に従うことができます。私がこのブログ記事を書いた時点でブループリントはまだ開発中だったので、あなたはいくつかの問題に遭遇するかもしれません。あなたが部分が間違った方法でされたと思うならば、それらを報告して、プル要求を提出してください。 ** アプリケーション生成 [#cd758235] まず新しいフォルダを作成し、vuejsブループリントを付けてJHipsterを実行しましょう。 mkdir vuejs-app cd vuejs-app jhipster --blueprint vuejs 質問ごとにデフォルトの回答を選択できます。ブループリントが正しくインストールされていれば、次のメッセージが表示されます。 Using blueprint generator-jhipster-vuejs for client subgenerator ? Which *Framework* would you like to use for the client? (Use arrow keys) > Vue.js この.yo-rc.jsonは、この記事で参照したのと同じアプリケーションを生成したい場合に使用できます。ファイルはアプリケーションディレクトリに置かれ、それから実行jhipster -d --blueprint vuejsすることはどんな質問もせずにアプリケーションを生成するでしょう。 ** エンティティ生成 [#icd656d9] アプリケーションを起動する前に、3つのエンティティを含む単純なJDLを使用していくつかのエンティティを生成しましょう。このコンテンツを含むentities.jdlアプリケーションのルートフォルダに名前の付いたファイルを作成するだけです。次に、Vue.jsブループリントを使用してコマンドを実行してエンティティを生成します。jhipster import-jdl entities.jdl ./mvnwコマンドを実行してアプリケーションを起動し、http:// localhost:8080 /#/にアクセスして、すべてが正常に機能していることを確認できます。ログインすると、「エンティティ」メニューには以下の3つのエンティティが表示されます。 ** Vue.js構造の詳細について [#p851f021] Vue.jsアプリケーション全体を含むフォルダはsrc/main/webapp/appであり、構造はAngularと非常によく似ています。npm startコードを変更したときにライブコンパイル/リロードの利点を享受するために、端末でコマンドを実行することをお勧めします。AngularやReactと同様に、webpackはTypeScriptコードをJavaScriptにコンパイルしてアプリケーションをパッケージ化するために使用されます。 ** 設定 [#sb54a3a7] *** コア [#pace90cd] Vueのインスタンスは、ファイル内に作成されたsrc/main/webapp/app/main.ts、と私は見てお勧めsrc/main/webapp/app/shared/config/config.tsにも。 どちらのファイルも複数のものを構成します。 - 国際化 - ルーター - Vuex(アプリケーションの状態を保存するために使用されます) - サービス(カスタムサービスを追加する必要があります。それらを挿入することができます) ** 国際化 [#fb266add] Vue.jsアプリケーションはすでにさまざまな言語で動作するように設定されており、翻訳を含むフォルダはにありますsrc/main/webapp/i18n。この方法$t()は、ユーザーの言語に基づいてテキストを表示するために使用できます。 テンプレート内: <h1 class="display-4" v-text="$t('home.title')">Welcome, Java Hipster!</h1> コンポーネント内(名前パラメータを使用できます) // "A Operation is updated with identifier {{ param }}" const message = this.$t('blogpostApp.operation.updated', { param: param.id }); ** ルート [#gbf04913] Reactと同様に、すべてのルートは1つのファイルに集中化されていますsrc/main/webapp/app/router/index.ts。JHipsterは自動的にエンティティのルートを生成します。 カスタムルートはコメントの後に追加する必要が// jhipster-needle-add-entity-to-router - JHipster will add entities to the router hereあります。これにより、他のエンティティが生成されたときに問題が発生しないようにします。 このフィールドmetaはユーザーの権限をチェックするために使用され、他の変数を渡すために使用することができます。 // This route will only allow users with the "ROLE_ADMIN" authority { path: '/admin/user-management', name: 'JhiUser', component: JhiUserManagementComponent, meta: { authorities: ['ROLE_ADMIN'] } } ** エンティティページ [#s8dddd30] *** 構造 [#e13f35d4] フォルダsrc/main/webapp/app/shared/modelにはAngularのモデルなどが含まれています。.vueアプリケーションの「ページ」ごとにテンプレートに関連付けられたコンポーネントがあります。 新しいページを作成するときはカスタムサービス/コンポーネント/テンプレートを作成することをお勧めします。そのため、エンティティを再生成するときに競合を解決する必要はありません。 ** 検証 [#x868a833] 検証はvuelidateライブラリを使って行われ、使い方は簡単です。エンティティOperationは、カスタム検証がvuelidateを使用してどのように行われるかを理解するための良い例です。OperationUpdateあなたは以下を参照することができ、コンポーネントは検証オプションが含まれています。 const validations: any = { operation: { date: { required }, description: {}, amount: { required, numeric } } }; @Component({ validations }) export default class OperationUpdate extends Vue { ... } このファイルoperation-update.vueは検証ルールを使用してカスタム検証メッセージを表示/非表示にします。 <input type="number" class="form-control" name="amount" id="operation-amount" :class="{'valid': !$v.operation.amount.$invalid, 'invalid': $v.operation.amount.$invalid }" v-model="$v.operation.amount.$model" required/> <div v-if="$v.operation.amount.$anyDirty && $v.operation.amount.$invalid"> <small class="form-text text-danger" v-if="!$v.operation.amount.required" v-text="$t('entity.validation.required')"> This field is required. </small> <small class="form-text text-danger" v-if="!$v.operation.amount.number" v-text="$t('entity.validation.number')"> This field should be a number. </small> </div> 重要なオブジェクトは$ vです。これは検証されたフィールドのステータスを取得するために使用できます。 * 結論 [#k4f59b8b] Vue.jsはスムーズな学習曲線を持ち、生産的になるのに必要な時間は非常に短いです。それはAngular / Reactの優れた代替手段であり、それらのフレームワークの経験があると役立ちます。他のフレームワークページとの比較は、Vue.jsがアプリケーションに適しているかどうかを判断するのに役立ちます。 JHipsterは、最新のWebアプリケーションを完成させるために必要なものすべてを提供し、ごく短時間で運用に移すことができます。それに加えて、バックエンドはSpring Bootによる高性能で堅牢なJavaスタックとして構築されています。
spamではない場合はチェックをいれてください。
タイムスタンプを変更しない
[[JHIPSTER一覧]] *目次 [#zc4d56ef] #contents [[JHIPSTER JDL]] * JHIPSTERとは、 [#v6981c80] spring bootのscaffoldをするツールです。vueとはangularとか選べます。 内部でyoemanをつかって、生成しているのですが、 その時に使うコマンドラインは、cmd.exeやgit for windowsや、cygwinではだめです。 https://cmder.net/ をつかってください。(日本語のファイル名、表示できるけど、カーソル移動がまだ、だめなので、ファイル名はアルファベットでやりましょう。PowerShellためしてみるか) yoemanの公式ページで、しっかりと、指定されてました。 cmdは、yoemanのインタラクティブなやりとりで、文字化けや色が適切に表示されません。 git for windows や cygwinでは、矢印キーでの選択ができないのです。 というか、microsoftは、このcmderを、windowsのデフォルトのターミナルにすべきです。 ** 本家 [#na91159e] https://www.jhipster.tech/ ** 書籍 [#eed9fd46] *** THE JHIPSTER MINI-BOOK [#aaa6aedc] https://corneliu.cl/docs/jHipster-5.pdf *** Full Stack Development with JHipster [#q3720804] https://www.oreilly.com/library/view/full-stack-development/9781788476317/ ** JHIPSTERの目標 [#b59e03d0] - 完全で最新のWebアプリケーションまたはマイクロサービスアーキテクチャをあなたに代わって生成することです。 - Spring Bootによるサーバーサイドの高性能で堅牢なJavaスタック - Angular、React、Bootstrapを搭載した、洗練されたモダンでモバイル初のフロントエンド - JHipster Registry、Netflix OSS、Elastic StackおよびDockerを使用した堅牢なマイクロサービスアーキテクチャ - Yeoman、Webpack、Maven / Gradleを使ってアプリケーションを構築するための強力なワークフロー ** ためしてみる [#q8a2659e] JHipster Quick Start の訳です。 *** 試してみた結果の結論 [#a5432428] 試してみた結果、2019/08/01の時点では、追加機能の面からいうと、下記のサイトを みるかぎり、JHIPSTER6よりも、JHIPSTER5のほうが、充実しているし、機能を追加しやすくする、jhipster-moduleは、jhipster6に、対応できていない。(hipsterでは、getConfigに置き換わっている)。まあ、そのうちなおるとおもう。 https://www.jhipster.tech/modules/marketplace/#/list ちょっと、枯れた技術のJHIPSTER5を選択するのが、いろいろ、なやまされなくていいかもしれない。 JHIPSTER6からは、jhipster-moduleのかわりに、bule-printという機能が、主力になってくるのだろう。今は、過渡期なので、対応してる機能がすくないだけなんだと思う。 以下は、そんなことも、しらずに、インストールしていったときに、書いた文章になります。 *** JHipsterをインストールする [#ee94119c] npm install -g generator-jhipster バージョンを指定してインストールすることもできるから、もし、変なバグがはいっているバージョンが最新だったら、それで回避しよう。 *** JHipsterをアップデートする [#x04a9249] 一旦削除して、インストールしたらいい。 npm uninstall -g generator-jhipster npm install -g generator-jhipster *** 新しいディレクトリを作成してそこに行く [#p919b41c] mkdir myApp && cd myApp *** JHipsterを実行して画面の指示に従います [#zb5a9989] ここで、 https://cmder.net/ または、PowerShell をつかわないと、windowsでは、正しくインタラクティブしてくれない。 jhipster ここでwindows10ではエラーがでる。ps1ファイルが実行できないように設定されているからだ。 PowerShell Get-ExecutionPolicy で確認 PowerShell Set-ExecutionPolicy RemoteSigned すると、下記のような質問がでてくる。 ? Which *type* of application would you like to create? > Monolithic application (recommended for simple projects) Microservice application Microservice gateway JHipster UAA server (for microservice OAuth2 authentication) これは、yoemanを使っているためだ (あと、だれか、このしょっぱなの、英語の質問メニュー、日本語対応してくれたらうれしいです。お願いします。) 成功すると、次のメッセージが表示されるだろう。 Server application generated successfully. Run your Spring Boot application: ./mvnw (mvnw if using Windows Command Prompt) Client application generated successfully. Start your Webpack development server with: npm start > my-app@0.0.0 cleanup C:\jhip\myApp > rimraf target/classes/static/ target/classes/aot INFO! Congratulations, JHipster execution is complete! しまった、デフォルト設定だと、gradleではなく、mavenをつかうようになっていた。 それに、vue.jsは、選択肢にはなかった。 もう一回、やってみる。次は、vue.jsはJHIPSTER5で登場したブループリントが インストールされてなくてはならないので、次のコマンドで、ブループリント使えるようにする。 npm i -g generator-jhipster-vuejs そんでもって、下記のコマンドでためしてみる。 jhipster --blueprint vuejs 今度は、gradle使うようにした、フロントエンドは、vueしか選べないようになっていた。 ここで、gitに登録しておこう。後で、エンティティにフィールド追加しようとか、 いろいろ、こまごま変更しようとして、やらかしたときに、復活できるようにしておこう。 git init git add . --all git commit -m 'first commit' とかでいいだろうな。 さてと、ここで、サーバを ./gradlew で起動させて、 フロントエンドを npm start で起動させると、ホーム画面が生成された。 すごい量のコードがビルドされていく、自前で、組んでいたら、2か月ぐらいの作業量だろうか。 で、さっきのコマンドラインでの、インタラクティブな、英語攻めの設定は、 .yo-rc.json というファイルにまとめられているという。 これだけをコピーして、もう一回、myAppフォルダをごっそりして、この.yo-rc.jsonファイルだけあれば、復元できるか実験してみる。 やってみたこと .yo-rc.jsonをバックアップしておく myAppフォルダを空っぽにする .yo-rc.jsonファイルだけ戻す jhipster --blueprint vuejs さあ、これで、質問攻めにあわなくてすむだろう。。。。 *** JDL Studioを使用してエンティティをモデル化 [#te3b447b] サンプルサイト https://github.com/jhipster/jdl-samples サンプルとして、下記のサイトのコードを https://www.jhipster.tech/jdl-studio/ jhipster-jdl.jh として、ダウンロードしてください。 *** であなたのエンティティを生成する [#u0525727] jhipster import-jdl jhipster-jdl.jh ** 自動生成されたサンプル [#e9e2322b] *** 自動生成されたAngularサンプル [#f7eb3204] https://github.com/jhipster/jhipster-sample-app *** 自動生成されたReactサンプル [#pc8c4f52] https://github.com/jhipster/jhipster-sample-app-react *** 自動生成されたVueサンプル [#r2a85d6d] https://github.com/jhipster/jhipster-sample-app-vuejs *** 自動生成されたKotlinサンプル [#ra738fee] https://github.com/jhipster/jhipster-sample-app-kotlin *** 自動生成された.NETサンプル [#k52f1bb7] https://github.com/jhipster/jhipster-net-sample-app-template ** Windowsにいれるには [#m16edda8] 公式ドキュメントには、書いてないところを書き足してみます。 まあ、公式にWindowsでの、入れ方が書いてないということは、ねぇ。Macユーザがつくってるんでしょうね。 *** gradle つかいたいよね [#s607f8cf] https://github.com/gradle/gradle-completion *** sdkmanいるかわかんないけど、いれとく [#k68077f2] https://sdkman.io/install *** でもそのまえに、gowいれないと、zipコマンドとかつかえないよ。 [#x0a89bd3] https://github.com/bmatzelle/gow/releases ** ひさしぶりに、JHIPSTERやってみる。 [#hb550fd4] VUEも対応するように、なってる。時代の波に乗っていこうとするツールの開発者が感じられる。 気に入ったよ。おれも、ついていこう。 というわけで、インストールしてみる。ちなみに、いまこの記事を書いているバージョンは、6.1.2が最新だ。 進化がはやい。 さて、どこから、手をつけよう。ちょっと、どんなさいとがあるのかしらべてみた。 * JHIPSTERから、VUEプロジェクトを生成する方法を紹介しているサイト [#y9ae231e] ** ブラウザ上で使いながら、学べそうなサイト [#f95d742c] https://www.jhipster.tech/using-vue/ ** JHipster-vuejs [#e02fe8c4] https://github.com/jhipster/jhipster-vuejs 簡単な手順が書いてある、概念的な説明は乏しい感じがする。 ** Using Vue [#kff7387c] 本家サイトの紹介ページ 一番信頼できると思う。 ** Creating a modern Web app using Vue.js and Spring Boot with JHipster [#tf8557cf] わかりやすそうな、サイト https://blog.ippon.tech/creating-a-modern-web-app-using-vuejs-and-spring-boot-with-jhipster/ ** generator-jhipster-vuejs [#ofa3f8d8] npmのプロジェクト https://www.npmjs.com/package/generator-jhipster-vuejs ** インド人が、英語でしゃべっている、解説動画 [#sda0c4d9] https://www.youtube.com/watch?v=Cbtdvp6e36Q ナマステ、よくわからないが、BGMがわりに、聞いておこう。 上記の、わかりやすそうな、解説サイトを、Googleで翻訳したのを手直して貼ってみる。 * Vue.jsとSpring Bootを使用してJHipsterで最新のWebアプリケーションを作成する [#y87a822b] *** 訳者注 [#x15eab19] 以下の記事は、テオレブランさんが、 2019年2月21日 に、 https://blog.ippon.tech/creating-a-modern-web-app-using-vuejs-and-spring-boot-with-jhipster/ で紹介した記事の、英語が苦手な人が、翻訳してみたバージョンです。 画像を張るのは、このブログの仕組みでは大変なため、、元の英語のほうの記事をみてくださいね。 ** 初めに [#rd0eb5d5] Vue.jsはJavascriptフロントエンドの世界における新しいトレンドフレームワークであり、そのシンプルさによってWebアプリケーションをかなり速く構築することができます。 Vue.jsアプリケーションの構造は、ページを構築するためにコンポーネントとテンプレートを使用するという点でAngularアプリケーションと非常によく似ています。このビデオ *** vue.js [#h2988cd2] https://www.vuemastery.com/courses/intro-to-vue-js/vue-instance/ は、特にAngularまたはReactを使用したことがない場合にVue.jsを使い始めるための優れた入門書です。 これは現在人気のあるフレームワークのサイズ比較(縮小)です(詳細はこちら)。 https://gist.github.com/Restuta/cda69e50a853aa64912d | Name | Size | | ------------------------ | ----- | | Angular 2 | 566K | | Ember 2.2.0 | 435K | | React 0.14.5 + React DOM | 133K | | React 16.2.0 + React DOM | 97K | | Vue 2.4.2 | 58K | | Inferno 1.2.2 | 48K | | Preact 7.2.0 | 16K | 前にも述べたように、Vue.jsのシンプルさは非常に軽量で他のライブラリや既存のプロジェクトとの統合を容易にします。 一方、Vue.jsは適切なツールを使用して堅牢なシングルページアプリケーションを構築することができ、JHipsterはそれに最適です。 ** JHipster の チュートリアル動画 [#ecb98c3c] JHipsterに慣れていないのであれば、このビデオ https://www.youtube.com/watch?v=-VQ_SVkaXbs を見て、JHipsterで何ができるか、英語ですが、インストールから、わかりやすく解説されています。 (やはりmacユーザですね。) * JHipsterブループリントを使ったVue.js [#jec57dd3] https://www.jhipster.tech/modules/creating-a-blueprint/ デフォルトでは、JHipsterはフロントエンドフレームワークに対してAngularかReactのどちらかを選択するように求めます。青写真の概念はJHipsterバージョン5で導入されました、そして、目標はあなたがあなた自身のサブジェネレータを使わせることによってJHipsterの機能性を拡張することです。ブループリントを作成して使用する方法に関する詳細情報は、ドキュメント https://www.jhipster.tech/modules/creating-a-blueprint/ にあります。 ** インストール [#dd84ee75] フロントエンドの生成には、公式のVue.jsブループリントが使用されています。ブループリントリポジトリ https://github.com/jhipster/jhipster-vuejs のインストール手順に従うことができます。私がこのブログ記事を書いた時点でブループリントはまだ開発中だったので、あなたはいくつかの問題に遭遇するかもしれません。あなたが部分が間違った方法でされたと思うならば、それらを報告して、プル要求を提出してください。 ** アプリケーション生成 [#cd758235] まず新しいフォルダを作成し、vuejsブループリントを付けてJHipsterを実行しましょう。 mkdir vuejs-app cd vuejs-app jhipster --blueprint vuejs 質問ごとにデフォルトの回答を選択できます。ブループリントが正しくインストールされていれば、次のメッセージが表示されます。 Using blueprint generator-jhipster-vuejs for client subgenerator ? Which *Framework* would you like to use for the client? (Use arrow keys) > Vue.js この.yo-rc.jsonは、この記事で参照したのと同じアプリケーションを生成したい場合に使用できます。ファイルはアプリケーションディレクトリに置かれ、それから実行jhipster -d --blueprint vuejsすることはどんな質問もせずにアプリケーションを生成するでしょう。 ** エンティティ生成 [#icd656d9] アプリケーションを起動する前に、3つのエンティティを含む単純なJDLを使用していくつかのエンティティを生成しましょう。このコンテンツを含むentities.jdlアプリケーションのルートフォルダに名前の付いたファイルを作成するだけです。次に、Vue.jsブループリントを使用してコマンドを実行してエンティティを生成します。jhipster import-jdl entities.jdl ./mvnwコマンドを実行してアプリケーションを起動し、http:// localhost:8080 /#/にアクセスして、すべてが正常に機能していることを確認できます。ログインすると、「エンティティ」メニューには以下の3つのエンティティが表示されます。 ** Vue.js構造の詳細について [#p851f021] Vue.jsアプリケーション全体を含むフォルダはsrc/main/webapp/appであり、構造はAngularと非常によく似ています。npm startコードを変更したときにライブコンパイル/リロードの利点を享受するために、端末でコマンドを実行することをお勧めします。AngularやReactと同様に、webpackはTypeScriptコードをJavaScriptにコンパイルしてアプリケーションをパッケージ化するために使用されます。 ** 設定 [#sb54a3a7] *** コア [#pace90cd] Vueのインスタンスは、ファイル内に作成されたsrc/main/webapp/app/main.ts、と私は見てお勧めsrc/main/webapp/app/shared/config/config.tsにも。 どちらのファイルも複数のものを構成します。 - 国際化 - ルーター - Vuex(アプリケーションの状態を保存するために使用されます) - サービス(カスタムサービスを追加する必要があります。それらを挿入することができます) ** 国際化 [#fb266add] Vue.jsアプリケーションはすでにさまざまな言語で動作するように設定されており、翻訳を含むフォルダはにありますsrc/main/webapp/i18n。この方法$t()は、ユーザーの言語に基づいてテキストを表示するために使用できます。 テンプレート内: <h1 class="display-4" v-text="$t('home.title')">Welcome, Java Hipster!</h1> コンポーネント内(名前パラメータを使用できます) // "A Operation is updated with identifier {{ param }}" const message = this.$t('blogpostApp.operation.updated', { param: param.id }); ** ルート [#gbf04913] Reactと同様に、すべてのルートは1つのファイルに集中化されていますsrc/main/webapp/app/router/index.ts。JHipsterは自動的にエンティティのルートを生成します。 カスタムルートはコメントの後に追加する必要が// jhipster-needle-add-entity-to-router - JHipster will add entities to the router hereあります。これにより、他のエンティティが生成されたときに問題が発生しないようにします。 このフィールドmetaはユーザーの権限をチェックするために使用され、他の変数を渡すために使用することができます。 // This route will only allow users with the "ROLE_ADMIN" authority { path: '/admin/user-management', name: 'JhiUser', component: JhiUserManagementComponent, meta: { authorities: ['ROLE_ADMIN'] } } ** エンティティページ [#s8dddd30] *** 構造 [#e13f35d4] フォルダsrc/main/webapp/app/shared/modelにはAngularのモデルなどが含まれています。.vueアプリケーションの「ページ」ごとにテンプレートに関連付けられたコンポーネントがあります。 新しいページを作成するときはカスタムサービス/コンポーネント/テンプレートを作成することをお勧めします。そのため、エンティティを再生成するときに競合を解決する必要はありません。 ** 検証 [#x868a833] 検証はvuelidateライブラリを使って行われ、使い方は簡単です。エンティティOperationは、カスタム検証がvuelidateを使用してどのように行われるかを理解するための良い例です。OperationUpdateあなたは以下を参照することができ、コンポーネントは検証オプションが含まれています。 const validations: any = { operation: { date: { required }, description: {}, amount: { required, numeric } } }; @Component({ validations }) export default class OperationUpdate extends Vue { ... } このファイルoperation-update.vueは検証ルールを使用してカスタム検証メッセージを表示/非表示にします。 <input type="number" class="form-control" name="amount" id="operation-amount" :class="{'valid': !$v.operation.amount.$invalid, 'invalid': $v.operation.amount.$invalid }" v-model="$v.operation.amount.$model" required/> <div v-if="$v.operation.amount.$anyDirty && $v.operation.amount.$invalid"> <small class="form-text text-danger" v-if="!$v.operation.amount.required" v-text="$t('entity.validation.required')"> This field is required. </small> <small class="form-text text-danger" v-if="!$v.operation.amount.number" v-text="$t('entity.validation.number')"> This field should be a number. </small> </div> 重要なオブジェクトは$ vです。これは検証されたフィールドのステータスを取得するために使用できます。 * 結論 [#k4f59b8b] Vue.jsはスムーズな学習曲線を持ち、生産的になるのに必要な時間は非常に短いです。それはAngular / Reactの優れた代替手段であり、それらのフレームワークの経験があると役立ちます。他のフレームワークページとの比較は、Vue.jsがアプリケーションに適しているかどうかを判断するのに役立ちます。 JHipsterは、最新のWebアプリケーションを完成させるために必要なものすべてを提供し、ごく短時間で運用に移すことができます。それに加えて、バックエンドはSpring Bootによる高性能で堅牢なJavaスタックとして構築されています。
テキスト整形のルールを表示する