見出し画像

「あんたの五角形」というWebサービスを作りました!

あんたの五角形」という五角形グラフを簡単に作れるwebサイトを作成しました!


サイトの概要

あんたの五角形_note1

ゲームや漫画の能力値グラフっぽいヤツを登録不要で簡単に作成できます!

ラベルを好きなように登録できるので好きにボケることが可能です。

FireShot Capture 039 - あんたの五角形 - jepapt2-gokakkei.herokuapp.com

つまみを最大まで上げると能力値を限界まで突破させることができます。

自由に作成してぜひTwitterで共有してみて下さい!

なぜ作ったのか

就活用のポートフォリオとして作成しました。プログラミングは歴一年もなくかなり技術が乏しい中なんとか作り上げました。ほかの文字の投稿機能だけの作品はありふれていたので、グラフで表現する方法に至りました。

他に似たようなサイトが何件か見つかりましたが、ラベルを自由に変更できる点、投稿をまとめてタグで絞り込みができる点で、できるだけ他と差を付けました。

使用した言語、フレームワーク

Rails,Vue.js,Materializeを主に使用しました。

Railsにwebpackerを導入し、Vue-chart.jsでグラフを表示しました。他によい方法があったかもしれませんが、Railsを勉強していたためこのような形になりました。

苦労した点

投稿画面のフォームに入力時にリアクティブにグラフを動かすのに大変苦労しました。Vue.jsは勉強しながら書き込んでいたのでgoogle検索しまくってかなり時間がかかりました。

また、Materializeの使い方にも大変苦労しました。Bootstrapと使用感が違い、結局cssで強制的に上書きして雑に調整してしまいました。

さいごに

只今私は絶賛就活中ですのでこれで正しいのか分かりませんが連絡用にTwitterアカウントを貼っておきます。宜しくお願い致します!ご意見ご感想も是非送ってやって下さい!

https://twitter.com/jepapt2

この記事が気に入ったらサポートをしてみませんか?