月別アーカイブ 11月 2018

村上 著者:村上

【サービス】クレジットカードと連携できる家計簿アプリ「Zaim」

昨日スクリーンショットが撮影できなくて急遽記事の内容を変更しましたが、実は本当に紹介したかったのが、タイトルにある家計簿アプリ「Zaim」です。
日本最大級のレシート家計簿アプリ・オンライン家計簿らしく、今まで家計簿を付けることに挫折してきた人でも続けられるとの触れ込みでした。
私も今まで家計簿なんか付けたことがありませんでしたが、今のところ続けられています。

サービストップはこちらから。

日本最大級!無料の家計簿アプリ・レシート家計簿「Zaim」
https://zaim.net/

アプリとWebの両方あるのが嬉しいところ!
今どきの人は、すべてスマホでサクッと済ませるようですが、私はやっぱりパソコンでの操作が好きなんですよね。

 

使い方も簡単で、金額とカテゴリーを選択し、場合によってはメモも追加することができます。
また、入力する代わりにレシートを撮影することで、いくら使ったのかを記録することも可能です。
が、使い慣れていないせいで、上手くレシートを読み込めませんでした…。
まあ、文字入力は苦じゃないので、別に気にならないんですけどね。

また、履歴も一覧やカレンダーごとに表示を切り替えることができ、見やすいです。
私は主に週末にまとめて買い物をするので、土日の出費が多いですね。
今までは、なんとなく使った金額を把握していましたが、こうして実際の数値を見れると、一度に使う金額とか、買い物の傾向とか、浪費しているかどうかがはっきりとわかって良いです。
…自分ではそこまで浪費家ではないとは思っているのですが、ほんのたまに衝動買いをするので…そういうのもきっちりと記録できます。

更に、クレジットカードの登録もでき、カードでの支払履歴を確認することができます。
カード支払いはあまり行いませんが、だからこそ、たまに使ったときの履歴をこうして自動で保存してもらえるのは有難いですね。
ものによっては、何回かワンタイムパスワードの入力が必要で、ちょっと面倒でした。
私のもっているカードでは、イオンのクレジットカードの登録は少し手間でしたね。
その点、エポスカードの登録は簡単でした。

 

以上、ズボラさんでも続けられそうな、おすすめの家計簿サービス「Zaim」のご紹介でした。
家計簿アプリを初めて使う人は、是非こちらの使用を検討してみてはいかがでしょうか。

  • この記事いいね! (0)
takahashi 著者:takahashi

WinSCPを使うと、多段接続のSSHサーバーでも直接SFTP接続ができる!

先日、とあるきっかけでymさんに教えていただいたWinSCPというアプリを使用してみたのですが、想像していたよりもかなり多機能で便利だったのでご紹介したいと思います。

WinSCP

WinSCPって名前からしてSSH経由の通信しかできないものだと思ってたのですが、ちゃんとFTPなどの通信もできたんですね。

WinSCPの一番の特徴は踏み台サーバー経由のSSH接続が可能な点。

SFTPやSCPをサポートしているクライアントはそこそこありますが、踏み台経由でのアクセス機能はなかなか実装しているものはありません。
とくにフリーの…となると、探した限りではWinSCP以外は見つかりませんでした。

他にも自動同機能を供えていたりなど、他の機能もかなり充実していてとても便利です。

唯一の欠点はWindoes盤のみという点。
自分はmacOSもよく使ってますし、macOS向けのクライアントに、WinSCPほどの機能を持ったクライアントがないので、せめてmacOS版だけでも出てほしいですね…w

  • この記事いいね! (0)
著者:杉浦

