のぐそんブログ

暗いおじさんがシコシコ書くブログです。

Vue.jsのmixinで簡単共通化メモ

mixinで共通化をする mixin機能を利用することで、複数のコンポーネントで処理を共通化することができます。 使い方 例えば、以下のようなコンポーネントがあり、createdの処理と、methodsを共通化する為mixinにしたいと思います。 <template> <div :style="style">{{ name }} </div> </template> <style> </style> <script> export …

vueのカスタムディレクティブのメモ

カスタムディレクティブ v-xxxのようなオリジナルのディレクティブを作成することができる。 ディレクティブのオプション オプション 内容 bind ディレクティブが対象の要素に紐付いたときに1度だけ実行される inserted 紐ついた要素が挿入されたタイミング…

vueでtransitionを利用するメモ

vueではtransitionコンポーネントを利用することで、わりと簡単にアニメーションを実現することができます。 公式を見たほうがより詳しいので、公式を見ることをおすすめします。

webpack-dev-serverで立てたサーバーにIPで接続する

webpack-dev-serverでローカルにサーバーを立てた場合、localhostではなくIPでアクセスすると見ることができませんでした。 PCなどはlocalhostでアクセスすれば問題なかったりするのですが、スマホでの動作など外部のデバイスから動作を確認したい場合に少し…

VueでグローバルなCSSを読み込む方法

Vueを利用している場合に、scopedを利用して、CSSをカプセル化するのが普通だとおもいますが、その場合bodyやhtmlに値を適応することができませんでした。 グローバルにCSSを設定するのに少し悩んだのでメモしておきます。 1. App.vueのscopedを外す scoped…

ローカル環境でドメイン関連の検証を行う為のメモ

自分用のメモです。 現在開発中のサービスが、サブドメインによってページを出し分けるような仕様です。 その為ローカルの開発環境の場合、http://localhost:8000のようになる場合、都合が悪かったです。 そこで、/etc/hostsファイルをいじって、特定のドメ…

ndenvが便利だメモ

いつもグローバルにnode.jsをインストールして、利用していましたがndenvというのを利用すると、プロジェクトごとにnodeのバージョンを管理することができるようなので、利用してみよと思います。 ndenvをインストールする場合はanyenvというツールを利用す…

Vueで親コンポーネントから子コンポーネントのスタイルを変更する方法

Vueで親コンポーネントから子コンポーネントのスタイルを変更する方法です。

Vueで無料の範囲でFont Awesomeを使う

無料の範囲でFont Awesomeを利用する方法です。 理解に地味に時間がかかったのでメモしておきます。 fontawesome

Vuexの基礎基礎自分用メモ

Vuexを使うためのメモ。 部分的にしか書いてないので、あまり参考にならないと思います。

Code Splittingメモ

Code Splitting Vue cliでプロジェクトを作成した場合にrouter.jsのcode-splittingの記述が気になったので調べてみた。

Atomic DesignでUIを細分化する

最近のjavascriptのフレームワークはコンポーネント指向で設計されているものが多いです。 コンポーネント指向の良いところは、作ったパーツを再利用できる点と、再利用することでサービス全体でのUIの一貫性が保たれるという点だと思います。 そしてコンポ…

iOSとAndroidのUIの違い

基本的なUIパーツの名称の違い ベースとなるUIの名称もiOSとAndroidで少し違います。 共通認識を持つためには正しく覚えておく必要がありそうです。

愛がいっぱいiOSのデザインガイドライン

iOSヒューマンインターフェイスガイドラインとは一体何なのかというと、 Appleが定めたiOS向けのユーザインターフェイスのガイドラインです。

効果的なデザインフィードバック

今回はデザイン業務を行う際に避けて通れない、「デザインのフィードバック」について書いてみようと思います。 また、この記事を書くに当たって「みんなではじめるデザイン批評」を参考にさせて頂きました。

Adobe Dimensionで3D表現に挑戦

3Dグラッフィクデザインソフト「Adobe Dimension CC」について少し書きたいと思います。

Laradockで簡単に開発環境を準備するメモ2

前回書いたLaradockで簡単に開発環境を準備するメモの続きです。 MysqlのコンテナのDBに接続してみたいと思います。

LaravelでS3に画像をアップロードする為のメモ

Laravelで、S3に画像をアップロードする為のメモです。

Laradockで簡単に開発環境を準備するメモ

Laravelの開発環境を準備するのに便利だというLaradockを利用してみたいと思います。

docker-composeをやってみたメモ

docker-composeを利用すると、複数のコンテナを管理するのに便利なようです。

Dockerが全くわからないので調べたメモ

Dockerのことが全くわからないので、少し調べたことをまとめてみました。

TouchDesignerでトゥーンシェーディング

はじめに こちらはTouchDesigner Study Weekend Vo.010に参加した際に学んだことをまとめています。 運営の方含め、とても良い勉強会でおすすめです。 あくまで自分の復習の為に、まとめ直しています。 実際はもっと、有益な情報を沢山学ぶことができます。 …

PHPもSQLもわからないけどLaravelをやる為のメモ

いよいよ業務でphpをやらなければなくなったので、自分用のメモとして残そうと思います。 見てもあまり参考にならないと思います。

Houdiniの基礎基礎メモ1

TouchDesignerを勉強中ですが、Houdiniは操作が似てるらしく、各所でおすすめされたので挑戦したいと思います。

TouchDesignerのGLSLでディゾルブをやってみる

はじめに こちらはTouchDesigner Study Weekend Vo.010に参加した際に学んだことをまとめています。 運営の方含め、とても良い勉強会でおすすめです。 あくまで自分の復習の為に、まとめ直しています。 実際はもっと、有益な情報を沢山学ぶことができます。 …

Vue CLI 3での開発環境を作るの基礎の基礎

Vueをやりたかったので、調べたことをメモします。 Vue CLI 3になり、ファイル交際やコマンドなども結構変更になっているようです。

TocuchDesgnerのGLSLでディスプレイスメントをやってみる

はじめに こちらはTouchDesigner Study Weekend Vo.010に参加した際に学んだことをまとめています。 運営の方含め、とても良い勉強会でおすすめです。 あくまで自分の復習の為に、まとめ直しています。 実際はもっと、有益な情報を沢山学ぶことができます。 …

Angularの開発をするために雛形を作る

AngularJSからAngularへの移行する為に基礎を学びます。 まずは開発環境を構築するためにに雛形ファイルを作成します。 ※ここではangular6.xを使っています。

TouchDesignerのExpressionメモ

Expressionメモです。追加していく予定です。 Expression 説明 absTime.frame 現在のフレーム番号を取得する absTime.seconds 経過時間を取得する me.digits オペレーター名の最後の数字を取得する (例)content1の場合は1 me.inputVal 入力値を取得する op("…

TouchDesignerでPythonを実行してみる

自分用のメモです。