Vue.js+AWSでポートフォリオを作成・公開してみた

先日ポートフォリオなるものを作ってみました。

今回はこのポートフォリオがどのような技術で動作しているか紹介させていただきたいと思います。

概要はざっくりと以下の画像の通り。

フロントエンドはVue.jsを利用。前に少しだけ使ったことがあったのでこちらを利用しましたが、React.jsにもいつかは手を出してみたいなと常々思っています。
jp.vuejs.org

cssフレームワークはBootstrap4のVue.js用であるBootstrapVueを使わせていただき、見た目を構築しました。

今回作成したポートフォリオだとCardが大活躍でした。

Vue.jsで作成したサイトのホスティングはFirebaseやNetlifyが有名ですが、個人的にAWSに興味があったのでAWSを利用させていただきました。

構成としてはこちらの記事で横綱として紹介されているような、王道な静的Webサイトホスティングのやり方になっています。
dev.classmethod.jp

Vue.jsにより作成したファイルをAmazon S3に格納しています。

Webサイトの高速化をさせるために利用。

ドメインで利用。このブログの独自ドメインはお名前ドットコムにより管理されているものですが、Route 53はその100倍は使いやすかったです。

Https化するために利用。SSL/TLS証明書とキーの作成、保存を行なっています。

欲を言えば背景にGLSL(Unityでいうシェーダーの知識)を使って動かしたりなんかもしようかなと思ったのですが、サイトが重くなりそうでどうしようかなと悩んでます。

軽そうなものなら暇な時にでも実装してみようかなと思ったり。

またTwitter等で公開できるような簡易版と就活で使うような詳細版のふたつを作ることを考えていて、程よい頃合いで簡易版のURLをこのページに埋め込みたいと思います。

良かったらみてみてください。(ちなみに23卒なので、何かありましたら是非ご連絡を)

ではまた。

はなちるのマイノート