DRYの原則と抽象化

 DRYの原則はコーディングの原則の一つでDon’t Repeat Your Selfの略語です。これは同じことを繰り返し書かないでください、という意味で、Andrew Hunt, David Thomasが達人プログラマの中で提唱した原則です。ある一つのことを何度もコーディングした場合、そのことの変化に合わせて繰り返した分に合わせて何度もコーディングを変更する必要があります。これは無駄です。そして変更の漏れはバグになります。この無駄とバグをあらかじめ防ぐために同じことを繰り返し書くべきでない、という原則が提唱されました。
 同じことを繰り返し書くな、という言葉の”同じこと”という部分は重要です。単に同じ記述をしていることを理由に全てをfor、関数、クラスなどにまとめるべきではありません。ある同じ記述がそれぞれ違うことを表現している記述であった場合、片方だけ変化する事態は少なくないのです。同じことであるかそうでないのかを判断する時の基準として抽象化を用いられます。コーディングしたいもの(ソースコードそのものでなく)を抽象化した時、共通点が現れたならばその共通点はまさしく同じことであり、繰り返さずまとめて記述するべき部分です。

  • この記事いいね! (0)
takahashi 著者:takahashi

Youtube初の音楽サービス”Youtube Music Premium” 日本版がついに解禁!

以前から度々話題に出ていたYoutube Music Premiumですが、ついに日本版がリリースされたようです。

新しい音楽アプリ、 YouTube Music がはじまります – Google Japan Blog

いままでスマホのYouTubeアプリで音楽を聴く際、Youtubeを開いたまま(画面をonにしたまま)動画とともに流すしかありませんでした。

今回、Youtube Premium/Youtube Music Premium解禁と同時にリリースされたYoutube Musicアプリを、MusicPremiumに契約した状態で使えば、なんとYoutube上の音楽をバックグラウンドで聞けるようになるそうです。

さらにYoutubeとPlayMusicは最終的に統合される予定とのことで、Youtubeに動画として公開されていない音楽もどんどん追加されていくことになりそうです。
他にも、PlayMusicにはなかった音楽PVなどもYoutube Music上で見れるようになっているのも注目したいポイントです。

唯一気になるのがPlayMusicにあった手持ちの音楽もクラウドにアップロードすることで、ネットにつながっていればどこでも視聴ができる”ロッカー”機能がYoutube Musicにも最終的に引き継がれるのが気になる点です。

個人的にも結構重宝している機能なので、Youtube Musicに完全移行になっても残してほしいですね。

  • この記事いいね! (0)
村上 著者:村上

【Android】アプリ画面のスクリーンショットを禁止する方法

当初は最近使用している家計簿アプリのご紹介を使用と思っていたのですが、アプリがスクリーンショットを撮影できない設定になっていることが判明しました。
そのため、急遽予定を変更しまして、今回はアプリのスクリーンショット操作を禁止する方法についてご紹介!
というか、あまりスクリーンショット自体を撮らないし、アプリにも組み込んだことがなかったので、そもそもそんな機能があったことを知りませんでした…。

ちなみに、その撮影禁止のアプリでスクリーンショットを撮影しようとしたところ、下記の画像のようなメッセージが通知エリアに表示されました。

初めてみましたが、こんなことができたんですね!

 

今回参考にさせていただいたサイトはこちらから。

[Android]アプリでスクリーンショットを無効にする|DevelopersIO
https://dev.classmethod.jp/smartphone/android/prevent-screenshot/

実装方法は案外シンプルで、Activity の場合は、下記のコードを追加します。

Window window = getWindow();
window.addFlags(WindowManager.LayoutParams.FLAG_SECURE);

Fragment で実装したい場合は、下記のように記述するとのこと。

WindowManager mWindowManager; 
FrameLayout mOverlapView;
WindowManager.LayoutParams mParams;
 
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    mParams = new WindowManager.LayoutParams(
            WindowManager.LayoutParams.TYPE_SYSTEM_OVERLAY,
            WindowManager.LayoutParams.FLAG_SECURE,
            PixelFormat.TRANSLUCENT);
    mWindowManager = (WindowManager)getActivity().
        getApplicationContext().getSystemService(Context.WINDOW_SERVICE);
    mOverlapView = new FrameLayout(getActivity());
    mWindowManager.addView(mOverlapView, mParams);
}
@Override
public void onHiddenChanged(boolean hidden) {
    super.onHiddenChanged(hidden);
    if (hidden) {
        mWindowManager.removeView(mOverlapView);
    } else {
        mWindowManager.addView(mOverlapView, mParams);
    }
}

