# 概要/背景
- エンジニアとして転職しようと思ったが実績がなかったので作成したポートフォリオ
- SNSを見ていたら嬉しい気分になる投稿と悲しい気分になる投稿が入り混じっていて気分が上下してしまうのが気になったのと、悲しい投稿を見て共感したいのだけどもボタンが「いいね」だと共感になるのか分からないのが気になって作成しようと思いました
# チーム構成・担当
自分のみ
# 使用技術
| 領域 | 使用技術 |
| ---- | ---- |
| [フロントエンド](https://github.com/TsunoKento/emotionSNS-frontend) | TypeScript4.5.4, React17.0.2, Next.js12.0.7, MUI5.2.6 |
| [バックエンド](https://github.com/TsunoKento/emotionSNS-backend) | Go1.17, echo4.6.3 |
| インフラ | MySQL, AWS, Vercel, CircleCI |
| その他 | Docker, Git, GitHub |
下記それに選定した理由になります。
- Go: WEBアプリケーションを作るところまでは決まっており、PHPかRubyかPythonかGoが定番のようだったので全部一通りチュートリアルを実施したところ、Goが処理速度が早いのと型があるのでちゃんと分かってないと作れないのが良いなと思ったのでGoを選定しました
- echo: GoでのWEBアプリケーションのフレームワークを検索したところGinとechoが定番のようだったので、echoの方が軽量と聞いてそちらを選びました
- TypeScript: Goで型がある開発に魅力を感じていたのでフロントも型が欲しいということで導入しました
- React: SPAのサイトの方がUXがいいと思ったのでVue.jsとReactでどちらも一通りチュートリアルを行ったところ、Reactの方が体感わかりやすかったのでReactを選定しました
- Next.js: 当時はフレームワーク必須というイメージがあったのでReact内で使うならNext.jsが人気だったので選定しました。これに関してはReact学びたてだったので開発中問題が発生した時にReactの知識なのかNext.jsの知識なのかが切り分けれずに苦戦したから少し後悔しています。
# 詳細
## 課題
気軽にアカウント登録をしてほしい
- 初めはメールアドレスでのログインだったのですが、Googleでログインできた方が気軽に使えるかと思ったので実装することにしました
### 施策
Googleでログインの機能を実装
### 成果
使ってもらえることに成功
### 工夫した点
どういった手順で実装していけばよいかが分からずに苦労しました、はじめは見様見真似であまり理解できずにコードを書き進めていってしまっていたので実装できませんでした。ただ調べていくとOpenID Connectの処理フローが今回やりたかった実装の手順という事が分かり、それを意識してコードを書き進めていくことにより実装することが出来ました。このタイミングで理解できるソースコードを書こうという意識がより強くなりました。
---