メモブログ

技術的なことを書き連ねるブログ

javascriptのthisについてまとめる

頭ではなんとなく理解しているけど、javascriptのthisはややこしい なのでちゃんとまとめようと思いました。 そもそも、javascriptにおいて「this」は何を指すか? 色々調べていてとてもしっくりくる説明があった。 thisが呼ばれた関数(メソッド)が所属し…

macで簡易ローカルサーバーを立てる

mac

とりあえず、なにも準備しないで簡易的にローカルサーバーを立てる時、 macOSにはデフォルトで Pythonとphpが入っています。 python --version Python 2.7.10 php -v PHP 7.1.19 (cli) (built: Aug 17 2018 18:03:17) ( NTS ) Copyright (c) 1997-2018 The P…

nodeのバージョン管理をnodebrewからndenvに変更した

nodeのバージョン管理にnodebrewhttps://github.com/hokaccha/nodebrewを使っていた。 とても便利だったのだがプロジェクトごとにnodeのバージョンを変えるのがいちいち手動で面倒だった。 そして、「あれ、このプロジェクト nodeのバージョンなんだっけ??…

.bash_profile と .bashrc の違い

.bashrcしか使っていなかったのと 毎回違いを調べて忘れるのでメモ。ここのリンクに詳しく載っていました、ありがたい。.bash_profile と .bashrc は何が違うの?使い分けを覚える - Corredor ■bash_profile ・bashrcより先に実行される ・ログイン時に1回だ…

cssアニメーションで JQueryのfadeIn fadeOutを実装する

css

最近、脱jQueryの流れがあるので、大好きではあるが今やっている案件は、jQueryを使わないで実装することにした。 そこで以外にめんどくさいのがfadeIn fadeOut。 jQueryでは、 opacity:1 → opacity:0 → display:none display:block → opacity:0→ opacity:1 …

photoshop cc でPSDからテキストデータを抜いてくれるスクリプト『ps_bramustextexport』

【PS_Bramus.TextExport-1.3】なるものを見つけたので共有◆スクリプトダウンロード先 https://www.bram.us/2008/03/16/ps_bramustextexport-13-automatically-export-all-text-layers-from-photoshop-psd-to-a-text-file/◆インストール、使い方 Photoshopの…

gulp(node)でjsonのデータを読み込む時、jsonファイルの修正が都度反映されない件

gulp(node)を使用時、jsonなどの外部ファイルにデータを持っておき、それを読み込んで処理をしたい時があると思います。が、以下のように requireで読み込んだ場合、初期に読み込んだものがキャッシュされてしまいタスクを走らせた後に、jsonファイルを修正…

.gitignoreでフォルダ内を複雑に無視する方法

git

ディレクトリ内にある特定のフォルダのみignoreしたい場合は(今回の場合はhoge) 面倒だが以下のように書いていくしかないみたい。 全体を無視 ↓ その下の特定のディレクトリだけ許可 ↓ その下の特定のディレクトリの下を無視 ↓ その下の特定のディレクトリ…

gulpで引数によって処理を分けたい

例えば、引数によって開発環境ではjsをそのまま、本番環境ではminifyする。 などしたい場合。gulplife.coffee ############ # module ############ gulp = require 'gulp' coffee = require 'gulp-coffee' # coffeescriptを書くのに必要 uglify = require 'g…

mac で VirtualBoxを使い ieの検証環境を準備する

webmem.hatenablog.comkudakurage.hatenadiary.compc-karuma.netpc-karuma.net上記記事にも記述してあるが、ダウンロードする仮想マシンがデフォルトだと、 Windowsのものがダウンロードされてしまうので、macのものに手動で変更する必要がある。https://az4…

vagrantの設定

フロントエンドの開発だけならばnode.jsなりでローカルサーバーを立てればいいが、サーバーサイドのローカル開発環境も欲しい!ってなったとき&Windowsマシンでもlinux環境が欲しいとなったので(MTやWordpressレベルならxamppやmampでいいかも)、 「vagrant…

gulpでbabelを導入する

まだブラウザだったりnodeで対応していない箇所もあるけど、 そろそろES6の勉強もしないとなぁということで、手っ取り早くgulpにbabelを導入することにしました。https://babeljs.io/ インストール npm install --save-dev gulp-babel babel-preset-es2015 b…

Arrayオブジェクトのメンバ

arr.concat(arr2) 2つの配列を結合 var arr1 = ["りんご","バナナ","みかん"]; var arr2 = [1,22,333,4444]; console.log(arr1.concat(arr2)) // ["りんご", "バナナ", "なし", 1, 22, 333, 4444] arr.join(del) 配列内の要素を区切り文字で結合 var arr1 =…

Mathオブジェクトのメンバ

abs(num) 絶対値 document.writeln(Math.abs(-20)); // 20 絶対値 max(num1,num2) 2つのうち大きいほうを返す document.writeln(Math.max(11,2)) // 11 min(num1,num2) 2つのうち小さいほうを返す document.writeln(Math.max(11,2)) // 2 pow(base,p) べき…

Stringオブジェクトのメンバ

indexOf(substr [,start]) 文字列前方(start+1文字)から部分文字列substrを検索 var str1 = "あいうえおあいうえお"; document.writeln(str1.indexOf("えお")); // 3 前から検索 document.writeln(str1.indexOf("えお",-5)); // 3 マイナスにしても0から?…

スライダーのプラグイン slick

色々便利なんだけど、 オートプレイ中に→STOP→別タブに移動→戻ってくる→また動き出しちゃう。というバグがある。【jQuery】高機能で実装も簡単なスライダー-slick.jsの使い方-再生・停止ボタンも付けてみました – Snaplog 今、タブを開いているかいないかを…

EditorConfigの設定

www.tam-tam.co.jpatom.ioeditorconfig.org

atom の設定メモ

qiita.comqiita.comqiita.comja.stackoverflow.comqiita.com

chrome extension 作成から公開までやってみました

今更ですが、chromeユーザーならほとんどの方が使っていると思う、chrome extension(拡張機能)を作成から公開までやってみました。 やりたかったこと →サイト構築時のメタチェック、でもソースを見るのは解りずらい、なのでボタンをポチっと押したら、その…