技術ブログ移設しました click here!

【プログラミング】 日英翻訳サイトを作ってみた【JavaScript】

こんにちは、ともろう(@tomorrowSLog)です。

GAS とJavaScriptを使って日英翻訳サイトを実装してみたので備忘録として残しておきます。






【プログラミング】リアルタイム音声文字起こし【JavaScript】

音声文字起こし

開発言語

  • Javascript(メイン)
  • HTML/CSS(必要に応じて)

開発環境

  • Macbook Pro
  • Chrome

デモンストレーション

注意
PC版Chrome最新版において動作確認をしています

デモサイト



コード全文

  •  html本文: 1-12行目
  • JavaScript: 13-45行目
  • CSS: 46-89行目

CSSはスイッチのスタイリングのみです。

ほぼほぼ以下サイトより写させていただきました。ありがとうございます。

参考 ON/OFFスイッチをCSSのみで実装webparts.cman.jp

学びと参考サイト

31行目の日本語と英語の変数入れ替えを1行で実装しています。

ただ単に作業用変数を使うのも面白くないので使ってみました。

参考 JavaScript - 二つの変数を交換する方法<br /> www.m-bsys.com

JSのHTTP通信は初めて触りました。

34-41行目ですね。以下サイトが参考になりました。

参考 HTTP通信jsprimer.net

肝心の翻訳の部分はGAS(Google Apps Script)を利用して実装しました。

他のAPIも探してみたんですが有料のものばかりでした。

以下サイトが参考になります。

参考 3 分で作る無料の翻訳 API with Google Apps Scriptqiita.com

言語入れ替えのJSの部分もう少しうまく書けそうなんですが、とりあえずできる範囲で形にしてみました。

改善できるところあれば教えていただけるととても嬉しいです😎


コメントを残す

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