PHP製の管理ツールで、CSVを生成してDLするシステムを作っていました。 データ量が多いとエラーになるということで調べたら、PHPのmax_input_varsにかかって居るのが原因でした。 そして、使っているサーバーがhetemlでmax_input_varsの上限を変えることが出…

A Blob object represents a file-like object of immutable, raw data. Blobs represent data that isn't necessarily in a JavaScript-native format. The File interface is based on Blob, inheriting blob functionality and expanding it to support f…

WordPressのカスタムフィールドで作っていたテキストエリアで部分的にボールドにしたいという要望がありました。 運用してる人的にHTML書いてくださいってのはハードル高そうだし、カスタムフィールドをWYSIWYGにするのは工数もかかるし自由に出来すぎるとwo…

リロードさせる関数があるので、gulpでwatchしている時など好きなタイミングでlocalhostをリロードさせることができるgulp-connectですが、リロードさせるタスクをまとめようとした時にチョットしたハマりどころが合ったのでメモ。 公式に書かれてるやり方 ‍…

gulpでサイト作る時のローカルサーバーに長らくgulp-webserverを使っていたのですが、CSSの変更時にhotreloadが上手く動作せず、リロードさせる関数も無いっぽかったので、reload関数が有り任意のタイミングでリロードさせることができるgulp-connectに乗り…

昔作ったgulpでpugとstylusコンパイルしてるだけのLPを更新で弄っていました。 gulpでwatchしてたプロセスを終了したら [23:55:48] The following tasks did not complete: default, watchHTML, watchCSS [23:55:48] Did you forget to signal async complet…

