localStorageをwrapしてくれるnpmパッケージ、store.jsについて調べた - 君は心理学者なのか？
いきさつ localStrageを使う機会があった。 今までは普通にlocalStrageを使っていたが、 npmにlocalStrageのwrapperがあるのを職場の人が見つけてくれた。 github.com 気になったので少し調べてみた。 概要 ブラウザやそのバージョンによってlocalStrageの扱いが異なり、 要件によっては対応が必要になることがある。 store.jsはその差異を吸収してくれる。 （ただ、localStrageはIE8以上なら搭載されているのでだいたい大丈夫） また、pluginを導入することにより、 通常のlocalStrageにない機能を追加できたりする。 標準との違い chrome標準 localStorage.setItem('myCat', 'Tom'); // undefined store.js import store from 'store'
scriptのasync属性とdefer属性の挙動 - NullPointer's
MDNによるとscriptのdefer属性は この論理属性は、スクリプトを文書の解析完了後かつ DOMContentLoaded が発生する前に実行することをブラウザーに示します。 と書かれているが、文書の解析完了と言う言葉が具体的にどういう意味を持つのかわからない。非deferなスクリプトでDOM操作を行う場合、操作したい要素より後に読み込むか、DOMContentLoadedイベントハンドラで行うのが作法となっている。deferの文書の解析完了とはDOMに自由にアクセスして良いという意味と同義なのか、ちょっと確証がない。 この手の情報をネットでググってもお互いにコピペしてんじゃないかと思える判で押したような記事ばかり、まるで役に立たないので、自分で実際の挙動を調べた。結論はDOM操作してOKである。 default async defer 後続処理のブロック する しない しない 実行
JavaScript嫌いのES6入門～環境構築編～ - プログラムdeタマゴ
この記事を書いてる人のレベル 諸君 私はJavaScriptが嫌いだ 諸君 私はJavaScriptが嫌いだ 諸君 私はJavaScriptが大嫌いだ varが嫌いだ オーバーロードが無いのが嫌いだ prototypeが嫌いだ thisが嫌いだ 整数型がないのが嫌いだ 定数がないのが嫌いだ ファイルスコープがないのが嫌いだ ブロックスコープがないのが嫌いだ Chromeで IEで Firefoxで Opera最強伝説で Vivaldiで Edgeで この世界で行われるありとあらゆるJavaScriptが大嫌いだ 以下略 というわけで、私はかつてはJavaScriptが死ぬ程嫌い、いや、憎い頃もありました。 しかし、海外勢の美しいソースコードに感化され、今では立派にJavaScriptが大嫌いです。 var value = "value"; var flag = false; hoge();
Angular2/TypeScriptプロジェクトのコンパイルの仕組み | QUARTETCOM TECH BLOG
最近ようやく Angular & TypeScript でソースコードを書き始めました。型のおかげでどのような値が入る変数なのか推測しやすくなり、とても便利です。 さらに angular-cli を使うとターミナル上でプロジェクトやコンポーネントの雛形を作る事ができるため、同じようなコードを何度も繰り返し書かなくても良くなりました。 たったの3行で Angular のアプリケーションが動き出しブラウザに Welcome to app!! のテキストが表示されます。 何がどう動いているのか不思議に思いませんか？ 今回の記事は angular-cli のコマンドと設定を元に Angular + TypeScript のプロジェクトがブラウザ上で動作するまでに何が起こっているのかを順に解説していきます。 2017/07/21 追記 タイトルを Angular2 として公開していましたが、現在の最
(Babel 5における)ES6のモジュールを解説してみた - uehaj's blog
警告 以下でのモジュールの説明はトランスパイラであるBabel 5,6で動作を確認した振舞いについての記述です。2015年11月現時点で、ECMAScriptのモジュール仕様策定範囲は、本来の全体範囲のまだ一部であるとのことです。その状況でのBabelの実装は、良く言えば先行的、悪く言えば将来そのままである保証はなく、現時点でも他のES2015をサポートする処理系との間での相互運用の保証はありません。また、現時点でBabelのモジュール機能を使うこと自体にリスクがあるという意見もあります。CommonJS側からBabelが生成したモジュールをCommon JSモジュールとして読み込もうとしたときの互換の問題として、Babel5で可能だったことがBabel6では利用不可になる、といったことも起きているようです。 そこらへんを含めて解説されているこちらの資料が参考になります。 (2015/11
npmjs.com で著名ソフトウェアによく似た名前のマルウェアが大量に発見された - Islands in the byte stream
Malicious packages in npm. Here’s what to do | Ivan Akulov’s blog People found malicious packages in npm that work like real ones, are named similarly real ones, but collect and send your process environment to a third-party server when you install them 訳: 悪意のあるパッケージがnpmで発見された。それらは、実際のパッケージによく似た名前で同じように動くが、パッケージのインストール時にプロセスの環境変数を外部のサーバに送信する。 発見されたパッケージの一覧は元エントリをどうぞ。このようなマルウェアである偽パッケージの一例をあげると、 ba
最新版で学ぶwebpack 4入門 - BabelでES2017環境の構築(React, Three.js, jQueryのサンプル付き) - ICS MEDIA
最新版で学ぶwebpack 5入門 Babel 7でES2023環境の構築 (React, Vue, Three.js, jQueryのサンプル付き) ECMAScript 2015(略：ES2015)以上の言語仕様でJavaScriptを書くことが、昨今のウェブのフロントエンドエンジニアの基本テクニックです。しかし、ECMAScript 2015以上の仕様のJavaScriptで記述すると、Internet Explorer 11など古いブラウザでは動作しないこともあります。そこでBabelなどのトランスパイラと呼ばれるツールを使って、ES2015〜ES2023の仕様で記述したJavaScriptファイルを互換性のあるECMAScript 5に変換します。 トランスパイラとして一番有名なのが「Babel」というツールです。ただ、BabelにはECMAScript Modules（impo
phiary
はじめに 『form 値 取得』とかで検索すると for 文で一通りチェックして... jQuery で要素を取得して val() で... ってのがヒットしますよね? これらの方法でも全然問題ないんですが, ピュアな JavaScript でもわりとスマートに値を取得, 設定することができます. っということで今回は, フォーム系要素の値をピュアな JavaScript で取得, 設定する方法を一通りまとめてみました. よかったら参考にしてください. デモ まずはデモです. 一通り form を並べてそれぞれ設定, 取得を行っています. console に各要素の値が表示されているのがわかるかと思います. コード デモのコードです. HTML <form name='mainForm'> <div> <h3>text</h3> <input name='_text' type='text
Vue.js + ElectronでTwitterクライアントを作った - razokulover publog
Vue.jsとElectronでシンプルなTwitterクライアントを作った。 vue-twitter-client きっかけとしては一言で言うとフロントエンド周りの勉強。 2017年1~3月の振り返りにも書いた通り。 自分はモダンなフロントエンドの開発に疎かったので重い腰を上げてそろそろやるかという気持ちになって3月中頃くらいからはじめた。 Vue.jsについては2,3週間前くらいから触りはじめている。 Vue.jsはちゃんとしたSPAからフォームにちょいと味付けみたいな使い方もできたり小回りがきく。 個人的にはReactでの開発よりやりたいことが直感的に書ける気がしてるので使いやすいという印象。 とりあえず最初はTODOアプリやAPIを叩く小さなフィードを作って、次にNuxt.jsでSSRできるミニサイトを作ったりで大体使い方は覚えてきたというステータス。 ライブラリでいうとvuex,
[取り組み] フロントエンドでコーディングスピードをアップさせる６つの方法！と思って書いてたら30個も書いちゃった。 - YoheiM .NET
[取り組み] フロントエンドでコーディングスピードをアップさせる６つの方法！と思って書いてたら30個も書いちゃった。 こんにちは、@yoheiMuneです。 フロントエンドとしてHTML,CSS,JSを中心と開発を行うことを仕事にして早くも半年が経ちました。 最近はだいぶ効率的にコーディングが出来てきたとやっと実感してきたので、ブログにも自分のコーディングスピードアップのコツを書きたいと思います！ 「こんなのよりももっと良いのあるよ」などたくさんの感じる点があるかと思います。ぜひTwitterなどで教えて頂けると助かります。 コーディングをスピードアップする６つ＋αのポイント 自分が思うにコーディングをスピードアップする最も大切なポイントは以下ではないかと思います。 めんどくさいと感じること、そして改善に動くこと 幸い自分はかなりのめんどくさがり屋で、コーディング中も「これ手動！？」「マウ
![[取り組み] フロントエンドでコーディングスピードをアップさせる６つの方法！と思って書いてたら30個も書いちゃった。 - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/d5148c26b0ae2a3585b08c6cf755d68966d223de/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F225.jpg)
株式会社JIEC
Professional Service No.1基盤技術を中核にお客様に感動をもたらす 真のプロフェッショナルサービスを追求します セミナーイベントアフターレポート 概要 Think Japan 2018 アフターレポートを掲載しました。 展示内容 AI問い合わせ対応サービス「 manaBrain 」〜最初から賢く、どんどん賢く〜 連携技術No.1のJIECが提供するAPI公開のベストプラクティス セミナーイベントアフターレポート 概要 コールセンター/CRM デモ＆コンファレンス 2018 in 大阪 アフターレポートを掲載しました。 展示内容 AI問い合わせ対応サービス「 manaBrain 」〜最初から賢く、どんどん賢く〜
優秀なJavaScriptの開発者になるための5か条 | POSTD
(注記：7/15、いただいた翻訳フィードバックを元に記事を修正いたしました。) 子供の頃、私の興味は互いに関係性のない様々な分野に及んでいました。数学も歴史も大好きでした。 ルネッサンスマン 、つまり 博学者 と言う、複数の分野に秀でた人になりたいと思っていました。これはとても難しい課題で、私は突如として、器用貧乏な人になってしまう危機に直面したのです。 私は特定の分野に特化しなくては、と考え始めました。そうすればたとえルネッサンスマンにはなれなくても、少なくとも、器用貧乏にならなくても済むと思ったのです。どうしたらソフトウェア開発をするのに必要な広い知識を保ちながら、1つの分野で専門性を高めることができるのでしょうか。 この記事では、過去5年間、私が良いJavaScript開発者になるために使ったテクニックとリソースの概要をお伝えしようと思います。 最近の多くのWeb開発者は、ある共通の
ES6で末尾再帰呼び出しの最適化 - NullPointer's
ECMAScript 6thには仕様として末尾呼び出しの最適化が盛り込まれている（ECMAScript 2015 Language Specification14章の6）。そしてES 6thのコードをES 5thに変換するbabelは末尾再帰呼び出しの最適化を実装しているらしい。試してみた。 再帰といえば定番のフィボナッチ数の計算を末尾再帰で書いてみる。 function fib(n, a=0, b=1) { if (n < 1) { return a; } return fib(n-1, b, a+b); } このES 6thなコードをbabelでES 5thにトランスパイルしてみると… "use strict"; function fib(_x3) { var _arguments = arguments; var _again = true; _function: while (_a
AngularJS+enchant.js+CoffeeScriptで音ゲーを作ってGitHubPages上で公開しました - undefined
これなに？ 無料音ゲー flavabeats github.com ブラウザ上で遊べる音ゲーです。 ノートと呼ばれるオブジェクトが曲に合わせて落ちてくるのでターゲットに重なるタイミングでキーボードのZ,X,C,V,Bを押していくゲームです。 楽曲はCreativeCommonsのものを使用しています。 なんで作ったの？ Vue.jsやReactやAngularJSやAurelia.JSなどフレームワークが乱立するなか何か一つ使えるようにならないといけない気がしたので勉強用に始めました。（あとcocos2d-JSのAndroidデバッグが嫌になりましたので気分転換に)。最初はAngularJSより学習コストの低そうなVue.jsを触ろうかと思ったのでですが、Vue.jsにはルーティング機能がついていないということで結局AngularJSを触ってみることにしました。(書籍も買っちゃってたし。)
WEBページのコピー・ペースト・カット禁止の禁止 - それマグで！
コピー禁止とか意味ないと思うんですね。 HTMLのソースコードには書いてあるわけで。全くの無意味。 フォームにコピペ禁止の意味あるの？ コピー禁止の意味あるの？どうせメール送るんだろ？だったら２度も手作業で入れさせる意味。 スクリーンショット 2014-09-19 20.16.24 ETC 登録で発狂しそうになる。 なんだこの、すべての入力項目を２度入力させるのは、メアドパスワードETC番号なんでどれも２会入力（しかもコピペ禁止なんだ） ばかじゃないの。 というわけで、コピペ禁止の禁止 ["onpaste","oncopy","oncut"].forEach(function(e_name){ Array.apply(null, document.querySelectorAll("*["+e_name+"]") ).forEach(function(e){e[e_name]="retur
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
