わたねこコーリング

野良プログラマ発、日々のアウトプット

プログラミング

CDN 版 Vue3 で問い合わせフォームのサンプル作った

先月書いた「petite-vue で問い合わせフォームを試作してみた」の外部仕様を流用して、Vue.js 3.4 (CDN 版)でも同じことをやってみたです。Vue.js って、Options API で書くぶんには Vue CLI ベースでも CDN 版でもプログラムコードに大して違いは無いのです…

petite-vue で問い合わせフォームを試作してみた

petite-vueVue.js のサブプロジェクトで petite-vue ってのを見つけたので、使ってみたという話です。github.competite-vue は README にあるとおり、Vue.js のサブセット的な小規模実装で、プログラムサイズはわずか 6KByte 程です。小型軽量なリアクティブ…

Nuxt3 で Bulma の Admin Template を表示するまで

Nuxt3、長らく RC だったのがようやく正式リリースされましたね。github.com早速試してみたんですが、テキストで Hello だけでは味気ないので、どうせならリアクティブ系 F/W と相性が良い Bulma と抱き合わせたやつにしてみようと思います。Free Bulma Temp…

【matplotlib】 boxplot() で whis='range' が使えなくなった件

jupyter (matplotlib は 3.5.3)でデータ集計をしていて、久々に箱ひげ図を作ろうとしたら表題件に気づきました。この作業ではデータの性格上、外れ値は考慮しなくて良いので、 plt.boxplot(datas, whis='range') としたら、こんなエラーが。 ValueError: whi…

Vue FlatPickr Component (CDN 版)を日本語化する

Vue.js なお仕事で日付入力にお馴染みの FlatPickr を使ったので、表題件を備忘録的にメモ。背景はこんな感じ。 モノリシックな SPA 開発というよりは、レガシィな既存サイトの一部ページについて U/I を Vue.js 化するという案件だったので、JS ライブラリ…

【Python】Zip ファイルから特定のファイルだけパスを付けずに取り出す

沢山のファイルが詰め込まれている Zip ファイルから、特定の条件(拡張子とか)のものだけ選んで解凍保存したい。その際、パスが深いと保存場所がとっ散らかるのでディレクトリは取っ払って一箇所に集めたい、という状況で書いた Python コードです。下記は、…

Heroku でシンプルな PHP サイトを作る

ここしばらく、レンタルサーバ中心で開発・提供してきた個人サイトの数々を整理統合する作業をしてます。その一環で、とある PHP 製サイトを Heroku の無料プランに移行してみることにしました。公式のチュートリアルに従って手順を学んだのですが、Silex ア…

うたほんくん、シーズン2突入しました

かれこれ20年くらい運営しているちょっとしたサービスをリニューアルしました。utahon.mariyudu.net「うたほんくん」という、ウクレレコードフォーム付きの歌詞カードを生成するサービスなんですが、リニューアル後はこんな感じです↓。 歌詞を書いてコードを…

【Vuetify】ドロップダウンリストで「その他」選択時に任意テキストを入力

Vuetify 小ネタ。表題の件を v-select で実現できんかなー、とサーチしていて見つけたのがこれ↓。stackoverflow.comほぼドンピシャなソリューションだったのですが、任意入力 + Enter で初期表示状態に戻る U/I が少し不満だったので fork してアレンジして…

やめました・はじめました

かれこれ四半世紀程続けてきたライフワーク的なウェブサイトを閉鎖し、心機一転、新サイトに移行することにしました。 '95年前後のネット時代幕開けの折、「ホームページ」というものを作ってみたくなり開設した、自分の好きな音楽を情報発信するサイトです…

Nuxt で Vuetify のロケールを設定する

自分プロジェクトで Nuxt いじりするのが楽しい連休二日目です。という訳で表題どおり、Nuxt.js プロジェクトで U/I に Vuetify を選択した時、ロケールを指定して日本語化する設定という小ネタです。nuxt.config.js に言語ファイルの import とロケール設定…

Chrome 拡張機能 ModHeader で HTTP ヘッダを自在に書き換える

ウェブ開発も最近は Node.js 一辺倒になってしまった在宅野良ブログラマ Mariyudu です。プログラム内で URL のオリジンを参照してごにょごにょしたりすることがたまにあるんですが、curl -H "Host: my-web-develop.net" http://localhost:3000/ 的なことを …

Vue.js で SVG.js を使って動的に画像生成する

以前に作った SVG.js でベクタ作画する処理を、Vue.js 製のウェブアプリに組み込もうとしてるのですが、npm モジュールが少し古いようなのでひと手間加えることになったというお話です。SVG.js はコンパクトに纏まっており、他のリッチ志向なライブラリに比…

DNS ゾーンレコード変更を監視して音声でお知らせ

最近ブログ書いてないので小ネタも山の賑わい的な。当方では自分のドメインをバリュードメインさんで管理しているのですが、コンパネからゾーン情報を編集しても DNS サーバに反映されるまで5〜30分程(公称)かかるんですよね。「変わったかな?」と数分毎に …

手元の phpMyAdmin からリモートホストのデータベースを SSH トンネル経由で操作する

ウェブ開発では、かつては MySQL サーバを立てたら次は同サーバ内か同一 LAN 内に phpMyAdmin のセットアップをというのが定石でしたが、コンテナ時代の今では phpMyAdmin もデスクトップアプリと同様の手軽さで利用できるようになりますた。という訳で、手…

既存 RDB 用の GraphQL API サーバを Apollo Server + TypeORM で書いてみた

