Skip to content

Latest commit

 

History

History
126 lines (85 loc) · 4.48 KB

README.md

File metadata and controls

126 lines (85 loc) · 4.48 KB
Raw

Memopad New Tab

Licence Gitpod Ready-to-Code Chrome Web Store

Google Chromeの「新規タブ」の拡張機能。
新しいタブを開いて🗒️メモを取ったり、⏰リマインダーを保存したり、🔗リンクを貼り付けたり、または表を作成したりできます。
デフォルトの「新規タブ」の代わりとして素早く綺麗で、シンプルに使える事に重点を置いています。

Preview it!

screenshot

Demo GIF

Install

About

Memopad New Tabでは、Google Chromeのデフォルトの「新規タブ」の代わりとしてMarkdownエディタになります。

{Features|特徴}

  • 簡単
    新しいタブを開いて、好きなことを書き込めばいいのです。
    次に新しいタブを開いたときには、前回入力した内容が残っています。

  • ノートリスト
    必要に応じて複数のメモを作成することができます。

  • 強力
    Markdown構文を利用して記載することで、多彩な表現が可能になります。
    Markdownの構文についてはこの素晴らしいガイドを参照してください。

  • オフラインで記述
    Memopad New Tabは、サーバー上ではなくブラウザ上に保存してます。
    オフライン環境でもノートの作成や編集が可能です。

{Upcoming|今後の予定}

  • リビジョン管理
    リビジョンの履歴を自動的に保存（および削除）、過去バージョンへの切り替え

  • キーボードショートカット を使用してノートの編集とプレビューを切り替える

  • ログインしているすべてのChromeブラウザ間でノート、改訂履歴、設定を同期

  • gistと連携

  • プライバシー機能として、Open時と5分間操作がなかった場合に画面をぼやかす機能

  • 計算
    式の即時計算

  • カスタマイズ
    フォントや背景のカスタマイズ

  • ライブプレビューを表示するための分割編集

Usage

  • メモの編集とプレビューは下のボタンを押す

  • メモの保存は他のメモに切り替えるか ショートカットキーCtrl + S (または Mac の Cmd + S) で保存することができる。

Development

  1. このrepoをClone します。
$ git clone https://github.com/nojaja/memopad-new-tab.git
  1. Vue CLIのインストール 今回の開発はVue CLIを使って行いました。 今回はVue CLI 4を使っています。 npmを使ってグローバルにVue CLI 4をインストールします．
$ npm install -g @vue/cli
$ vue --version
4.2.3
  1. VueUI Project Dashboardの起動 何かと便利なので起動しておく
$ vue ui
  1. アプリケーション起動 「npm run serve」によって起動します。
$ cd memopad-new-tab
$ npm run serve

「npm run」は「packeage.jsonのscripts」に追加されているコマンドが実行されるので、 「serve」に書かれた「vue-cli-service serve」が実行されます。

  1. ブラウザでアクセス コンソールにURLが表示されるので、それを開く

  2. コーディング

  3. ビルド

$ npm run build
  1. Chromeを開き、chrome://extensionsに移動します。
  2. チェックボックス（ページ上部）にチェックを入れて「Developer Mode」を有効にします。
  3. 「Load Unpacked Extension」 ボタンをクリックして、クローンしたリポジトリの dist/フォルダを選択します。
  4. これで拡張機能がロードされ、'New Tab' ページが Memopad New Tab になっているはずです。🎉

License

Licensed under the MIT License.