Nuxt.jsでうさぎを増やして跳ねさせる - Qiita
フロントエンドの学習のためにうさぎを増やしたり跳ねさせたりできるサイトを作製しました。 うさぎがピョン！ ソースはGitHubに置いています。 fmatzy/usagi DOM要素を動かす DOMの論理的な構造はHTMLが担いますが、見た目に関する部分はCSSが担います。アニメーションについてもCSSを使います。 参考: コピペで使える！ CSS Animationだけで実現するキャラクターアニメーション - ICS MEDIA せっかくならもう少しアクロバティックに動かしたいですね。 うさぎを動き回らせる 画面上の要素の配置を決めるのもCSSであるため、プロパティをstyleに紐づけ、その値を動的に変更することで、動的に位置を変えることにしました。 @Component({}) export default class Creature extends Vue { @Prop() pos
Promiseでネストが深くなるのを防ぐための方法（やや黒魔術）（の提案） - Qiita
概要 Promiseは便利だが、うまくモデリングしないと（時にうまくモデリングされていても）、深いネストとアロー関数の海におぼれてしまうことがある コンストラクタのresolveとrejectへの参照を保管しておくと、深いネストから解放されることがあるが結構書きづらく読みづらい resolveとrejectを抜き出すためのモジュールを導入すると、多少書きやすくなる（この記事での提案部分） 上手く使えばすっきりかけるが、多用が必要な時はたぶんモデリングを見直したほうがよい そもそももっといい方法があるぞ、ちゃんとしたデザインパターンがあるぞ、ということをご存知の方は教えて下さい Promiseでネストが深くなる例 非同期で外部やユーザのアクションを待つときに、Promiseを受け取ることでawait(やthen)で同期っぽいコードですっきりと利用側のコードを書ける場合がある。（以下のようなイ
Vue.js+TypeScriptでElement-ui利用時に単体テストが完了しなくて悩んだ話 - Qiita
概要 Vue.js+TypeScriptでElement-ui利用なプロジェクトで単体テストを書いてたらテストが完了せずにハマったので覚書です。 Elementについては下記をご参考ください。 Element http://element.eleme.io/#/en-US Vue.jsのコンポーネント詰め合わせ「Element」がスゴかった https://s8a.jp/vue-js-library-element すべてを調べてないので、あれですが、ElementのLoadingコンポーネントをServiceとして利用する場合、close メソッド内で、setTimeout を利用しているのでnextTick を忘れないようにしましょう(結論) http://element.eleme.io/#/en-US/component/loading Githubに検証で利用したプロジェクトをU
TypeScript の小ネタ集 - Qiita
型のプロパティをすべて非必須にする Partial<T> 利用例 既存の必須項目がある型を流用する際などに利用できます。 型のプロパティをすべて必須にする Required<T> 利用例 とある型から mapped type で型を生成している際に、元の型のシェイプの変更への追従が容易になります。 interface O1 { p1: any; p2?: any; } type O2 = Required<O1>; type F<T> = { [K in keyof T]: () => void }; type F1 = F<O1>; // = { p1: () => void; p2?: () => void; } type F2 = F<O2>; // = { p1: () => void; p2: () => void; } const f1: F1 = { p1: () => {}
tsconfig 日本語訳 - Qiita
{ "compilerOptions": { /* 基本オプション */ "target": "es5", /* ECMAScriptのターゲットバージョンを指定します: 'ES3'（デフォルト）, 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018'または 'ESNEXT' */ "module": "commonjs", /* モジュールコード生成: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015',または 'ESNext'を指定します。 */ // "lib": [], /* コンパイルに含めるライブラリファイルを指定します。 */ // "allowJs": true, /* javascriptファイルをコンパイルできるようにします。 */ // "checkJs": true, /*
Nuxt.jsでポートフォリオサイトを作製する - Qiita
フロントエンドについての学習のため、Nuxt.jsでポートフォリオサイトを作製してみました。 fmatzy.github.io GitHub Pagesで (お金をかけずに) ホスティングしつつ、多少動的なこともしてみました。Vue.js、Nuxt.jsについてほぼ知識のないところから作製したのでかなり荒削りです。 fmatzy/fmatzy.github.io-dev 工夫した点は以下の通りです。 GitHubのリポジトリとQiitaの投稿をそれぞれAPIで取得して表示した。 トップページはMarkdown形式で書くようにした。 Nuxt.jsで静的なページを生成してGitHub Pagesでホスティングした。 GitHubのリポジトリとQiitaの投稿をそれぞれAPIで取得 せっかくSPAのフレームワークを使用するので、なにかのAPIを叩いて動的にコンテンツを生成することにしました。
Vue.jsでv-bindが利かなかった。→bindした変数を初期化してなかったからだった - Qiita
// The Vue build version to load with the `import` command // (runtime-only or standalone) has been set in webpack.base.conf with an alias. import Vue from "vue"; import App from "./App"; Vue.config.productionTip = false; /* eslint-disable no-new */ new Vue({ el: "#app", components: { App }, template: "<App/>" }); <template> <div id="app"> <img width="25%" src="./assets/logo.png"> <div>{{str}}</di
2018年Vue.jsとVuexを使ってる人には必ず知っていてほしいドキュメントに書かれていないコンポーネントやストア、メンテナンスの際に役立つTips - Qiita
はじめに 私はVue.js with Vuexを使った業務で1画面30APIを叩く必要のある画面から、たったの数APIしか叩かないけれど、代わりにUIがとても機能的で複雑な画面まで設計し、構築しました。 現在は構築したシステムを保守・運用しており、その際に得られたノウハウを言語化し、共有出来たらと思います。 ※ 記事の内容に意見がありましたら直接編集リクエストをください。 ※ パフォーマンスの話はしません。 ゴール 役立つTipsを身につけコード品質を向上させる コンポーネントのバグを減らせるTips ほとんどのバグは変数から来ます。 もし全ての値が定数なら状態から来るバグはほとんど無くなるでしょう。 ここではこの変数や式を極力減らせるTipsを紹介したいと思います。 1. dataを極力定義しない Vue.jsでコンポーネントを定義する際ついdata()に沢山変数を定義しちゃいますよね。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
TypeScriptで使う JSON 変換用のライブラリメモ - Qiita
最小構成のvue.jsの環境をvue cli使わずに構築する - Qiita
自分用: tscのtarget optionで排出されるClass形式纏め - Qiita
Electron & React & Redux & TypeScript アプリ作成ワークショップ 6日目 - Qiita
Vue.jsのerrorHandlerがいまいちつかめない - Qiita
TypeScript3 tsconfig.jsonで出力先ディレクトリを設定する。 - Qiita
Reactでテキストボックス入力値を取得する - Qiita
TypeScript で literal type を union している型をオブジェクトのキーに使用する - Qiita
既存のNuxtプロジェクトにTypeScriptを導入する - Qiita
processmakerのＡＰＩをＣＬＡＳＰとＣＬＯＵＤ９で作成 - Qiita
TypeScript で引数の文字列に応じて戻り値の型が違う関数の書き方 - Qiita
Vue.jsでVuex+axiosを利用してAPIを叩く - Qiita
