top of page
Open Site Navigation

稼働中のサービスをフルリニューアルする手順と実況

更新日:2022年12月3日

labelmake.jpはGatsby + Netlify という構成でアプリを提供していたが、今回のリニューアルでNext.js + Vercelという構成に変更した。


現状新しい構成のBETA版を https://beta.labelmake.jp/ で提供しているが、2022/12/03に https://labelmake.jp/ へ完全に移行する。


別に公開しなくていいんだけど、なんとなく公開した。


やること

  1. ドメイン移行: https://beta.labelmake.jp/ で運用しているサービスを https://labelmake.jp/ に移行する。

  2. コード内のFIXMEの変更(外部連携用のTOKENを開発用から本番用にする)

  3. 外部サービスのwebhookの変更: カラーミーショップ・Shopifyの拡張機能のwebhookのURLを修正する。


現状の整理

ドメインについて

https://labelmake.jp/ は Netlifyのネームサーバーを使っている。

お名前.com Navi > ネームサーバー より確認可能。


これにより、NetlifyのDNS設定にある設定が使われる。

現状NetlifyのDNS設定で設定されているドメイン(サブドメイン)は

である。

あと、

の設定もある。


ネームサーバーはVercelを参照するようにし、現状のNetlifyのDNSの設定をVercelに移していく。


コード内のFIXMEの変更

外部連携用のTOKENを開発用を使っているので本番用に変更する必要がある。対応アプリは下記

  • BASE

  • カラーミーショップ

  • freee

各サービスのアプリ開発者画面の設定にてコピーする。


Webhookについて

カラーミーショップ・Shopifyにはアプリのインストール時やデータ削除の通達のためのWebhookを設定しており、これまではNetlify functionsを使ってそのエンドポイントを設定していた。


そのため、URLは

labelmake.jp/.netlify/functions/~

と設定されている。


しかし、Next.jsのAPI Routesを使うため、

labelmake.jp/api/~

となる。


この変更をカラーミーショップ・Shopifyのアプリの設定画面にて行う。


作業手順

下記の手順で作業を進めていく


  1. コード内のFIXMEを修正し、デプロイ

  2. お名前.comの ネームサーバーの変更 からNetlifyのネームサーバーの値からVercelのネームサーバーの値へと変更する

  3. 変更が確認されるとVercelのプロジェクト > ドメイン設定で接続確認ができる

  4. Netlify DNSパネルからVercelのDNSパネルへと値を移していく

  5. 外部サービスのwebhookを変更する


動作確認・デバッグ

上記の作業手順が完了したらlabelmake.jpで提供しているすべてのサービスが正常に動作するかチェックを行う。チェック項目は下記

  1. 通常のサービス利用

  2. ラベル作成画面

  3. ログイン

  4. アカウント解約

  5. アカウント契約

  6. お問い合わせのメール

  7. サービス連携利用

  8. Shopify

  9. BASE

  10. カラーミーショップ

  11. freee

  12. API連携利用

  13. https://api.labelmake.jp/v1/pdf

  14. https://api.labelmake.jp/v1/pdfTokyo

  15. https://api.labelmake.jp/v1/templates

  16. https://api.labelmake.jp/v1/templatesTokyo

気になっているところ

  • Vercelのプロジェクトにドメインを割り当てるとAレコードをお勧めされているが、ネームサーバーの値でもいいのか? <- とりあえず ネームサーバーの値 で実施する

  • そもそもVercelのプロジェクトにサブドメインしか割り当てたことがなかったので一度サブじゃないドメイン割り当ててみよう。(余っているドメインを使う) <- やった

12/03 20:00~ メンテナンス作業実施

とうとうやってきました。

作業ログがてら書いていきます。


実施タスク

  1. コード内のFIXMEを修正し、デプロイ

  2. 修正し、デプロイした

  3. お名前.comの ネームサーバーの変更 からNetlifyのネームサーバーの値からVercelのネームサーバーの値へと変更する

  4. 実施した。20:07。反映されるまでしばらく待つ。

  5. 変更が確認されるとVercelのプロジェクト > ドメイン設定で接続確認ができる

  6. なんか設定が進んでSSL証明書の発行まで進んだっぽい 20:19


  1. Netlify DNSパネルからVercelのDNSパネルへと値を移していく

  2. さて、もろもろの設定を移していく

  3. とりあえず写せた

  4. 外部サービスのwebhookを変更する

  5. カラーミーショップ -> OK

  6. Shopify -> OK

  7. その他作業

  8. Vercel ドメイン設定にてbetaのサブドメインをlabelmake.jpへリダイレクトをかける -> OK

  9. Vercel ドメイン設定にてwwwのサブドメインをlabelmake.jpへリダイレクトをかける -> OK


確認タスク

  1. 通常のサービス利用

  2. ラベル作成画面 -> OK

  3. ログイン -> OK

  4. アカウント解約 -> OK

  5. アカウント契約 -> OK

  6. お問い合わせのメール -> OK

  7. サービス連携利用

  8. freee -> OK

  9. BASE -> OK

  10. カラーミーショップ -> OK

  11. Shopify -> データの取得でエラーが発生した。保護された顧客データへのアクセス が承認されておらず Admin APIバージョン2022-10 が使用できなった。承認されるまで 2022-07 を使用する。-> 修正済み OK

  12. API連携利用

  13. https://api.labelmake.jp/v1/pdf -> OK

  14. https://api.labelmake.jp/v1/pdfTokyo -> OK

  15. https://api.labelmake.jp/v1/templates -> OK

  16. https://api.labelmake.jp/v1/templatesTokyo -> OK

おわったーーーーー!!21:44!!


・やること

cn2dd

・現状の整理

57g1

 ・ドメインについて

f3lia

 ・コード内のFIXMEの変更

d8n75

 ・Webhookについて

8tm84

・作業手順

a7rtm

・動作確認・デバッグ

bg3ok

・気になっているところ

emv9p

・12/03 20:00~ メンテナンス作業実施

1uptl

 ・実施タスク

a5sk6

 ・確認タスク

2i6o

Table of contents

bottom of page