コロナ巣篭もりを良い機会にという訳でもないですが、ここひと月程 GraphQL について学習してました。が、書籍でもネット記事でもデータベースを含めた新規開発なストーリー(データストレージはたいてい NoSQL タイプ)が殆どで、「既存の RDB データベースの…

データ入りの演習用 MySQL DB を1分で用意する

プログラマやってると、ミドルウェアやフレームワーク等を検証したり、チュートリアルを試してみるということは日常的にあるあるな訳ですが、そんな時にゃテンポラリな演習用 DB がちょくちょく必要になりますよね。今回はそんな煩わしい作業を超スピードで…

AWS DcoumentDB クラスタに SSH トンネル越しで Node.js プログラムから接続する

小ネタですが表題件、地味にハマったので備忘録として。下記情報を元に、VPC 外(つまりおうち or 職場のパソコン)で開発中の Node.js プログラムから DocumentDB に接続しようとしたらタイムアウトでなかなか接続できませんですた。docs.aws.amazon.comdocs.…

lightweight-charts でローソク足チャートをサクサク生成

以前、TechanJS というフィナンシャルチャート作画ライブラリの紹介をしましたが、今日はまた別のチャート作画ライブラリ↓の紹介を。github.com上記にあるように lightweight-charts は、トレーダー向けに各種ツールを提供している TradingView さんが OSS …

CloudWatch ログをダンプしたり空ログストリーム削除したりするスクリプト書いた

AWS Lambda 関数開発をしてると CloudWatch ログを参照することが多いので、書いたスクリプトを備忘録的に公開。CloudWatch ログは、ロググループ→ログストリーム→ログレコード という階層構造になっており、Web コンソールからログレコードを参照する場合は…

Pandas 演習としてのテクニカル指標計算【最終回】 〜 MA-RCI (オリジナル)の巻

このシリーズも今回で10回目。ネタが尽きてきたというか、指標計算に関してはわりとこなれてきた感もあるのでこれで最後にします。最終回記念としてお題は既存のテクニカル指標ではなく、先ごろ考案したオリジナル(たぶん)のトレンド系指標です。アイディア…

Pandas 演習としてのテクニカル指標計算 〜 ストキャスティクスの巻

今回のお題はユーザの多いストキャスティクスを。直近の一定期間における値幅(最高値-最安値)中の終値相対位置を元に、「売られ過ぎ・買われ過ぎ」を表現するオシレータ指標です。詳細は下記を参照下さい。www.sevendata.co.jp計算に使う株価データは毎度お…

Pandas 演習としてのテクニカル指標計算 〜 平均足の巻

今回は指標とはちょっと違うかもしれませんが、平均足をお題に。ローソク足にした時にトレンドが把握しやすいよう始値・高値・安値・終値それぞれを調整したもので、国産の指標だそうです。詳しい説明は下記あたりを参照して下さい。www.sevendata.co.jp計算…

Pandas 演習としてのテクニカル指標計算 〜 DMI の巻

シリーズも7回目なので今回は少し難易度を上げて、DMI という七面倒な計算が必要なオシレータ系指標にチャレンジ。それに、これまでは日足の終値を材料として計算する指標ばかりでしたが、DMI は高値・安値を積極的に活用するという特色があります。DMI につ…

Pandas 演習としてのテクニカル指標計算 〜 コポック買い指標の巻

10連休短けぇ… もっと色々やりたかったのに… と萎える連休最終日、ブログでも書いて締めますかね。今回は「コポック買い指標」というちょっと聞き慣れないやつを取り上げてみます。これは、月の平均株価を前年同月と比較して騰落率を算出しておき、さらにそ…

Pandas 演習としてのテクニカル指標計算 〜 RCI の巻

東証も前代未聞の長いお休みに入った10連休3日目、いかがお過ごしでしょうか。そんな今回は RCI を。順位相関指数と言うやつで、N 日間の株価について昇順に順位を採り、時系列に沿って 1, 2, … N と順当な上昇であれば 100% に、逆に N, N-1, … 1 と下降な…

Pandas 演習としてのテクニカル指標計算 〜 ボラティリティの巻

今回はボラティリティを。価格変動の激しさを捉える指標ですね。「変動」といっても見方は様々で、前回のボリンジャーバンドで算出した株価の標準偏差も「個々の株価と一定期間平均とのバラツキ度合い」なので変動のいち表現と言えます。いっぽうで「前日と…

Pandas 演習としてのテクニカル指標計算 〜 ボリンジャーバンドの巻

シリーズ3回めはボリンジャーバンドを。個人的には最も使用頻度が高い指標かも。日経平均プロフィルさんから株価データ取得のコードはここでは割愛。シリーズ第1回目を参照ください。まずバンドの中心ラインとなる単純移動平均を算出し、同日数での株価標準…

Pandas 演習としてのテクニカル指標計算 〜 MACD の巻

珍しくやる気になってるので、鉄は熱いうちにという訳で今回は MACD の計算でつ。長短2本の指数平滑移動平均の差分をとり、さらにその移動平均をとったものとの差分が売買シグナルになるというオシレータ系の指標です。個人的にはどうも意味合いというか使い…

Pandas 演習としてのテクニカル指標計算 〜 移動平均の巻

Jupyter Notebook 上で主にシストレをテーマにしたデータいぢりを始めて1年あまり経ちますが、いまいち NumPy・Pandas・Matplotlib がマスター出来た気になれないので、公開しながら演習することにしました。プライベートのスニペットバンクにちまちま書き溜…