なお、実際に無効化を操作しているのは、8行目からの mParams の記述になります。
そして、その操作を反映するために、onHiddenChanged() でその変更反映の処理を行っています。

Activity もしくは Fragment でのスクリーンショット禁止の記述は以上です。

 

以上、Androidアプリでスクリーンショット操作を禁止にする方法でした。
もし開発中のアプリでスクリーンショットを制御したい場合は、是非参考にしてください。

  • この記事いいね! (0)
asaba 著者:asaba

【windows10】バッテリーリフレッシュ&診断ツールを実施してみた

windows10を買って一年経つのですが、右下のバーに見慣れない緑色のアイコンがあったので気になってググったところ、どうやら

バッテリー・リフレッシュ&診断という無料のツールでした。

通常のpcは購入して一年経つとウィルスバスターの更新などはよく見かけるようになるのですが、このツールは初めてだったので

よく分からないままクリックすると下のダイアログにたどり着きました。

このツールは、劣化していたバッテリーをリフレッシュさせ、ほぼ最初の状態に回復させてくれる機能を持っています。

自分はほぼpcを繋いでプログラミングをしているので、そこまでバッテリーを酷使した覚えがないのですが停電などでバッテリーを

登板させたときに何かあったらいけないのでしぶしぶ実施することに。というのも実はバッテリーのリフレッシュが完全に終わるまで17時

間もかかってしまい、その間pcが使えなくなってしまうのが嫌であまりやりたくなかったのですが初代富士通FMVみたいにバッテリーが

完全に死ぬ悲劇を繰り返したくなかったので仕方なくです、仕方なく。

これは私事な理由でしたが、pcを長く使いたかったらバッテリーのリフレッシュをすることをお勧めします。

  • この記事いいね! (0)
著者:杉浦

flexbox学習用のフリーゲームの紹介

 CSSのflexboxは便利ですがプロパティはあまりに多彩であり、覚えきるのは手間です。また、flexboxの理解が程ほどでも力業で望んだデザインに近いものを作ることは可能です。flexboxの内容は覚えずに適宜調べることが解決法のひとつですが、その場合flexboxでは何ができるかを知っておくことが重要です。ここで紹介するflexbox学習ゲームはflexboxの各プロパティを用いて工夫することを強いてくれます。学習ゲームを通すことでflexboxのできることを一通り知ることができます。
 Flexbox Froggy – CSS flexbox学習ゲーム
 Flexbox Defense
 Flexbox Froggyはflexboxに従って動く蛙を同じ色の蓮の葉に配置するゲーム、Flexbox Defenseはflexboxに従って配置されるタワーを用いたタワーディフェンスゲームです。どちらも高難易度になってくるとプロパティの豊富な組み合わせが必要になりなかなか一筋縄ではいきません。

  • この記事いいね! (0)
村上 著者:村上

【Cordova】外部サイトをアプリ内ブラウザで表示する方法

実際に試してはいないのですが、今後実装すると思われるので、その備忘録としてまとめ。

見つけた記事はこちらです。

PhoneGap/Cordovaでの外部サイトリンク 内部表示/アプリ内ブラウザ/標準のブラウザ – Qiita
https://qiita.com/tsunet111/items/272f3e052c332ddf9b9d

 

実装方法ですが、Cordova の初期テンプレートに最初から追加済みのプラグイン「cordova-plugin-whitelist」を使います。
まず、config.xml にアプリ内で表示したいアドレスを追加します。
記述例は下記のとおりです。

<allow-navigation href="https://cpoint-lab.co.jp/*" />

上の例では、このサイト全体の表示を許可しています。

<a href="https://cpoint-lab.co.jp/">株式会社シーポイントラボ</a>

