なんか最近Twitterとか職場でも「npmの機能でそんなのあったんだ」って言われること多いので、説明していきます。 ちなみにタイトルにとりあえず10選って書いたけど、あんまりたくさん思いついてないのに、10選って書いてしまったので最後の方は微妙かもしれません。 1. npm installは npm i でも同じことができる まぁ単純なショートカットですね。isntallとかtypoしてても空気読んでくれるんですが、短いほうがいいよねってことで。 # npm installって書くのも $ npm install socket.io #npm i って書くのも同じ $ npm i socket.io # ちなみに --saveは -S, --save-devは -D にできる $ npm i socket.io -S $ npm i mocha -Dショートカット小ネタ。 2. npm

HTML5 で追加された audio/video 属性によって、プラグインレスで動画や音声の再生が可能になったことはよく知られていますが、モバイル（スマホ）で、その再生タイミングの制約が厳しいことは案外知られていません。これは以前、当Blogでも HTML5 x Touch UI の UXを考える（補足） の User action event restrictions でもチラッと書きました。またしてもこの制約に苦しめられながら、なんとか解決策を見いだしたので、GW最中にも関わらず久しぶりのエントリーです。 まず、本家 Apple のドキュメントにも以下のようにあります。 iOS-Specific Considerations In Safari on iOS (for all devices, including iPad), where the user may be on a ce

※こちらの記事が400はてブ以上ついて、総合とテクノロジーの人気エントリーに入りました！ こんにちは。Kazutaka Shimizuです。 フリーランスとしてPM、エンジニアをやっています。 元々はWebマーケティングのコンサルタントをやっていましたが、独学でWeb開発を勉強してプロダクトを作って起業しました。 最近は創業した会社を離れ、フリーランスとして活動したり、プログラミングを独学した経験をこちらのツイッターで発信しています。 みなさんはGoogle Chromeのデベロッパーツールをご存知ですか？ ドットインストールなど一部のプログラミング学習サービスでは、デベロッパーツールのレッスンがあるなど、おそらく全く知らない人はかなり少ないと思います。 しかし、とにかく多機能なため、意外と便利な機能を使ったことがないというプログラミング初心者の方も多いようです。 僕自身、何度か自分のTw

webpackではv4から、modeというオプションが追加された。 それに伴いminimize（コードの圧縮）の設定の仕組みも変わったので、それについても書いていく。 以下のライブラリのバージョンで動作確認している。 webpack@4.1.0 webpack-cli@2.0.10 uglifyjs-webpack-plugin@1.2.2 license-info-webpack-plugin@1.0.0 react@16.2.0 2種類のmode modeは、productionとdevelopmentの2種類。 以下のように、webpackを実行する際に引数として渡すことで、設定できる。 "scripts": { "build": "webpack --mode production", "develop": "webpack --mode development" }, modeを

はじめに jQuery 3.0が正式リリースとなったので、最新のアップグレードガイドをまとめようと思います。 原文から一部わかりやすいように言い換えたり、補足したり、省略したりしています。 注意: 長いです。主要な変更点は前回の記事【翻訳まとめ】jQuery 3.0 alpha リリースノートを参照してください。 jQuery Core 3.0 Upgrade Guide 全体像 APIを綺麗にしてバグを修正しました。 - 一部破壊的な変更があり - 既に非推奨と公表していたAPIを削除 - ドキュメントにない隠しAPIの削除 - 特定の入力値に対する既存APIの振る舞いを修正 サポートブラウザ IE9 以上 Chrome, Edge, Firefox, Safariの最新版とそのひとつ前のバージョン Operaの最新版 iOS 7 以上のモバイルSafari Android 4.0以上