npm installせずにHTML表示できるnodeのサーバーを作ってみました。 server.js const http = require('http'); const fs = require('fs'); const path = require('path'); const port = 3000; const getType = (url) => { const extname = path.extname(url)…

ES2015で、scriptタグモのtyoeで指定できるモードにmoduleが追加されたようです。 script：グローバル名前空間を必要とする標準的なスクリプトのためのもの module：明示的なインポートとエクスポートを必要とする、モジュール化されたコードのためのもの sc…

node.jsでimport/exportで試そうとしてハマったのでメモ。 $ node -v v11.4.0 import / export を使っているファイルの拡張子は.mjsでないとエラー // moduleA.js export const hi = (name) => `Hi ${name}. `; // main.js import {hi} from './moduleA.js';…

webpackを調べていた時にwebpackのメリットとして 各モジュールを閉じたスコープにしてまとめてくれるので、モジュール名や変数名が被るのを気にする必要がなくなる というのがありました。 で、同じモジュール名だったりした時、インポートする側はどうする…

３年ほど山ごもりをしていて、浦島太郎状態なので、その間に進んだフロント周りのキャッチアップを ちょっとづつ進めています。 今回はwebpackについて、フリーな個人制作が多くgulpで何とかなるしと秘伝のタレ使いまわしていたのですが、JavaScriptのモジュ…

これはobniz Advent Calendar 201812日目の記事です。 はじめまして。 IoTデバイスを触ったり、回路作ったり自体が初めてのド素人です。 obnizのハンズオンに参加してJavaScriptSDKを使って"簡単に"LEDを光らせたりモーターを動かしたりができたので、調子に…

例えば次のようなテキストを "藤堂ユリカ\n一ノ瀬かえで\n神崎美月" "藤堂ユリカ 一ノ瀬かえで 神崎美月" のように置き換えたい時 JavaScriptにはreplaceAllのようなメソッドがないので、 const str = "藤堂ユリカ\n一ノ瀬かえで\n神崎美月"; str.replace("…

Session.sublime_session というファイルの"recent_workspaces"にプロジェクトのパスが保存されているので、不要なパスを削除すればOK

WordPressの投稿で別ウィンドウで開くリンクtarget="_blank"を作成すると、 <a href="{URL}" target="_blank" rel="noopener">LINK TEXT</a> のようなrel="noopener"属性を持ったaタグが出力されます。 rel="noopener" の意味 1. target="_blank" のセキュリティ上の脆弱性の問題を避ける Without this, the new …

CSSのプロパティリセットする時に使うやつ。 initialとinherit CSS書かない日が続くとどっちが何だっけ？ってなることがあるのでメモ。(メモすれば忘れにくくなる！かも initial は 初期化 英語で initial は「初めの、最初の、初期の」とか。 プログラムと…

Macのローカル環境だと画像のsrcで小文字でファイル名を指定していて、実際のファイルが大文字になってても表示されちゃったりするので、 うっかりPhotoshopとかでファイル名大文字にしてて大文字のまま画像書き出してコミットしちゃって、本番サーバーでpul…

BabelやWebpackとかを業務で使う機会がなくて、なんとなくな感じだったので自分の手動かして設定しながら試してみました。Babel 7になっていて検索で出てくる情報だとうまく行かなかったり試行錯誤したのでメモ。 Babelとは babel + webpack の構成で合わせ…

勤怠表から時給換算とか、01:30:00な経過時間フォーマットな表のデータを1.5とかに置き換えたい時 VALUE を使う VALUE Google スプレッドシートで認識される日付、時刻、番号の書式の文字列を数値に変換します。 VALUE("12:00:00") 出典: VALUE - ドキュメン…

前回までのあらすじ 非同期処理を平行に実行する場合はPromise.allやPromise.raceを使えばよいのですが、非同期処理で受け取った値を使って次の処理を行いたいなど順番(同期的)に実行したい場合のメモ Promise~thenでのメソッドチェーン たぶん一番正当なや…

前回のあらすじ 通常のPromiseを返す関数で明示的にresolve()、reject()をreturnしてないと関数の終わりまで実行されるのでは？と思い調べてみました。 明示的に resolve/reject がreturnされていない場合 function myFunc(a, b = 0) { return new Promise((…

JavaScriptを扱うにあたって避けては通れない道、Ajaxとかタイマーとかの非同期処理… ES7のawait/asyncを学ぶ方が良いのでしょうが、jQuery.deferred辺りで止まってしまっていると、いきなりawait/asyncは辛いので、Promiseをざっくり理解してawait/asyncに…

昔作ったサイトのメンテで久々にhomebrewで入れたローカル環境のApacheを起動しようとしたら次のようなエラーが出て起動できなくなっていました。 httpd: Syntax error on line 170 of /usr/local/etc/apache2/2.4/httpd.conf: Cannot load /usr/local/opt/p…

Macですが、いちおセキュリティソフトとしてカスペルスキーを入れていました。 カスペルスキーにアップデートで再起動しろと言われたので再起動したところ、Chromeで安息の地Twitterの画像やビデオ、だけでなくCSSまで読み込まなくなっていました。 読み込め…

テスト環境作ってて.htaccessを弄ってて誤って不要なページをhttpsにリダイレクトさせる設定にしてしまい、その後.htaccessを修正したのですが、Chromeで確認してると設定はないのに自動的にhttpsにリダイレクトされ続ける現象にハマってしまいました。 クッ…

金額とか、大きな数字を10,000のような３桁コンマ区切りにしたい時、セルに数字が入っているだけなら書式を変更すれば済みますが、合計: 10,000みたいにラベルを入れたいような時文字列になってしまうのでセルごと書式変更をすることができません。 例えばA1…

ES2015/ES6で追加されたアロー関数()=>{...}はthisを拘束できるのがメインだと思っているのですが、色々と省略した書き方ができるようで、まだ不慣れなのでライブラリとか参考のコード見てる時に何だっけ？となりがちだったので省略した書き方のメモ。 アロ…

ES2016/ES6でfor...ofが追加されたので改めてオブジェクトのループの方法を見直そうと思いました。 for..of for...of 文は、iterableオブジェクトに対して反復的な処理をするループを作成します（iterableオブジェクトには組み込みのString, Array, 例えば A…

ECMAScript2015 (ES2015 / ES6)で追加された、配列やオブジェクトを分割して変数に代入できる分割代入で色々エラーになってハマったのでメモ。 分割代入 Destructuring assignment 分割代入 - JavaScript | MDN とは // 配列 let [a, b, ...rest] = [10, 20,…

ここ数年田舎ちほー在住で月1ペースくらいで関東圏に行っていて仕事道具であるPC周りをバックパックに詰めて新幹線移動とゲストハウス滞在を繰り返していました。 その体験からPC持っての移動や宿泊時に便利だったものを４つ紹介したいと思います。(商品紹介…