あとは、aタグでリンクを設置します。
作業としては以上です。
こちらを実行すると、ホワイトリストに追加したアドレスであれば、内部ブラウザで表示されます。
なお、それ以外のアドレスにアクセスした場合は、端末のデフォルトブラウザが起動しますので、ご注意ください。

 

以上、Cordovaアプリのアプリ内ブラウザで外部サイトを表示する方法でした。
もし、上記の方法でうまくいかない場合は、「cordova plugin add cordova-inappbrowser」を使う方法もあるとのこと。
ホワイトリストが働かない場合は、こちらのプラグインもお試しください。

  • この記事いいね! (0)
著者:杉浦

(Now More Than Ever) You Might Not Need jQueryの紹介

 (Now More Than Ever) You Might Not Need jQuery | CSS-TricksはjQueryなしのJavaScriptコード集です。
 jQueryは2006年に発表され、現在も更新がなされ続けているJavaScriptのライブラリです。jQueryは古い時代のブラウザによる拙いDOM操作を大きくカバーしてきました。このDOM操作はとても強力でcdnとしてもよく引っ張りまわされています。Most copied libraries on cdnjs.com by @thomasdavis – Listiumによれば2015年6月~2017年6月の間、2位に大差をつけてcdnjs.com内で最もcdnのリンクがコピーされたとのことです。
 2013年にYou Might Not Need jQueryという記事が公開されました。これはほんのjQueryなしでちょっとしたDOM操作をするサンプルコードの集まりです。ブラウザの発展やフロントエンドライブラリの充実により少なくない状況でjQueryは必要でなくなったという背景があります。(Now More Than Ever) You Might Not Need jQuery | CSS-Tricksは2017/7/12に公開されたjQueryなしのJavaScriptコードの集まりです。(これまで以上に)の名が示す通り、You Might Not Need jQueryより洗練され、時にはjQuery以上の柔軟性を持った簡単な記述が載っています。
 ReactやVueの様なテンプレートを用いるフロントエンドライブラリによってwebページを作成した場合、DOM操作はほとんど必要なくなり、DOM操作のためにファイルの大部分を費やしているjQueryはむしろ邪魔になります。またjQueryを使わないことによってアンチパターンであるNodelistとjQueryオブジェクトの混在から完全に解放されます。jQueryのオブジェクトとChrome、FirefoxのNodelistには.append()が存在するがIEには存在しない為jQueryオブジェクトでないものにつないでしまった.append()はIEでのみこける、というバグには苦戦しました。

  • この記事いいね! (0)
asaba 著者:asaba

【ESLint】続 ESLintのエラー解釈

前回ログを消して見れなくなったエラーコードですが、新しいファイルをリファクタリングしたらぞろぞろと出てきたのでこの機会に

説明してしまいましょう。ESLintて何?という方は筆者に期待するのはやめてググってみてください。(そっちのほうが賢明)

二つとも簡単なエラーですが国内の資料が見つからないので自分なりの解釈で訳します。例えばこのエラー、コメントアウトの中で

引き起こしたエラーですがパラメーター’e’が行方不明ですよという意味合いになります。


Missing JSDoc for parameter 'e'

これは、後述に書いてある@event~がない時に吐かれるエラーです。イベントハンドラにコメントを付ける際には忘れずにつけて

おきましょう。

 

二つ目は、reactにはprop-typeというパッケージがあり、ESLintを導入するとこれらのパッケージがちゃんとついているかどうかも

検証してくれます。これを怠ると後述のようになります。


‘history’is missing in props validation

historyを使う際には、このprop-typeが必要になってきます。今まで当たり前にできてきたので少々面倒くさいですが、npmで

prop-typeをインストールしてコード一番上にインポートしておいてください。

本日は以上で終わりになってしまいますが、どこかでESLintエラーにまた会うことでしょう。綺麗なコードを書けるように引き続き牙を研

ぎ続けます。

  • この記事いいね! (0)