Challenge Java EE !

Java EEを中心に趣味や仕事における開発メモを書いています。

Javaで脳内メーカーみたいなサービスを作ってみた

先日、久しぶりに「脳内メーカー」を試したときに

「同じ名前を入れると結果が同じだけど、どういう仕組みなんだろう?」
「どうやって画像を作っているんだろう?」

と内部的なところに興味がでて、自分も似たようなWebアプリを作ってみたいなぁと考えるようになりました。Javaを使って自分だったらどう実装するか考えたり調べたりしながら、ここ1ヶ月コツコツとプログラミングしてました。

まだ細かいエラー処理などの実装が必要ですが、とりあえず乃木坂46 21枚目の選抜発表に合わせて7/1にリリースしました。

www.rpgparty.sakamichi46.com

トップページはこんな感じで、ゲーム感を出してみました。

f:id:kikutaro777:20180702233924g:plain

メッセージがピコピコ流れていますが、これは iTyped.js というJavaScriptライブラリを使って、タイプライター風に表示しています。

フォントは PixelMplus(ピクセル・エムプラス)を使いました。漢字まで含まれていて素晴らしすぎる…。ライセンスの自由度も素晴らしすぎる…。
itouhiro.hatenablog.com

アプリの内容は脳内メーカーと同じです。名前を入れたらランダムで乃木坂メンバーをピックアップしてRPGパーティを組むというもの。完全なランダムではなく、名前の文字が同じであれば同じパーティとなります。

f:id:kikutaro777:20180703005804p:plain

「キクタロー」の結果はこちらです。

f:id:kikutaro777:20180702233359j:plain

