Nuxt.js + TypescriptでVuex内をタイプセーフにする - Qiita
type State = { hoge: string; fuga: number; }; type ChangeHogePayload = { value: string }; type ChangeFugaPayload = { value: number }; export const state: () => State = (): State => ({ hoge: '', fuga: 0, }); type Mutations = { changeHoge: (state: State, payload: ChangeHogePayload) => void, changeFuga: (state: State, payload: ChangeFugaPayload) => void, incrementFuga: (state: State) => void, }; expo
Angularのngrxを使って状態管理を行う（実装編：エンティティ設定） - Qiita
この記事はAngular+Firebaseでチャットアプリを作るのエントリーです。 前記事：Angularのngrxを使って状態管理を行う（実装編：初期設定～エフェクト設定） 次記事：WEBアプリでFirebaseのデプロイ環境を構築する この記事で行うこと 前回の記事ではngrxの状態管理の実装（初期設定～エフェクト設定）を扱いました。 本記事ではngrxの実装方法（機能ストア～エンティティ設定）について学習します。 機能ストアの設置 Entityを用いたストア設計 View（コンポーネント）にStateを反映 機能ストアとは 公式ドキュメント内で機能ストアはStoreModule.forFeatureとして記載されています。 ルートストア（StoreModule.forRoot）がアプリケーション全体で使用できる一方、機能ストアは機能モジュール単位で利用できるストアになります。 Ang
Alexaスキル作成におけるLambda側の基本 - Qiita
はじめに Alexaスキルの作成は大きく分けて2つからなります。 対話モデルの作成 スキルの実際の処理部の作成 対話モデルはAlexa開発者コンソールからグラフィカルに作成するのが一般的です。 （画像は公式のチュートリアルより） 作成された対話モデルに従ってインテントが作成され、それがJSON形式でスキルの処理部分に渡されます。 このスキルの処理部分がインテントハンドラとしてAWS Lambda関数として実装される部分になります。 実装に使うことができる言語はいくつかありますが、公式のチュートリアルではNode.jsで説明されているので素直にNode.jsを選ぶと良いでしょう。 この記事でもNode.jsで話をします。 さて、この記事ではLambda関数として作成するインテントハンドラの基本的な構成について説明したいと思います。 コード部分はぱっと見だと複雑そうですが、少し落ち着いて見てみ
DateTimePickerの代わりを探して(react-datetime componentの紹介) - Qiita
概要 DatePicker(日付選択コンポーネント)の情報は数多くありますが、時間まで表示するコンポーネント「DateTime(Picker)」の情報になると数少ないため、調べてまとめた情報を載せます。 環境 React.js(16.2.0) moment(2.22.2) react-datetime(2.16.2) DateTimePickerの代用を探し求めて 過去に、ReactではDateTimePicker（react-bootstrap-datetimepicker）というコンポーネントがあったのですが、 現在はDeprecatedされており、最新のReact.jsで動かそうものなら多数のエラーに阻まれて動かせない状態。(ECMAのバージョンなどが新しくなったことが理由で動かなくなったようです。) これの代わりになるものを探そう、ということで色々と模索してみました。 時間(秒)ま
【1時間チャレンジ】Angularでオセロを1時間で作ってみる - Qiita
45988c2 [2018/10/28 22:27:16] initial commit 3d114ef [2018/10/28 22:29:38] add ng-cli-pug-loader 4e4edc7 [2018/10/28 22:32:00] template changes to pug 27d83e2 [2018/10/28 22:52:44] create board 3fbbdb7 [2018/10/28 23:12:38] declare style white and black 20fe7c1 [2018/10/28 23:18:03] init board edd03af [2018/10/28 23:24:48] implements when on click cell, put my-trun cell 6a074a4 [2018/10/28 23:52:5
Typescript基礎まとめ - Qiita
はじめに これは、現在の案件でTypescriptを使用しているため、今まで学習してきたことを簡単にまとめた記事になります。 typescriptで指定できる型 number: 数値型 string: 文字列型 boolean: 真偽型 symbol: シンボル型 any: 任意の型 オブジェクト型 number/string/boolean/symbol型は、標準で利用できるという意味で、Primitive Type(プリミティブ型or基本型)と呼ばれる。 型推論により、Typescriptは変数宣言で型指定が省略されている場合でも、型チェックを行う。 ただし、型・初期値ともに省略すると、変数はすべてany型になる。どんな型も受け入れてしまうので、原則letを使うときは初期値は省略しない方がいい。 let data; data = 10.5; // toFiexdは引数に与えた cons
Hyperapp V2 のルーターを自作する - Qiita
Hyperapp V2を使いたいけど公式ルーターがない！でも欲しい！！ということで自作しました。TypeScriptで書いています。型定義はこちら。 サンプル JavaScriptにしたサンプル https://codesandbox.io/embed/zkml2q59j3 router.ts import { h, SubscriptionEffectRunner, SubscriptionEffect, VNode, DispatchType, Effect, Action } from "hyperapp"; export interface RouterProps { routes: Route[], matched: (route: Route | undefined, dispatch: DispatchType<any, any, any>) => void, } expor
chart.jsのtooltipに表示させる文字列を変える - Qiita
やりたいこと chart.jsのtooltip（カーソルをグラフに合わせると出てくる吹き出しみたいないやつ）に表示させる文字列を変更する デフォルトではtitleにx軸、labelにy軸の値とグラフの色が入る 今回はcoffeescriptで記述した やりかた myChart = new Chart(ctx, { type: 'line', data: { ... }, # 表示するデータ options: { tooltips: { callbacks: { title: (tooltipItem, data) -> # title内ではtooltipItemの値（カーソルが重なった箇所のデータ）を表示する場合は`tooltip[0]`のよう要素を指定することに注意!! return tooltipItem[0].xLabel + "hoge" label: (tooltipItem,
enebular の InfoType を ES2015 で書く - Qiita
InfoType の作成にチャレンジしようと、下記ドキュメントを参考に、infomotion-tool を実行してみました。 Creating an InfoType https://docs.enebular.com/ja/infomotion/infomotiontool ES5 のテンプレート 出力された plugin.js には、下記のような、古き良き prototype を使用したクラス宣言が書かれています。 function DataLogger(settings, options) { : } DataLogger.prototype.addData = function(data) { : } DataLogger.prototype.render = function() { : } DataLogger.prototype.clearData = function()
git-secretsとhuskyを同時に使用する
はじめに 機密情報をコミットしないようにgit-secretsの設定をしようとしたところ、既にprecommit用のNode.jsライブラリhuskyがインストールされていたため、コンフリクトしてgit-secretsの設定ができませんでした。 どっちとも使いたかったので、それぞれ動くように工夫してみました。 2019/07/10 追記 会社の @aki77 さんが、もっと良い方法を見つけてくれたので、 そっちを「方法1」として追記しました！ 方法1: husky内でgit-secretsを呼び出す gitのhooks内では、デフォルトのままhuskyだけが呼ばれるようにしておき、 huskyでのチェック項目の1つとして、git-secretsを呼び出します。 lint-stagedも併用します。 git-secretsをグローバルにインストール
node.jsでjQueryを使ってスクレイピングする - Qiita
要約 Node.jsでスクレイピングする jQueryを利用する Promise,async/awaitで同期処理にする。なお同期処理に悪戦苦闘した。難しい・・・ 動機 自然言語の機械学習用データ集めのため、スクレイピングする必要があった。 Pythonでばかりコーディングするのも芸がない。DOMを操作するんだから、jQueryを使ってやろう。 Node.jsは前から興味があったけど、初めて触る。JSのお勉強がてらやってみるか。（※ワタクシのJavaScript知識は10年以上前で止まっていましたので。プロミス？なにそれ、消費者金融？って状態でした） やりたいこと とある、Webサイトの記事のURLを取得したい。 Webサイトには一覧ページがあり、1ページに50件程度の記事一覧がある。ページはパラメータで変えられる（https://hoge?page=2のような形で） 記事一覧の各ページか
GoogleHomeとIFTTTとFirebaseとラズパイとnode.jsでyoutubeの音を流す - Qiita
'use strict'; const firebase = require("firebase"); const config = { apiKey: 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx', authDomain: 'xxxxxxxxxxxxxxx.firebaseapp.com', databaseURL: 'https://xxxxxxxxxxxxxxxx.firebaseio.com', projectId: 'xxxxxxxxxxxxxxxxxxxxx', storageBucket: 'xxxxxxxxxxxxx.appspot.com', messagingSenderId: 'xxxxxxxxxxx' }; firebase.initializeApp(config); const Youtube = require('youtube-n
TypeScript+VSCode拡張機能開発入門 - Qiita
AtomやSublimeTextを使っていましたが，最近VSCodeの良さに気づき始めて完全に虜になりましたw なので，TypeScriptの勉強も兼ねてVSCodeの拡張機能でも作ってみようと思いました 環境 windows10 Pro(Macは試してませんが，多分同じような感じになるはず・・・) 環境構築 Node.jsのインストール TypeScriptをインストールするために，Node.jsがいるのでまずはこれをインストールします Node.jsのインストーラは公式サイトから入手できるます 投稿時点では推奨版と最新版がありますが，推奨版の8.12.0をダウンロードしてインストールします インストールが成功したか確認するには，コマンドラインで以下を入力します
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Vue + axiosでjsonデータを取得しようとしてハマった話。 - Qiita
クラスの継承(風) HOC? - Qiita
なぜTypeScript（またはその他の型付できるAltJS）を使うのか？ - Qiita
Angularのngrxを使って状態管理を行う（実装編：初期設定～エフェクト設定） - Qiita
Angular7 + AngularMaterial 環境構築 - Qiita
Vue.jsの基礎機能 - Qiita
git-secretsで.env.sampleが叱られる場合の対処 - Qiita
