📝

URL 生成サポートアプリを作ってみた

2022/05/31に公開

簡単な URL 生成サポートアプリを作ってみたので紹介します。

GitHub

https://github.com/nkm-m/Translate-App

概要

詳細は GitHub をご覧ください。
アプリの内容は以下の通りです。

・入力した日本語を英語に翻訳
・英語を小文字に変換
・英単語間にハイフンを挿入
・特定の記号 (., ', ?) を削除

作成したきっかけ

これまでは、URL を生成したい時に以下の手順で行っていました。

  1. Goggle 翻訳で日本語を英語に翻訳
  2. 英語で大文字になっている文字を小文字に直す
  3. 英単語間にハイフンを手打ち or エディタで半角スペースをハイフンに置換
  4. ピリオドなどの記号を削除

上記の手順は 1 ~ 2 分もあればできるのですが、それがちまちました作業だったので面倒だと感じていました。
上記の手順を一発で解決するツールも探したのですが、なかなかよさそうなのものが見つかりませんでした。

そこで、自分で作ろうと思ったという次第です。

アーキテクチャ

・S3 で静的 Web ホスティング
・API Gateway で Lambda プロキシ統合を使用
・Lambda のランタイムは Node.js
・Lambda から AWS SDK for JavaScript を使用して、Translate の TranslateText API をコール
・翻訳後の英語を小文字に変換したりする処理を Lambda で実装
・AWS リソースは CloudFormation で展開

セットアップ方法

詳細は GitHub に記載しているので、ここでは簡単に記載します。

  1. git clone
  2. AWS CLI コマンドで CloudFormation スタック作成
  3. ローカルファイルを編集して S3 にアップロード

使用方法

アプリの使用方法は日本語を入力して、翻訳ボタンをクリックするだけです。
翻訳結果は下のテキストエリアに表示されます。

なお、URL の生成をサポートするだけなので、http などのプロトコルまでは含めていません。
プロトコルなどの情報が必要な場合は自分で補完する必要があります。

使いどころ

プロトコルなどは自動で付与されるけど、WordPress のようにパーマリンクを自分で決める必要がある時に使えると思います。

今後

今回は CloudFormation テンプレートを自作しましたが、今度は Amplify で作ろうと思っています。
ただ、Amplify の場合、Amplify CLI で作ることになるので、CLI バージョンの差による影響などがあるのは懸念点です。
とは言いつつ、とりあえず作ってみようと思います。

まとめ

簡単な URL 生成サポートアプリを作ってみたので紹介しました。
シンプルなアプリですが、何かの参考やどなたかのお役に立てば幸いです。

Discussion