フロントエンド専のエンジニアが見よう見まねでawsのLambdaを用いて個人開発をした

目次

誰も興味ないサイトの紹介をする意義

仕事では主にAngularVueReactを使っているフロントエンドしかできない30歳が、インフラ~すべてに手を出してみた。

作成したはいいけど、12か月後、awsの無料枠終了を見据え、運用する気はない。

そこで、ひとつ記事にでも残しておこうという思いで筆を取ることにした。

作成したサービス

簡単なアンケートサイト。

アイデアに関しては、悲しいかな、特筆すべき点はない。

エンジニアリングするうえで、読み方がよくわからない言葉が良くあるので、それを投票で決めようといった魂胆。

競合とかは特に調べていない。

使用した技術

  • インフラ
    • aws Lambda
    • aws RDB
    • aws API GateWay
    • Vercel
  • バックエンド
    • NestJS
    • TypeORM
  • フロントエンド
    • NextJS

インフラ

インフラは初めて、awsに手を出してみた。

永久無料枠がない従量課金制は初めてなので、請求に不安を感じる。

柔軟にスケールできていいのだろうけれど、スケールアップしないので、定額の方がうれしい。

まあ、いい勉強にはなった。

バックエンド

バックエンドにはNestJSを採用した。

理由は、フロントと言語を統一することで効率化を図れるという点と、学習コストが低そうだった点。

Angularに似ている言語ということで、普段Angularを業務利用している身としては、非常に手っ取り早く、概要をつかむことができた。

言語としての不満はなく、今後も使っていきたいと思ったが、いかんせん日本語の情報が少なく苦労した。

NestJSのエラーレスポンスをカスタマイズする
NestJsで作成したプロジェクトをAWSのLambdaにあげて動かすまでの作業ログを残しておく
LambdaにのせたNestJSでapp.enableCors();を指定しているのにCORSエラーがでたので解消するまでを記録した

フロント

迷うことなく、NextJSにした。

現在、個人開発をするとなったら、一択の選択肢かなと感じている。

ただ今回、Next13AppDirにちょっと戸惑う点もあった。

SSRの書き方とかが簡略してていいと思う反面、サーバーコンポーネントとかの概念がいまだにつかみ切れていない。

それでも、引き続きNextJSを採用し続けると思われる。

フロントのサーバーはVercelにアップしたNextJS使うのであれば、第一の選択肢だろうし、実際そうなった。

エックスサーバーで借りたドメインのサブドメイン使用し、Vercelにカスタムドメインを設定する

このサービスの今後

awsの無料枠を終えた後も続けるメリットはないので、運用していく気はない。

ただせっかく勉強のために作ったので、無料枠を終えるまでは暇を見つけて、issueを解決していきたいと考えている。

isuue

動けばいいやという思いもありつくったので、細かい箇所を理解しつつ、ブラッシュアップしていきたい。

  • 初回アクセス時Vercelがサーバーレス関数の発火をまたずにタイムアウトする。
  • CORSの設定をちゃんやる
  • LambdaとGithubの連携をする
  • JWT認証をCSRF認証に変更してみる
  • マイグレーションの設定をちゃんとやる

とか🤔🤔

次に読むおすすめ記事

無料枠のよくわからないawsの無料枠について真剣に調べてみた

NestJsで作成したプロジェクトをAWSのLambdaにあげて動かすまでの作業ログを残しておく

AWSのRDSに接続したいけど踏み台サーバーでうまく接続できなかったので、RDSをパブリックサブネットに置きHeidiSQLで接続を試みる

この記事に対するコメント

お気軽にコメントを下さい

メールアドレスが公開されることはありません。 が付いている欄は必須項目です