概要

NuxtJs、Vueの学習用に作成しました。この程度のプロフィールサイトであれば、バックエンドは不要ですが 勉強としてモックサーバーもふくめて作りました。

アーキテクチャ

使用技術

• Cloud
  • Netlify
  • Azure App Service
• Middreware
  • Docker
• Framework
  • NuxtJS 2.13
  • .NET Core 3.1
• Program
  • Vue
  • C#
• Test
  • Jest
• CI/CD
  • Netlify
• Mail
  • Send Grid

技術選定の背景

• NuxtJS

仕事で使うことになり、勉強がてらこのプロフィールサイトを作りました。Angularに比べ、エコシステムの充実さ、軽量、CoC原則に則った作りなどメリットが多く、一番得意で好きなフロントフレームワークになりました。

• Netlify

SPAであれば無料で使えるので選定しました。Githubとの連携でデプロイ出来るので楽で良いと思いました。

• Heroku

ホビープランなら無料なので、C#をコンテナ化しHeroku Container Registryを使ってデプロイしています。 無料プランが廃止されることになりました。もともと学習のためにこのプロフィールサイトにAPIを用意していただけなので 出来るだけコストを抑えたく無料プランがなくなった今はAzure App Serviceを利用することになりました。 ありがとうHeroku。

• Azure App Service

無料プランがあり、アクセスが少ないプロフィールサイトであれば十分に事足りると判断し、Herokuから切り替えました。

こだわり

• カバレッジ100%

あくまで勉強用なのでカバレッジ100%を必須としています。

• マークダウン

ポートフォリオのページはマークダウンでかけるようにしています。どのフォーマットでも対応でき、変更しやすいのがよかったと思います。