かずきち。の日記

サーバサイドエンジニアのつぶやき

さくっとChrome拡張を作ってみたので、500円払って公開審査をGoogleに提出した!

自分で作ったアプリを全世界に公開したい

iPhoneアプリAndroidアプリを携帯で誰でも購入ができます。
でも誰がアプリを作っているんでしょうね?
会社のエンジニアなどがアプリを作って公開をしています。

www.apple.com
引用:
https://www.apple.com/jp/app-store/

みなさんも携帯電話に複数のアプリを入れているのではないでしょうか?
ブラウザ版アプリもありまして、作ってみたいなと。

そんなわけで数日前Chrome拡張を作成しちゃいました

アプリを作ったはいいが、使えるのが自分だけじゃ困るのでストアに公開することにしました。
数年前に開発者ライセンスを500円で購入しているので提出するだけです。

f:id:kazukichi_0914:20211229130156g:plain

なんか数時間でアプリが完成したので、公開したい!

ストアでの掲載情報を記入し、使い方動画などをYouTubeにアップロード

f:id:kazukichi_0914:20211229130419g:plain

アプリのアイコンを作るのがめんどくさくて、いらすとやの著作権フリーの画像を拝借してきました。
ショップ公開用に128×128のサイズのアイコンなどを作成。
最後に審査ボタンを押して完結。

f:id:kazukichi_0914:20211229130836g:plain

なんかすごい楽な操作でしたが以上です。
一応、Googleに使い方動画も提出できるらしいのでYouTubeに動画を上げておきました。

manifest.json
{
  "name": "MyTestChromePopupExtention",
  "version": "0.0.1",
  "manifest_version": 2,
  "description": "Test popup extention",
  "icons": {
    "128": "icons/icon128(2).png"
  },
  "browser_action": {
    "default_title": "",
    "default_icon": "icons/icon128(3).png",
    "default_popup": "popup.html"
  }
}
popup.html
<html>
<head>
  <title>拡張に埋め込みたいページ</title>
</head>
<body>
サンプル
</body>
</html>
popup.js
const txtDate = document.getElementById("txtDate");

txtDate.addEventListener('keyup', function(){
  const result = document.getElementById("txtDateResult");
  const date = moment(txtDate.value).toDate();
  result.value = date.getTime().toString();
});
script.js
chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.tabs.create({"url": "newtab.html" });
});
icon_clicked.js
chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.tabs.create({"url": "newtab.html" });
});
ファイル構成

f:id:kazukichi_0914:20211230133615g:plain

掲載結果は年明けになるでしょうが、拡張機能を作ってみました。
興味ある人は作ってみてください。