豪華すぎる結果になってますが、開発者が有利になるような仕組みは入っておりませんのであしからず(^^;

ちなみにドット絵も頑張って作りました(^^;dotpictというアプリが素晴らしくて、スマホで簡単にドット絵を作れるので、外にいるときでも空き時間とかに作っていました。

dotpicko.net

以下のサイトでベースを作って、あとは乃木坂の制服や衣装にあわせた感じです。

ちびキャラを描いてみよう編【現役ゲームクリエイターによるドット基礎講座 第2回】 - Creatures Garage

「Peing - 質問箱 -」なども大流行りですが、あれはツイートしたときに表示されるカード画像が目立つことが人気の一端になっていると思っています。なので、自分もああいう仕組みも入れたいなと思いました。画像はJavaのGraphicを使って生成しているのですが、最初はそれをbase64にしてhtml表示していました。ただ、これだとTwitter Cardで表示されないという…。どうやら静的なURLが必要なようです。(この辺? 詳しい方いたら教えて欲しい…)

AWSのS3とか使って画像を保存させるしかないのか…と思っていたのですが、調べてみたら Cloudinary という画像・ビデオのアップロード&加工が簡単にできるサービスがありました。試したら便利だったので今はこれを利用しています。

cloudinary.com

Freeプランでもかなり使えます。
f:id:kikutaro777:20180703004342p:plain

これで以下のような形でTwitter Cardがしっかり表示できるようになりました。この辺は実装してみないとわからないものですね。

Webのフロントhtmlは Netlify に置いて、パーティや画像の生成をするサーバサイドは Heroku を使っています。Webフレームワークは Spring Boot + Thymeleaf です。

乃木坂ファンをターゲットに作っていますが、乃木坂46をあまり知らない方も是非お試し欲しいなと思います。そして出て来たメンバーを是非知ってもらえると嬉しいです><;需要があれば、欅坂46、けやき坂46(ひらがなけやき)にも対応します!

IBM Cloud ライト・アカウント&Java EEアプリのデプロイ #IBMCloud #jjug_ccc

先日参加したJJUG CCCのブースLTで「IBM Cloudライト・アカウント」の存在を知りました。その後、ブースに行って @Santea3173 さん とお話して興味が湧いたので早速試してみました。

IBM Cloud ライト・アカウント

クレカ登録なしで無期限に利用できる&IBM Websphere Liberty Profileが動く、ということでJava EE(Jakarta EE)のサンプルを試すのに良さそうなクラウド環境です。

アカウントの作成は簡単です。手順が気になる方は以下を参考にしてください。
https://qiita.com/ayatokura/items/42d4bc728112c733c80d

ライト・アカウントに関する概要を知りたい方は以下がおススメです。
www.project-respite.com

Java EEアプリのデプロイ

アカウントを取得してログインするとDashboardが表示されるので「リソースの作成」を押します。
f:id:kikutaro777:20180602130524p:plain

今回はJava EEアプリを試すため「Liberty for Java」を選びました。その他の言語含めてライト・アカウントでも色々遊べそうです。
f:id:kikutaro777:20180602130650p:plain

アプリ名やホスト名を入れます。
f:id:kikutaro777:20180602141841p:plain

中はCloud Foundryが動いているので、Cloud Foundry CLIで簡単にデプロイなどができます。

自分の環境の話ですが、前にPivotal Web Servicesを触っていたので、接続先はPivotalになっていました。まずはIBM Cloudへ切り替えました。

cf api https://api.ng.bluemix.net

ログインします。

cf login

Java EEアプリはとりあえず超簡単なJSFページを作って試しました。ドキュメントをみるとmanifest.ymlが必要そうにみえましたが、なくても動きました。
github.com

なお、これを実装したときは手元のPayaraで動作確認をしてました。で、Websphereで確認することなく、そのままwarをIBM Cloudへデプロイしました。

cf push kikutaroibmcloudsample -p target\IbmCloudLightSample-0.0.1.war

f:id:kikutaro777:20180602133158p:plain

デプロイ後、アクセスすると以下のページが表示されます。
f:id:kikutaro777:20180602141925p:plain

名前を入れると、呼び返してくれる簡単なWebアプリですが、以下のようにちゃんと動きました。かなりお手軽ですね。
f:id:kikutaro777:20180602141928p:plain

管理Beanについて

ちなみに、最初は管理BeanをCDI(@Named)で作っていたのですが、実行時に以下のエラーとなりました。CDI管理Beanが認識されていないようにみえます。Payaraでは問題なかったので、何か設定が必要なのかも?

f:id:kikutaro777:20180602142709p:plain

とりあえずJSF管理Bean(@ManagedBean)で実装したら動いたのでソースは@Managedを使ったものとなっています。この辺りについてはどこかで原因を探ります。

ログをみて気付いたのですが、WebsphereのJSF実装はmyfacesなんですね。

org.apache.myfaces.view.facelets.el.ContextAwarePropertyNotFoundException: javax.el.PropertyNotFoundException: Target Unreachable, identifier 'indexBean' resolved to null
	at org.apache.myfaces.view.facelets.el.ContextAwareTagValueExpression.getType(ContextAwareTagValueExpression.java:79)
	at org.apache.myfaces.shared.renderkit._SharedRendererUtils.findUIOutputConverter(_SharedRendererUtils.java:78)
...

JJUG CCC 2018 Springでメールの話をしました #jjug_ccc

昨日5/26に開催された日本Javaユーザグループ(Japan Java User Group:JJUG)主催のCross Community Conferenceに参加しました!

jjug.doorkeeper.jp

今回で2回目となるブーススポンサーに加えて、スポンサー関係なく個人セッション(20分枠)で発表させていただきました。

Java&メールというニッチなテーマにも関わらず、当日多くの方々に参加いただけて嬉しかったです。20分の枠で何をどう伝えるか個人的には苦労した内容だったので、時間をかけて頑張って良かったなと思いました。

受託開発&開発者&Java EEからサービス&サポートエンジニア&SendGridと必要なスキルセットが変わって苦労することも多いですが、立場変われどJJUGイベントを楽しめているのが嬉しいです。

お昼はスポンサーのランチLTで話をしました。他のスポンサーさんのLTをみると、発表がうまかったり、笑いをしっかりとったり、皆さん印象付けがうまい。見習っていきたいです。

今回は基本的にブースにいて、聞いたセッションは1つのみでしたが、色んな方とお話できて楽しかったです(>_<)

懇親会も活気に満ちていました。ワイワイ。今回から登壇者は風船を付ける方式で、1名だけでしたが「セッション聞きました~」と話かけていただけました。

前回も思ったのですが、LINEさんのお寿司、美味しすぎ!!!感謝感謝(>_<)

最後は(初の?)集合写真!

スライドは既に YujiSoftwareさんがまとめられてます。JJUG公式もリポジトリがあるようです。

次回のFallまでに色々準備して、また趣味開発とかで学んだことを話してみたいです。

そういえば5/26は自分の誕生日だったのですが、JJUG CCCで楽しく過ごせてよかったです(^^)お祝いの声おかけも多々いただきましたw

とにかく楽しい1日でした!!!運営スタッフの皆様、本当にありがとうございました。

にほんブログ村 IT技術ブログへ
にほんブログ村 にほんブログ村 IT技術ブログ Javaへ
にほんブログ村