グレーのグラデーションを作ったりして楽しむのに使えるんじゃないですか？ [...Array(254).keys()].map(i => { let hex = (i + 1).toString(16) if (hex.length < 2) { hex = `0${hex}` } // 省略形にできるやつは省略形にする if (hex.charAt(0) === hex.c…

11月3日に秋葉原UDXで行われた Vue Fes Japan 2018 に行ってきました。 私はオープニングから最後のセッションまでいたので、それぞれのセッションの感想を自分メモ的ではありますが簡潔に残しておきます。 Vue.js 作者 Evan You によるキーノート docs.goog…

去年ずっと手伝ってたプロダクトがグッドデザイン賞ベスト100を受賞したということで、前職の仲間に誘われるがままに祝賀会に参加してきた。（退職してもこういうのに誘ってくれるなんてありがたいね） 正直、ベスト100発表のときが長いし立ちっぱなしだしで…

9月7日付けで2年働いた株式会社グッドパッチをやめました。いろんな案件に関わらせてもらったのはもちろん、4月からリモート+時短勤務という実験的なこともやらせてもらって、本当にお世話になりました。みなさんはそういうの期待してるかもしれないですけど…

開発用のマシンを新調しました。今まで 13 inch しか使ったことがなかったし、メモリもせいぜい16GBくらいのマシンしか使ったことがなかったのでこんなにハイスペックなマシンを持つのは初めてで、興奮しています。お値段¥390,800(+税)と高かったけど、今の…

この記事は、社内向けに書いたけど、収まりきらなかったので、ブログに載せられるように編集を加えた、私なりのデザイン論についての記事です。 はじめに、私とデザインの関わり アシスタントエンジニアがなぜこんな話を？と思われるかもしれないのではじめ…

これやりたかったんだよね 2015年4月から新卒としてお世話になっていた現職ですが、6月末に退職することになりました。色々ありましたが、1月になっても内定が出ずふらふらしていた私を拾って色々チャレンジさせてくださったという点では本当に頭が上がりま…

先日クロージャの説明を求められて、堂々とスコープのことを説明をしてしまい、ウーン…違う…とさせてしまうという出来事がありました。 その場でクロージャの例についてお教え頂き、そのときは「クロージャってそういう意味なのか！」と納得した気になってい…

sass の &(アンパサンド) はとっても便利。 特に BEM やるときは、いちいち block や element を書かずに & で書き足していけばいいのでやりやすい。 例えば以下のようなコードをコンパイルすると .block{ display: block; &__element{ display: inline-bloc…

jQuery で便利なのは offset 系の処理だと思うんだけど、 offset 系の処理で最も頻発するのはスムーススクロールだと思ってる。 とりあえず何秒かごとにターゲットの場所までちょっとずつスクロールしていくだけという雑なコードを書いているんですがうまい…

ページの情報を json にまとめておいて、そこから情報を取ってきたり、出力場所をそれぞれのページで変えたりする場合、以下のようなやり方でできる。 meta の一部が違うとか、中身で共通する部分はあるけどそれぞれのページでユニークな部分が多いときに便…

git で画像も管理してて、多数の人（多数の環境）の間で編集しあってると、 編集してない画像ファイルが modifiy 済みみたいな挙動をして、git reset --hard しても元に戻らないみたいなことがある。さくっと！.gitattributes # Autodetect text files * tex…

NOW() した際に UTC になっていたので、JST にしようとしたところはまった。まず MySQL のタイムゾーンは複数ある。 mysql> SELECT @@system_time_zone, @@global.time_zone, @@session.time_zone;をするとわかります。@@system_time_zone はシステムタイム…

前回うまくいかなかった vagrant 上の PHP のアップグレード作業に再チャレンジしました。結果！ そして！ できた〜！！！手順！準備。古い php は消しておく yum remove php-*remi リポジトリの追加まずそもそも（前回から） remi ってなんやねん…って思っ…

ejs は embeddedjavascript というテンプレートエンジン。 gulp 用のパッケージもあるよ。www.npmjs.comHTML に組み込むような書き方なので、デザイナーさんなどと共有しやすいし、学習コストが低くて気に入っています。 外部ファイルの include や 変数の呼…

今更ってかんじですが… css 風の書き方で json みたいなデータを作れるようです。 書き方のサンプルはこんなかんじ $map: ( key1: value1, key2: value2, key3: value3, ); <|| 以下はマップを使ったカラーパレットの管理の例です。 >|| $colors: ( black: #…

隣り合う 2 つの配列要素に対して（左から右へ）同時に関数を適用し、単一の値にします。 by MDN以下の様な感じで、 配列の総計を出したりするのに使えます var sum =function(arr){ var value = arr.reduce(function(a,b){ return a+b; }); return value; }…

普通に作った .gitignore はリポジトリ内で共有されてしまいます。 自分専用の環境設定ファイルなど、ローカル環境では使いたいけど、 リポジトリ全体では共有したくないものなどは .git/info/exclude に記述することで、管理から除外されます。 ただし、 so…

以前の記事の通り、 $ sudo yum -y install phpと、 yum で 引っ張ってくると php 5.3系がインストールされてしまいますね。これを参考にして5.5系をインストールしてみようとしたところ、どうもうまくいかない。 $ php --versionするとちゃんと5.5系が入っ…

facebook ogp のキャッシュが何を試しても消えない。試したこと debugger POST する ページ自体を削除してみたけどキャッシュは残ってる og:url 末尾に / ついてる というか、 debugger では正しく meta 情報が拾われてるような表示をされてるんだが、 share…

前に書いた browserify の記事、これで $ は使えるようになるんですが、 plug-in を使おうとするとこのままだとできない。 そこで必要になるのが "browserify-shim" というもので、こいつを npm install したのち、 package.json に以下を追加。 { ~略~ "bro…

gulp-ruby-sass は src 部分に配列とかグローバル(*)を使うことが出来ないので、異なる scss ファイルを出力したい場合は複数のタスクを作るしかないと思っていたが、 以下のような方法で source をわけてあげることで複数の scss をコンパイル出来る。 //so…

ちょっと前から話題の browserify を導入してみました。 browserify とは？ javascript で require ができるようになる。 jquery だとか、その他いろいろなライブラリを使っていると、その依存関係を考慮して html 順番に読み込ませたり、 あるいは順番に co…

というわけなのでgulp-run-sequenceを使っていたところは、run-sequenceに移行しましょう。run-sequencewww.npmjs.comgulpfile.jsの書き方は全く一緒。

この記事は主に以下の記事を参考にしています。bitsofco.de viewportとは？ viewportを基本にした相対的な単位です。 vw, vh, vmin, vmax の4つがあります。 名前 単位 意味 viewport width vw ブラウザのviewportの横幅の1/100 viewport height vh ブラウザ…

条件 シングルページ ビジュアル重視 スクロールアクション Goodmoods | Where inspiration meets e-shopping Phases Magazine 条件 シングルページ width: 100%; Lunar Gravity | We craft unique digital experiences throughout the universe. 例外 table…

git コマンド詳しくなくて恐縮ですが最近利用し始めたので自分用メモに残しておく ブランチ間の差分をファイル名だけで出力する git diff --name-only ブランチ1 ブランチ2 ブランチ間の差分をファイル名+ステータスで出力する git diff --name-status ブラ…

お恥ずかしながら、役職名の中にエンジニアって単語が入ってるのに git は sourcetree で使ってる。 git コマンドもあんまり詳しくないし…sourcetree で git flow というブランチ管理をするにあたってのメモです。まずmasterがあります。 新しい案件Aが入っ…

以前にも調べた話題ですが PHP省略タグについて - 新しい日記これをOn Offさせる方法について。php.iniをいじってサーバ全体について設定する方法 /etc/の中にphp.iniがあるので、その中をいじる short_open_tag = Off //省略タグ使用不可あるいは short_ope…

良記事！！！1理解しておきたい、CSSによるインラインレイアウトの仕組み（font-size／line-height編）Inline Layout─Frontrend Conferencehtml5experts.jp2 https://html5experts.jp/takazudo/13464/3 https://html5experts.jp/takazudo/13592/4 理解してお…