PIYO - Tech & Life -

patch-packageっていうnpmパッケージありますよね？ この記事↓が詳しいので紹介はだいぶ任せちゃうのですが、npmパッケージを手元でちょっとだけ直したいときに重宝する仕組みです。 https://bagelee.com/programming/javascript-2/patch-package/ 使い方はこう。 手元でnode_modules配下のとあるパッケージのコードをいじる …

VeeValidateを紹介するときに、CodePenというサービスを使ってサンプルコードを紹介しました。 https://blog.piyo.tech/posts/2018-10-28-vuejs-vee-validate/ 他にもJSFiddleやJSBinなど類似のサービスがいくつかあるのは知ってしましたが、Vueのサンプルを書くときにPreprocessorを選択したり、ライブラリをCDN …

ちょこちょこVue.jsを使ってるんですが、まだ手に馴染みません。まだまだ馴染まない理由の1つにフォームがあります。 Railsをメインに使う生活をしているので、form_forがないとフォームが書けません。というか、simple_form gemばかり使っているのでさらになまっていて、たとえばbootstrapのフォームがどんな構造なのかを忘れているので、すごく手間がかかってしまいます。

今日もvuejs-datepickerに絡めての話。 datepickerをインライン表示したら幅が固定になっていて困りました。 こうじゃなくて、 こっちにしたい。 コンポーネントのstyleを見ると幅300pxと固定になっています。これを幅100%にしたいの上書きします。

Vue Componentの関数、具体的にはvuejs-datepickerのsetDateを呼び出すのってどうするの？というのでちょっと迷ったのでメモ。 https://github.com/charliekassel/vuejs-datepicker このdatepickerをインライン表示で使おうとしてるんですが、Todayボタンがなさそうなのが不便なので自分でボタンを置いて作ろうとしました …

Railsのjs-routesgemはクライアントサイドでURLヘルパーを使えるようにできるgemで、大変便利です。 Gemfileにgem "js-routes"を書いてインストールしたうえで、asset pipelineのapplication.jsあたりでrequire js-routesとしておきます。すると、Rails側で使えるuser_path(@user.id)み …

どうやって書くのがいいのかなーと迷いました。 例として適切ではないですが、例えば↓のようなコンポーネントがあったとして、なにかのタイミングですべてのデータをリセットしたいとします。 export default { name: "App", data() { return { title: 'Hello World', message: 'your todo …

Electronを触り始めました。 フォルダ選択をして、フォルダ内の画像を一括処理するアプリケーションを作りました。一括処理の中には画像のリサイズやトリミングも含まれます。 画像加工部分にはsharpというライブラリを使いました。ネイティブコードを使うため速いとのことです（そのせいかビルド時にハマリましたが、それはまた後日）。

Electronを触り始めました。 ファイルを指定する Electronではブラウザよりも柔軟なファイル選択が可能です。フォルダ選択が可能なため、今回は対象のファイルを一括で指定するためにフォルダ選択を用いました。 Electronのレンダラープロセス側のJSで、ボタンを押したらフォルダ選択ダイアログを表示して処理するみたいな部分をまず書いてみます。

ここ3年ぐらいElectronでなんかデスクトップアプリ作りたい！と思って、でもなんとなくJSの環境周りが変わっていくので敬遠してました。 今回機会があって触り始めたら、難しく考えなくていいことがわかったんで、完全に理解したわーという気持ちになりました。