Next.js

〜サイト構成図〜

このサイトの構成図です。このサイト自体も私のスキルを反映して作成しましたので参考までにご覧いただけましたら幸いです。

〜このサイト構成の理由〜

このサイトの主な構成の理由として、「実務に活かせる」ことを優先して考えました。
想定しているアプリとしてはフロントの配信も高速化しつつ、フロントエンドもバックエンドもスケールできることを想定しています。

フロントにNext.jsとVercelを採用した主な理由はNext.jsのレンダリングサポートの早さと手厚さ、CDNでの配信の早さ → ページ表示スピードはユーザビリティ、SEOに効果的で利益に直結すること、安定性、Vercelのデプロイのしやすさ、手厚さ、検証環境までサポートされている点が挙げられます。

バックエンドにRailsとAWSを採用した理由は情報の多さ、開発者の多さ、サービスの安定性や豊富さ、また私の経験として持っていたものを活かせたことが挙げられます。

また私のバックグラウンドとしてwebデザインから業務に入っており、業務で使用するインフラ（WordPressの開発環境としてDockerの学習やAWS）、フロント（Reactアプリ制作）から順番に学習を進めた背景があります。

実装機能

GitHubのオープンイベントをAPIで取得
GitHubのコンテンツをコンポーネント化
GitHubのコンポーネントをアニメーションさせる
Qiita記事をAPIで取得
Qiita記事をカテゴリごとにデータ整形
Qiita記事をグラフ化
Qiita記事をモーダルウィンドウで表示
WordPress記事をAPIで取得
Zenn記事をAPIで取得
フロントNext Appルーター＋バックRails APIの構成でCRUD機能実装
contact formをAWS SNSで作成（DKIM,SPF設定）

※セキュリティ関連の実装に関してはカジュアル面談の際にお話しできればと思います。

コード品質チェック

prettierでコード整形
ESLintでコーディングルール設定＋クレデンシャル情報直書き防止

検討事項

現在バックエンド、インフラの構成は検討中です。現在のインフラ環境はサイトの特性上too muchでかつコストもかかるということは認識しております。ただこの構成でサイトを増改築し、運用していくことで知見が貯まるようであればやる価値があるとも考えています。

コストを優先する構成であればバックエンドもNext.jsを採用し、vercelのSQLを利用する方法、またサーバレス構成にしてAPI Gateway＋Lambdaで最低限の処理を行う方法を考えています。

今後スキルアップさせたい事

まずは仕事に必要なところがあれば優先して進めたいです。もしおすすめがあれば教えていただければ幸いです。その上で個人的には以下の知識/経験が必要だと感じています。

【チーム開発の経験】
現時点でチーム開発の経験が足りていません。Git branch戦略、メッセージやレビューの仕方、連絡のマナーなどを強化したいです。Gitに関しては個人事業でも導入していますが、個人で仕事をすることがほとんどでしたので独学なのが現状です。チーム開発に置いてスムーズに開発ができるように強化したいと考えています。
【OS/ネットワークの基礎知識】
基本情報を取得し、IPAの資格試験勉強をする中で解像度が上がる体験を実感できました。これまでは実践中心に学習してきたのですが体系的な学習は長期的に取り組んでいきたいと考えています。マスタリングTCP/IP―入門編―(第6版)、ネットワークはなぜつながるのか通読したので引き続き周辺知識を進めていきたいです。
【SQLの知識】
現在は必要最小限動かすくらいなのでアンチパターン、トランザクション関連やパフォーマンスなどを学習したいです。
【IPA資格】
応用情報、ネスペ取得を長期目標として学習しています。
【AWS関連資格】
こちらも業務に関連する分野から学習したいと考えています。