jQueryのコードといえば、$(document).ready(function() {}で書くのがお決まり。でもそのコードの書き方はもう古いかもしれません。 jQueryでreadyメソッドはDOMが完全にロードされたタイミングでコードを実行するように実装されていました。このメソッドはすべてのDOM要素が利用可能になった時点で所定の関数を実行するので、要素へ確実にアクセスしたり操作したりできます。 jQuery 3.0がリリースされるまでは、次のように無名関数で使うのが一般的でした。 $(document).ready(function() { // Handler for .ready() called. }); jQuery 3.0での「ready()」メソッドの変更 jQuery 3.0のリリースまでは、readyメソッドを呼び出す方法はいくつかありました。 document要素

◆ navigator.msSaveOrOpenBlob で対応させる ◆ blob を取得するのが xhr なのでクロスドメインでダウンロードはできない if(document.documentMode && navigator.msSaveOrOpenBlob){ window.addEventListener("click", function(eve){ var a = eve.target if(!a.hasAttribute("download")) return eve.preventDefault() var filename = a.getAttribute("download") var xhr = new XMLHttpRequest() xhr.open("GET", a.href) xhr.responseType = "blob" xhr.send() xhr.

サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。

今回は、ちょっと書籍出版の議論から離れて、テクニカルな話です。数式ばっかりです。 べき分布に従う乱数を発生させる方法は、前回紹介したようなシミュレーションをやろうと思うと必ず必要になりますが、あまり世間に出回っていないようですね。 kfkfさんからコメント欄で依頼があったように、もしかしたらけっこう、需要があるかもしれませんので、そのやり方について解説します。 結論から 細かい話が面倒だ、という方のために、まず結論から言いましょう。以下のような式をＥｘｃｅｌなり、その他言語にぶち込むと、べき分布に従う乱数が発生します。 ((M^(-b)-m^(-b))r+m^(-b))^(1/-b) ただし、 M:分布の上限値 m:分布の下限値(m>0) b:累積分布関数の指数→パレート指数などと呼ばれているもの(b>0) r:０以上１未満の一様分布乱数（ExcelのRAND関数、BASICならＲＮＤ関数

こんにちはこんにちは！！ Webプログラミングしてますか！ よく「PHPはセキュリティがダメ」とか言われてるよね。 でもそれって、べつにPHPが悪いんじゃなくて、 たぶん、セキュリティとかが、まだよくわからない人が多いだけなんじゃないかな。 がんばって勉強しようと思っても、なんだか難しい理屈が並んでいたりするしね…。 なので今日は、セキュリティ対策について、 「これだけやっとけば、わりと安全になるよ」ってことを、初心者むけに、大雑把に書いてみます！ 理屈がわからなくても、最初はコピペでも、 なにもやらないより、やったほうがきっとマシになる！ 1. XSS対策 動的なものを表示するとき、全部エスケープすればokです！ (NG) あなたの名前は <?= $name ?> ですね！ ↓ (OK) あなたの名前は <?= htmlspecialchars($name, ENT_QUOTES) ?>

先日書いたstaticおじさん達に伝えたい、手続き指向とオブジェクト指向の再利用の考え方の違いについて - 達人プログラマーを目指してのエントリに、なんと、みながわけんじ氏ご本人よりコメントを頂きました。もともとは一般のstaticおじさん達（英語ではstatic ojisansという感じ）に向けて書いたのですが、思いがけず、元祖staticおじさん（The static ojisanあるいはMister staticといった感じ)ご本人からのご意見をいただき、本当に嬉しく思います。 オブジェクト指向の再利用性と非オブジェクト指向の関数やサブルーチンとの違いを明確に示していないから いろいろ理屈を込めても無駄ではないでしょうか？ 誰かが作ったクラスを継承して再利用したところで、バグが少なくて、メンテナンス性がいいものができるでしょうか？ そんなものをあてにするより、天才が作ったクラスライブ

このところHTML5関連のモバイルアプリケーション開発について調べていて、先週の水曜日にはSwapSkills主催のイベント「jQueryモバイルで簡単！ スマートフォンサイト作成」に参加してjQuery Mobileについて勉強してきました。 jQuery Mobileとは、jQueryのプラグインとして利用するモバイルアプリケーション用のライブラリです。そしてその驚異的なまでの簡単さは、これから業務用のモバイルアプリケーションの作り方を一変させてしまう可能性を感じさせます。 jQuery Mobileの大きな特徴は次の3つです。 1）HTMLを書くだけでモバイルアプリケーションができてしまう 2）モバイルのユーザーインターフェイス対応の部品が多く揃っている 3）iOS、Android、WebOS、Windows Moblie、Symbianなどクロスプラットフォーム対応である 具体的な

ここ2-3年ほど、いわゆる非SQL系データベースがホットな話題になってきています。このムーブメントを総称して「NoSQL (Not-only SQL)」と呼ばれることが多いようです。まるでSQLを否定しているかのような誤解を招きやすい用語ですが、かといってキー・バリュー型データストアや列指向DBを総称できる他の呼び方もないので、このエントリではNoSQLという用語を使うことにします。 OracleやMySQLなどのSQLデータベースが成熟していく一方で、SQLデータベースを特徴づける弱点である柔軟性のなさ、堅牢さと引き換えに犠牲になった更新性能の低さ、スケールアウトの難しさなどから、「何でもかんでもRDB」から「目的に応じた永続化」が模索される流れになってきました。 時を同じくして、キャッシュサーバの世界でも、MemcachedのもつシンプルなAPIの使いやすさが評価される一方、LRUによ