javascript

Cypress ノート

Cypress を少しさわった後に知っておくと捗りそうなもの。Cypress v5.3.0 で動作確認済みです。(v6 でも問題はなさそうでした。) Cypress が何を利用しているか さらに詳しく 要素のクエリ jQuery ライクに記述 さらに詳しく invoke contains アサーション …

AtCoder を JavaScript で

GitHub - ryotah/atcoder-js AtCoder の問題を JavaScript (Node.js v5.12.0) で解くための環境を作ってみました。 Node のバージョン nodenv で Node のバージョンを v5.12.0 に指定しています。これで、自分の環境では正解しているのに提出したらライタイ…

ESLint ルール追加したいお気持ち

今のルール 追加検討したルール レビュー max-lines-per-function max-statements max-depth 追加ルール no-else-return 結論 その他 既存の Nuxt プロジェクトに ESLint のルールを追加した時に調べたことを整理しました。 Lint の設定ファイルを秘伝のタレ…

コンポーネントの横断的関心事を処理する方法 Mixins, HOCs, Render Props, Hooks を振り返る

これは何か キーワード 横断的関心事とは Higher-Order Components Vue と Higher-Order Components Render Props Vue の Scoped Slots Render Props と Higher-Order Components Mixins Mixins => HOCs => Render Props => Hooks Vue Composition API Compo…

ESLint の設定 (Nuxt TypeScript)

Nuxt で開発する時の ESLint の設定ファイルです。Nuxt のバージョンは 2.10 です。 前提 設定ファイル ESLint の設定ファイルを読む 基本知識 実際に適用されるルールを確認 設定ファイルを拡張する extends 命名規則 @nuxtjs/eslint-config-typescript い…

Date と Timezone

ちょっとしたメモです。でてくるサンプルコードは JavaScript です。 ISO 8601とは 日付と時刻の表記に関するISOの国際規格 2010-10-10T00:00:00.000+09:00 みたいなやつ ISO 形式 (ISO 8601) の文字列判定 - ryotah’s blog 1888年以前は東京のオフセットは …

10月メモ・リンク集

10月に調べたことのメモです。 Vue, Nuxt 関連 Migrate to Nuxt 2.0 Nuxt の options.ignore を利用して pages 内にコンテナやストアを配置 ページ遷移時に権限確認 不要なビルド処理を削減 文字コード・正規表現 Unicode Property Escapes 文字コードの変換…

8月メモ・リンク集

8月に調べたことのメモです。 Vue 関連 基礎 ちょっと応用 Angular 関連 JavaScript その他 その他 Vue 関連 基礎 Vue.js 学習メモ - ryotah’s blog Vuex 学習メモ - ryotah’s blog Nuxt.js 学習メモ - ryotah’s blog How to redirect with vue-router? · Is…

ISO 形式 (ISO 8601) の文字列判定

ISO 8601 - Wikipedia ISO 8601は日付と時刻の表記に関する国際規格。 // https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Date/toISOString new Date().toISOString() // => "2018-08-31T04:56:23.130Z" const ISO8601_DAT…

4月メモ・リンク集

4 月に調べたことのメモです。 Angular 関連 Angular 6 モーダルの状態を ngrx で管理する ngrx の状態管理を Router (URL) 起点にする Rails 関連 マイグレーション Active Record クエリインターフェイス Active Record コールバック JSのテスト 関連 Dock…

2月メモ・リンク集

2月に調べたことのメモです。 リサイザー Show More/Less コンポーネント ドラッグアンドドロップ(dnd) Googleスプレッドシート的なスクロール AngularのDIに関して Ruby, Rails関連 VS CodeでRubyを書く その他 リサイザー angular-resizer - StackBlitz …

カレンダー生成

生成の流れ 対象月の日数を調べる カレンダー上で、1日の前に何日(何マス)あるか カレンダー上で、最終日の後ろに何日(何マス)あるか カレンダーに表示される日数を調べる 前月、翌月も含んだ数 日数分の配列を生成 chunkする 最終的に[Array(7), Array(…

Highchartsメモ

これは何か 基本 レシピ legendを外したい (c-1) 高さを変更したい (c-1) crosshair(照準線)を表示 (c-1) タイトルを非表示にする (c-2) Axisを非表示にする (c-2) どのAxisタイプを利用すべきか Axisに日付を利用したい Axisのタイプにdatetimeを設定 (c-3,…

カラーコードの変換 (Hex -> RGB)

例えば#ff0000をrgb(255,0,0)に変換したい場合。 カラーコード(文字列)を2文字ずつに分ける 16進法を10進法に変換する import compose from 'lodash/fp/compose'; import map from 'lodash/fp/map'; function hexToRgb(hex: string): string { return comp…