前提 Next.jsとmicroCMSを使用し、数百ページのWebサイトを構築している App Routerは使用していない（Next.jsの採用時にApp Routerがまだ正式採用されていなかったため） ISRも使用していない（業務要件の兼ね合いから使っていない） Amplify上で、SSGして…
概要 株式会社トライビート｜ TRIBEAT CO., LTD. では、数年前からJamstackなWebサイトやECサイトの構築を推進（提案）しており、年々こういったご相談を受けることが増えています。 選定技術はそのときの顧客要件によって変わりますが、Amplify、Next.js、m…
概要 FlutterでGoogleMapを利用するとき、API KeyはOS毎に以下のファイルで設定する必要があります。 iOS：ios/Runner/AppDelegate.swift Android：android/app/src/main/AndroidManifest.xml テスト環境と本番環境にそれぞれ発行したGoogleMap API Keyを、 …
概要 同じチームのエンジニアが新しいプロジェクトに参画し、既に作成済みのDocker環境にxdebugを入れようとしたところ、うまく動かないという相談を受けて調査開始 peclコマンドでxdebugをインストールして設定しているが、確かに動かない、、、 結論 Docke…
概要 Amplifyプロジェクトで普通にAuthを追加してMFA対応していた SMS認証コードとEMail認証コードはそれぞれCognito標準機能を使っていたが、TwilioやSendGridなどの別サービスで送るための対応が必要になった Cognitoから認証コードを送るときに、カスタム…
概要 yasutomo.hatenablog.com 上記ブログの続き AmplifyでNext.jsをデプロイしたタイミングだと問題なく動くが、あるタイミングからCloud Frontの503エラーになっていた 上記事象が発生するのは、同じAmplifyプロジェクト上で同じソースコードで構築したhos…
yasutomo.hatenablog.com yasutomo.hatenablog.com また雑多なメモを残しておきます。 概要 Amplify上でNext.jsを動かすときに503エラーが発生 ネットで調べていると色々と情報はでてくるが、自分がハマったケースは大きく2つ Next.jsでISRをしているときに…
yasutomo.hatenablog.com 昨日、上の記事を書きましたが、Advent Calendarにまだ空きがあるので、雑多なメモを残しておきます。 概要 Amplify環境でNext.jsのアプリケーションを構築 Next.jsでは、ページによってSSG、ISR、SSRを使い分けている 課題 SSRして…
トライビートという会社の札幌オフィスで開発全般やってます。 気づいたらもう12月ですね。 AWS Amplify Advent Calendar 2021のカレンダー2は、まだ空きが多いので、今年開発していく中で得た知見をメモとして残しておきます。 qiita.com 概要 Amplifyの複…
概要 microCMSからのWebhookを利用して独自でデータ管理するために作成 コンテンツの状態とユーザー操作によって、typeとstatusがどう変わるかをまとめる 参考サイトではstatusが配列で定義されているため、実際にどういう値が来るか確認 参考サイト documen…
概要 Nuxt.jsでSSGしたものをAmplify上でhostingするJamstack構成 GitHubにPushされるとAmplify上でSSGされる流れ Amplifyプロジェクトを新規に構築していく中で、3件連続ビルドエラーを経験したのでまとめる 前提 node.js：v14.17.0 amplify-cli：4.51.1 nu…
概要 eslintとprettierをGitコミット時に実行する 環境 node：14.14.0 eslint：7.23.0 eslint-config-prettier：8.1.0 husky：6.0.0 lint-staged：10.5.4 prettier：2.2.1 設定ファイル prettierrc.json { "singleQuote": true } eslintrc.json { "env": { "…
概要 Nuxt.jsベースでJamstackなECサイトのサンプル実装しているときに、PAY.JPの初期化でエラーが出ることがあったのでメモ PAY.JPを実装するにあたり、payjp（2.0.5）のnode moduleを利用 画面側ではpayjpのCardElementを生成し、トークンを作成して決済用…
概要 Firebase Cloud functionsで、Firestoreを利用している 当初は、index.jsに関数定義していた 複数関数定義する必要があったので、関数ごとにファイル分割した 1回目の関数実行時は特に問題ないが、2回目以降の呼び出し時に以下のエラーが発生 （初期化…
概要 Jamstack Advent Calendar 2020 - Qiita の22日目の記事です。 株式会社トライビート｜ TRIBEAT CO., LTD. という会社でBtoCや業務システムのWebアプリケーション構築や運用・保守をしています。 これまでJamstackという言葉が出てくる前から、社内独自…
概要 iOS実機とMacbookを接続して実機デバッグする中で、開発者ツールがうまく動かない事象が発生 iOS実機のバージョンにより再現が異なることを確認 iOS 12.4.9 問題なし iOS 14.2 MacbookのSafariから実機接続は可能 開発者ツールの[要素]タブから、適当な…
yasutomo.hatenablog.com 2019年に上記ブログで書いてたとおり、monologを使った日付のログローテート処理でうまくいかないことがありPRを投げていた。 PR作成してから2週間程は気にして見てたけど、特に音沙汰なかったため、自分の拙い英語ではやはり相手に…
概要 2020年のコロナ時期から社内コミュニケーションを活性化させたく、社内環境でPodcast配信を開始 Podcastの収録はzoomで録音し、編集などはせずに社内のGoogleサイトへアップする流れ（継続させることに重き置いて、極力手間を掛けないことを意識してい…
概要 Xcodeから実機デバッグするときに、2種類のXcodeエラーダイアログが表示されたので、それぞれ解決方法を記載 前提 macOS Catalina（10.15.5） Xcode（10.3） iOS（13.5.1） エラー1（Could not locate device support files.） ビルド成功後、実機へ転…
前提 macOS Sierraからのアップグレードした 念のためTime Machineでバックアップ取ってたが、ファイルシステムの違いから復元が簡単ではなくなった OSがアップグレードされることで、Xcodeのバージョンアップも必要となった（11.4をインストール） Command …
概要 Nuxt.jsのプロジェクトでNetlify Formsを利用して、簡単なForm画面とrecaptcha機能を試したときに、ハマった点をメモ docs.netlify.com 前提 nuxt.js (v2.11.0) 「npx create-nuxt-app」で生成したプロジェクトをNetlify上にデプロイ NetlifyでGitHubの…
概要 Blogについて 「アジャイル開発 Advent Calendar 2019」の20日目 アジャイルやスクラムを取り入れつつ、システム開発に対してアプローチした「ふりかえり」 qiita.com プロジェクトについて クライアント社内で利用する業務システムの開発（数年継続し…
概要 Lumenを使ったAPIサーバで日別にログ出力している（日付ごとにディレクトリを分けてログ出力している） 数年間のシステム運用をしている中で、特に問題なくログ出力できていた ある日、ログ出力できないというエラーが発生したので、調査内容をまとめる…
概要 社内アプリをPWAで構築したときのはなし 社内の諸々はGoogleアカウントで管理しているので、認証はGoogleのOAuth2を使用 PWAはNuxt.jsを使って作成し、APIはPHPのLaravel（社内サイトがLaravelを使ってたので流用）を使って作成 Google OAuth 2.0 認証…
概要 PHPでHTTP通信の並列処理をする curl_multiではなくGuzzleHttpを使って試す GuzzleHttpは並列実行が元々用意されている 知りたかったこと GuzzleHttpでPoolの使用時に設定するconcurrency（並列処理数）の制御 具体的には、全部で10リクエスト投げる処…
概要 Azure SQL Databaseを使っていて、Azure Data Studio（MSが提供しているクライアントツール）を試してみた 実行計画のところだけ、ハマったのでメモ バージョン OS：10.12.6 Azure Data Stduio：1.1.3 インストール 以下のサイトからダウンロードしてイ…
概要 Nuxt.jsのテンプレートを使ったプロジェクト 「yarn run dev」コマンドで開発サーバ起動（デフォルトの3000ポート） コンソールログに「hot-update.json timed out」というエラー出力 ホットリローディングができない バージョン node：10.12.0 nuxt.js…
概要 Nuxt.jsのテンプレートとPWAモジュールを使用して作成したアプリをGitHub Pagesにコマンドラインでデプロイする方法のまとめ バージョン node：10.12.0 nuxt.js：2.0.0 nuxtjs/pwa：2.6.0 push-dir：0.4.1 vue-cli：2.9.6 yarn：1.10.1 参考記事 https:…
概要 Nuxt.jsで構築したサイト（yarn run generateで生成したdist直下）をGitHub Pagesに上げると、_nuxtディレクトリ内のjsファイルなどが404になる GitHub PagesではJekyllで処理されるため、アンダーバー付きディレクトリなどが正常に読み込まれない 対応…
概要 既に色々なところであがっているトピックなので今更だが、Excelの特定バージョンでのみ文字化けするということがあったので、対策をメモ 一般的にCSVをExcelで開く時の文字化け対策としては以下2つ。 CSVの文字コードをShift_JISで作成する CSVの文字コ…
