- 1. StandAloneで稼働しているUIから一部だけライブラリとしてPublishした話 feat. rollup
- 2. JavaScriptでなんちゃって演算子オーバーロード—四則演算子
- 3. Stripeを利用して、2回目以降の支払いに備えてクレジットカード情報の保存と再利用を行う方法
- 4. Shopifyで出荷予定日をJavascriptで表示（アプリなし）
- 5. 四則演算とは
- 6. 【jQuery】animateメソッドとは
- 7. p5.toio を使ったシンプルな p5.js のプログラム：接続中の toio の数の表示や move()、rotate() などによる走行
- 8. nizima LIVEのスクリプト機能(β)の特徴・注意点
- 9. 【JavaScript】snake_caseをcamelCaseに変換する方法
- 10. p5.js でのシェーダーを使った描画に WebGL 2.0（GLSL ES 3.0）を使う 〜その3：JavaScript側から時間の情報を渡す、createFilterShader() を併用〜
- 11. 【jQuery】valメソッドとは
- 12. 【JavaScript】プロパティはいくつまで繋げられるのか？
- 13. JXA で note のお気に入り作者の記事一覧を csv 形式で保存する
- 14. 【初心者向け】Javascriptのよくあるエラーと解決策
- 15. Viteで作成したReactアプリをSSGで出力出来るように変更
- 16. 【JavaScript+SupaBase】データベースのレコードを削除する方法
- 17. [備忘録] Reactのルーティングについて
- 18. npx コマンドでCLIを実行したら"could not determine executable to run"って言われた
- 19. SPAから動的に挿入されるDOMを取得する
- 20. Array.prototype.every()を学ぶ
StandAloneで稼働しているUIから一部だけライブラリとしてPublishした話 feat. rollup
## はじめに
所属プロジェクトでは大量のReactコンポーネントを持っており、その中の一部(60%くらい)のコンポーネントを社内の別のプロジェクトでも使うため、ライブラリとして公開しろという指令が出ました。
実は既に社内で使われていましたが、ビルドがコンシューマ側で行われていたので、ここを何とかしろという話でした。(~~お前らのせいでビルドに余計な時間がかかるだろうが！~~)
##### 結論: rollup (https://www.npmjs.com/package/rollup) を使った。”まぁまぁ”うまくいった。
## 1. 現状とゴールの確認
#### 現状:
コンシューマが`npm install <プロジェクト>` を実行するとほぼソースコードそのものがnode_modules以下にinstallされる(babelでトランスパイルだけされている)、のでコンシューマ側でビルドが必要。
使う側はコード上で `import {Component} from @プロジェクト/src/components/library/index` のように、ファイルパスまで
JavaScriptでなんちゃって演算子オーバーロード—四則演算子
# はじめに
前回は自作の数値計算ライブラリの実行用(フロントエンド)を紹介した。
この数理計算ライブラリには複素数、ベクトル、行列クラスなどがある。
そうなると欲しくなるのが四則演算`+,-*,/`などの演算子オーバーロードである。
JavaScriptは演算子オーバーロードはサポートされていないがトランスパイラであるBabelのPluginを使うことで擬似的に作ることができる。
その方法を、備忘録を兼ねて記事にする。## Babel Plugin
Babelは言わずとしれたトランスパイラである。
Babel Pluginはこ のBabelの処理の途中に独自の処理を加えてソースコードを書き換えるものである。
その処理には元JSからAST(抽象構文木)に変換してそれを元に別のJSに変換するのもである。
そのため、この処理をより深く理解するためにはASTの知識が合ったほうがいいがその知識は参考文献にしておく。白状するとこの記事はほぼこの記事、[JavaScriptで演算子オーバーロードしてみる(BabelでAST)](https://qiita.com/taqm/items/1e
Stripeを利用して、2回目以降の支払いに備えてクレジットカード情報の保存と再利用を行う方法
ECサイトや予約サービスなど、顧客が複数回商品やサービスを注文するユースケースでは、「**クレジットカード情報を保存する仕組み**」が重要です。2回目以降の注文で、クレジットカード情報を入力する必要がないようにシステムを構築することで、顧客が注文フローの途中で離脱する「カゴ落ち」のリスクを下げることができます。
Stripeによる[「EC サイトの決済に関する調査レポート」](https://stripe.com/jp/guides/state-of-asia-pacific-checkouts-2022
)では、「注文・決済フローが3分以上かかると、49％のユーザーが注文を諦める」との結果がでています。![スクリーンショット 2024-02-07 13.57.05.png](htt
Shopifyで出荷予定日をJavascriptで表示（アプリなし）
## はじめに
ECサイトで商品を購入する際には出荷予定日が表示されていると、購入する側からすると安心ですよね。
今回アプリを使用しないで、Javascriptのみで商品出荷予定日を表示できるよう実装しました！
詳細は以下の通りです。
– 商品購入日が平日で9時前であれば当日の日付を表示
– 商品購入日が平日で10時以降であれば翌日の日付を表示
– 翌日が休日の場合は休日明けの日付を表示（翌日が土曜日であれば月曜を表示、お盆休みや正月休みも休み明けの日を表示）
– 商品購入日が休日の場合も同様に休日明けの日付を表示今回の実装ではAPI連携を行わずに、祝日やお盆休みをJavascript内に配列として定義しています。
## 実際のコード
“`js