なんかまだ5月なのにめっちゃ暑い...なんだこの暑さは...
本当に5月なのか...?
というわけで3月に作ったwebappをついに2か月経った今デプロイをAIさんのお力添えで成功したので自分の学習の振り返りをしていきたいです。ホンマ暑いでな...
まずダーツアプリといたしましてまランダムでナンバーを出して狙った回数入れるというかなり簡単なものになっています。
renderでデプロイしたのでかなり遅いです。
AWSの方が便利らしいので今後やっていきたいですね。元気があればね
最初の画面のUIです
背景にダーツボードのimageを張り付けて黒、白、赤を基調としたデザインにしました。
ペルソナ5のイメージをモチーフにしました
やはり黒と赤は厨二病心がくすぐられていいですね
最初の説明書きに関してはスポーツはランダム性を持たせて練習したらうまくなりやすいみたいな記事があったのでそのようなことが書いてあります。
ソースは動画にはあったのですがその動画が見当たらないためソースはありません。ホンマごめん..
またダーツをやり過ぎると正確なフォームを忘れてしまう事もあると感じたので右下に公式の投げ方のサイトを配置させていただきました。
このwebサイトのcssとjavascriptすごない?ぬるぬる動くやん
ちなみに何故フルスタック開発なのにjavascriptでサーバーサイドを作らなかったかというと筆者がatcoderをずっとpythonでやっていて、せっかくなら何か作ろうとなってpythonのwebフレームワークのflaskを勉強しました。1からだから大変だったで...
次に2枚目のUIです。
さっきにダーツの画像に1枚目と同じ通り白、赤、黒を基調としたものを作りました。
成功回数のフォームの欄があるのですが、実はまだDB設計が本を読んでも良くわからない状態になってしまい動けていないためただの要らない子になっています...
あとで改善点を述べるのですが、DBを実装して成功率や苦手なナンバーなどを表示できるページを作りたいですね...
次は3枚目です。
このページではベットとナンバーの指定をしています。
まさしく上級者向けです。
デザインとしては上級者なのでかなりかっこよくスタイリッシュにペルソナ5のようにを目指しているので黒と金を主体にしたシンプルな構成を選びました。
AI壁打ちしてたら黒金の組み合わせが出てきただけでもあります。
またブル(ど真ん中)の場合はouterとinnerを指定するようにしています。
これもDBを導入してないので成功係数を入力するフォームが形骸化しています。
このアプリの改善点
僕が思いつく改善点としてはフォームを作っているのにDBを1mmも作っていないことです。
これから時間があったらDBを実装し、成功率や成績を見るページを作り、苦手なナンバーを計算でだしてより練習しやすくしたいです。
ご閲覧感謝
感想
AIにこのダーツのwebapp作らせたらこのクオリティ5分で作れそう
俺地味に制作に勉強しながら1か月くらいかかってるからAIって本当にすごいなって思う
やっぱりAIにすぐ仕事奪われそうだなぁ
将来的に奪われないで共存できるようになりたいですね


