https://b.hatena.ne.jp/taka-jun/javascript/ javascriptに関するtaka-junのはてなブックマーク (86) https://tomoya.hatenadiary.org/entry/20160403/1459665374 taka-jun 2016-04-04T04:39:29Z react javascript 1925 <blockquote cite="https://tomoya.hatenadiary.org/entry/20160403/1459665374" title="10年のツケを支払ったフロント界隈におけるJavaScript開発環境（2016年4月現在）。 - 日々、とんは語る。"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Ftomoya.hatenadiary.org%2Fentry%2F20160403%2F1459665374" alt="" /> <a href="https://tomoya.hatenadiary.org/entry/20160403/1459665374">10年のツケを支払ったフロント界隈におけるJavaScript開発環境（2016年4月現在）。 - 日々、とんは語る。</a></cite><p><a href="https://tomoya.hatenadiary.org/entry/20160403/1459665374"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/24470bb43c0478bf97eef447c03530e38adbb4e9/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fcdn.image.st-hatena.com%2Fimage%2Fscale%2F06555be2eb3dac1b88613f93a434dd6ca9d50d12%2Fbackend%3Dimagemagick%3Bversion%3D1%3Bwidth%3D1300%2Fhttp%253A%252F%252Ff.st-hatena.com%252Fimages%252Ffotolife%252Ft%252Ftomoya%252F20160403%252F20160403141536_original.png" alt="10年のツケを支払ったフロント界隈におけるJavaScript開発環境（2016年4月現在）。 - 日々、とんは語る。" title="10年のツケを支払ったフロント界隈におけるJavaScript開発環境（2016年4月現在）。 - 日々、とんは語る。" class="entry-image" /></a></p><p>2015年はCSSが普及した以来となる10年に1度のフロントエンド大変革期で、それまでのツケが一気に回ってきたと個人的に感じていました。目まぐるしく状況が変化していきましたが、2016年になり、個人的にだいぶ落ち着いてきたと感じているので、ここらへんでまとめておきたい思います。 最初に結論を書いておくと、 『Rea...</p><p><a href="https://b.hatena.ne.jp/entry/s/tomoya.hatenadiary.org/entry/20160403/1459665374"><img src="https://b.hatena.ne.jp/entry/image/https://tomoya.hatenadiary.org/entry/20160403/1459665374" alt="はてなブックマーク - 10年のツケを支払ったフロント界隈におけるJavaScript開発環境（2016年4月現在）。 - 日々、とんは語る。" title="はてなブックマーク - 10年のツケを支払ったフロント界隈におけるJavaScript開発環境（2016年4月現在）。 - 日々、とんは語る。" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/tomoya.hatenadiary.org/entry/20160403/1459665374"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> http://pathgather.github.io/please-wait/ taka-jun 2015-01-05T02:03:23Z javascript webdesign 25 <blockquote cite="http://pathgather.github.io/please-wait/" title="PleaseWait | A Loading Page for your SPA by Pathgather"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fpathgather.github.io%2Fplease-wait%2F" alt="" /> <a href="http://pathgather.github.io/please-wait/">PleaseWait | A Loading Page for your SPA by Pathgather</a></cite><p><a href="http://pathgather.github.io/please-wait/"><img src="" alt="PleaseWait | A Loading Page for your SPA by Pathgather" title="PleaseWait | A Loading Page for your SPA by Pathgather" class="entry-image" /></a></p><p>PleaseWait.js A simple library to show your users a beautiful splash page while your application loads. Launch demo To Use Step 1: Install bower install please-wait npm install please-wait Step 2: Include in your HTML Include the please-wait.css file in your &lt;head&gt; tag/in your normal workflow. Yo...</p><p><a href="https://b.hatena.ne.jp/entry/pathgather.github.io/please-wait/"><img src="https://b.hatena.ne.jp/entry/image/http://pathgather.github.io/please-wait/" alt="はてなブックマーク - PleaseWait | A Loading Page for your SPA by Pathgather" title="はてなブックマーク - PleaseWait | A Loading Page for your SPA by Pathgather" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/pathgather.github.io/please-wait/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://www.slideshare.net/slideshow/effective-web-performance-tuning-for-smartphone/42750122 taka-jun 2014-12-18T07:51:01Z performance smartphone mobile JavaScript android 421 <blockquote cite="https://www.slideshare.net/slideshow/effective-web-performance-tuning-for-smartphone/42750122" title="Effective web performance tuning for smartphone"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.slideshare.net%2Fslideshow%2Feffective-web-performance-tuning-for-smartphone%2F42750122" alt="" /> <a href="https://www.slideshare.net/slideshow/effective-web-performance-tuning-for-smartphone/42750122">Effective web performance tuning for smartphone</a></cite><p><a href="https://www.slideshare.net/slideshow/effective-web-performance-tuning-for-smartphone/42750122"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/6501af2876248dcbf7e56f2874b72c4da3556efb/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fcdn.slidesharecdn.com%2Fss_thumbnails%2Feffectivewebperformancetuningforsmartphone-141216040451-conversion-gate01-thumbnail.jpg%3Fwidth%3D640%26height%3D640%26fit%3Dbounds" alt="Effective web performance tuning for smartphone" title="Effective web performance tuning for smartphone" class="entry-image" /></a></p><p>第三回DeNAゲーム開発勉強会の資料です。 https://atnd.org/events/59594</p><p><a href="https://b.hatena.ne.jp/entry/s/www.slideshare.net/slideshow/effective-web-performance-tuning-for-smartphone/42750122"><img src="https://b.hatena.ne.jp/entry/image/https://www.slideshare.net/slideshow/effective-web-performance-tuning-for-smartphone/42750122" alt="はてなブックマーク - Effective web performance tuning for smartphone" title="はてなブックマーク - Effective web performance tuning for smartphone" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.slideshare.net/slideshow/effective-web-performance-tuning-for-smartphone/42750122"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://www.chartjs.org/ taka-jun 2014-10-06T12:30:24Z javascript chart 726 <blockquote cite="https://www.chartjs.org/" title="Chart.js"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.chartjs.org%2F" alt="" /> <a href="https://www.chartjs.org/">Chart.js</a></cite><p><a href="https://www.chartjs.org/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/2fdfab5cef34822822b4ba3c2b8abf3f335022b6/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fwww.chartjs.org%2Fimg%2Fcover.png" alt="Chart.js" title="Chart.js" class="entry-image" /></a></p><p>New in 4.0 Colors plugin Default palette of Chart.js brand colors is available as a built-in time-saving zero-configuration plugin.</p><p><a href="https://b.hatena.ne.jp/entry/s/www.chartjs.org/"><img src="https://b.hatena.ne.jp/entry/image/https://www.chartjs.org/" alt="はてなブックマーク - Chart.js" title="はてなブックマーク - Chart.js" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.chartjs.org/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://t4t5.com/ taka-jun 2014-10-05T17:47:33Z javascript ui alert 138 <blockquote cite="https://t4t5.com/" title="T4T5"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Ft4t5.com%2F" alt="" /> <a href="https://t4t5.com/">T4T5</a></cite><p><a href="https://t4t5.com/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/6bb26f1aee685bed9502b3a150f47493d508950e/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Ft4t5.com%2Fimages%2Fog-banner.jpg" alt="T4T5" title="T4T5" class="entry-image" /></a></p><p>i’m Tristan i build things for the web i like tools that promote freedom and digital sovereignty you can find me on twitter, github and RSS</p><p><a href="https://b.hatena.ne.jp/entry/s/t4t5.com/"><img src="https://b.hatena.ne.jp/entry/image/https://t4t5.com/" alt="はてなブックマーク - T4T5" title="はてなブックマーク - T4T5" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/t4t5.com/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> http://usablica.github.io/intro.js/ taka-jun 2014-10-02T01:18:57Z javascript 213 <blockquote cite="http://usablica.github.io/intro.js/" title="Intro.js - Step-by-step guide and feature introduction for your website"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fusablica.github.io%2Fintro.js%2F" alt="" /> <a href="http://usablica.github.io/intro.js/">Intro.js - Step-by-step guide and feature introduction for your website</a></cite><p><a href="http://usablica.github.io/intro.js/"><img src="" alt="Intro.js - Step-by-step guide and feature introduction for your website" title="Intro.js - Step-by-step guide and feature introduction for your website" class="entry-image" /></a></p><p>No dependencies, fast and small 10KB JavaScript and 2.5KB CSS, that&#39;s all (minified, gzipped). User-friendly Navigate using keyboard or mouse. Easily change the themes for your website. Browser compatibility Works on Google Chrome, Mozilla Firefox, Opera, Safari and even Internet Explorer. Why us...</p><p><a href="https://b.hatena.ne.jp/entry/usablica.github.io/intro.js/"><img src="https://b.hatena.ne.jp/entry/image/http://usablica.github.io/intro.js/" alt="はてなブックマーク - Intro.js - Step-by-step guide and feature introduction for your website" title="はてなブックマーク - Intro.js - Step-by-step guide and feature introduction for your website" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/usablica.github.io/intro.js/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://coliss.com/articles/build-websites/operation/javascript/javascript-best-2014-sep.html taka-jun 2014-09-29T04:37:44Z jquery javascript webdesign 480 <blockquote cite="https://coliss.com/articles/build-websites/operation/javascript/javascript-best-2014-sep.html" title="[JS]最近のWebサイトで見かける面白い仕掛けや便利な機能を実装するスクリプトのまとめ"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fcoliss.com%2Farticles%2Fbuild-websites%2Foperation%2Fjavascript%2Fjavascript-best-2014-sep.html" alt="" /> <a href="https://coliss.com/articles/build-websites/operation/javascript/javascript-best-2014-sep.html">[JS]最近のWebサイトで見かける面白い仕掛けや便利な機能を実装するスクリプトのまとめ</a></cite><p><a href="https://coliss.com/articles/build-websites/operation/javascript/javascript-best-2014-sep.html"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/0fb2b69fc464184c7ff4989d78070781bd90be00/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201404%2F2014092904-01.png" alt="[JS]最近のWebサイトで見かける面白い仕掛けや便利な機能を実装するスクリプトのまとめ" title="[JS]最近のWebサイトで見かける面白い仕掛けや便利な機能を実装するスクリプトのまとめ" class="entry-image" /></a></p><p>最近のWebサイトでよく見かける面白い仕掛けのコンテンツやエフェクト、便利な機能を実装できるjQueryのプラグインやスクリプトを紹介します。 Midnight デモページ ロゴやヘッダなどをスクロール時に固定表示し、スクロールして表示されたコンテンツに応じて、固定エレメントのスタイルシートを変更させて表示するjQuer...</p><p><a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/javascript/javascript-best-2014-sep.html"><img src="https://b.hatena.ne.jp/entry/image/https://coliss.com/articles/build-websites/operation/javascript/javascript-best-2014-sep.html" alt="はてなブックマーク - [JS]最近のWebサイトで見かける面白い仕掛けや便利な機能を実装するスクリプトのまとめ" title="はてなブックマーク - [JS]最近のWebサイトで見かける面白い仕掛けや便利な機能を実装するスクリプトのまとめ" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/coliss.com/articles/build-websites/operation/javascript/javascript-best-2014-sep.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://lab.sugimototatsuo.com/2014/06/20-free-data-visualisation-tools/ taka-jun 2014-06-07T05:32:33Z data javascript visualization 97 <blockquote cite="https://lab.sugimototatsuo.com/2014/06/20-free-data-visualisation-tools/" title="データビジュアライゼーションをはじめるためのフリーのツール・情報源20選 – lab.sugimototatsuo.com"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Flab.sugimototatsuo.com%2F2014%2F06%2F20-free-data-visualisation-tools%2F" alt="" /> <a href="https://lab.sugimototatsuo.com/2014/06/20-free-data-visualisation-tools/">データビジュアライゼーションをはじめるためのフリーのツール・情報源20選 – lab.sugimototatsuo.com</a></cite><p><a href="https://lab.sugimototatsuo.com/2014/06/20-free-data-visualisation-tools/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/ecc5cb2cbbf838b4f02ae9883175af040bf793eb/backend=imagemagick;height=90;version=1;width=120/http%3A%2F%2Flab.sugimototatsuo.com%2Fwp%2Fwp-content%2Fuploads%2F2014%2F06%2Fwrangler.jpg" alt="データビジュアライゼーションをはじめるためのフリーのツール・情報源20選 – lab.sugimototatsuo.com" title="データビジュアライゼーションをはじめるためのフリーのツール・情報源20選 – lab.sugimototatsuo.com" class="entry-image" /></a></p><p>お知らせ (2015年9月30日） 日経ビッグデータ発行の『データプレゼンテーションの教科書』（2014年12月発売）の記事「データビジュアライゼーションのためのフリーツール厳選20」（P.102～105）において、本記事の翻訳文が盗用され、改変の過程で誤訳が生じていました。詳しくは下記リンクをご参照ください。 『データプ...</p><p><a href="https://b.hatena.ne.jp/entry/s/lab.sugimototatsuo.com/2014/06/20-free-data-visualisation-tools/"><img src="https://b.hatena.ne.jp/entry/image/https://lab.sugimototatsuo.com/2014/06/20-free-data-visualisation-tools/" alt="はてなブックマーク - データビジュアライゼーションをはじめるためのフリーのツール・情報源20選 – lab.sugimototatsuo.com" title="はてなブックマーク - データビジュアライゼーションをはじめるためのフリーのツール・情報源20選 – lab.sugimototatsuo.com" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/lab.sugimototatsuo.com/2014/06/20-free-data-visualisation-tools/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://ricostacruz.com/jquery.transit/ taka-jun 2014-04-28T07:49:01Z jquery css JavaScript animation 416 <blockquote cite="https://ricostacruz.com/jquery.transit/" title="Transit - CSS transitions and transformations for jQuery"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fricostacruz.com%2Fjquery.transit%2F" alt="" /> <a href="https://ricostacruz.com/jquery.transit/">Transit - CSS transitions and transformations for jQuery</a></cite><p><a href="https://ricostacruz.com/jquery.transit/"><img src="" alt="Transit - CSS transitions and transformations for jQuery" title="Transit - CSS transitions and transformations for jQuery" class="entry-image" /></a></p><p>Upgrading notes Upgrading from an older version? Transit should be mostly backward-compatible. See the change log for notes. Development version You may also download the development version which has spaces and comments preserved. Curious to see how it&#39;s made? See the annotated source code!</p><p><a href="https://b.hatena.ne.jp/entry/s/ricostacruz.com/jquery.transit/"><img src="https://b.hatena.ne.jp/entry/image/https://ricostacruz.com/jquery.transit/" alt="はてなブックマーク - Transit - CSS transitions and transformations for jQuery" title="はてなブックマーク - Transit - CSS transitions and transformations for jQuery" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/ricostacruz.com/jquery.transit/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://webya.opdsgn.com/tools/jquerypluginforsinglepage/ taka-jun 2014-02-23T02:38:08Z jquery JavaScript 599 <blockquote cite="https://webya.opdsgn.com/tools/jquerypluginforsinglepage/" title="シングルページなサイトをデザインする上で、知っておいて損は無いかもしれないプラグインとか色々！ | バンクーバーのうぇぶ屋"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwebya.opdsgn.com%2Ftools%2Fjquerypluginforsinglepage%2F" alt="" /> <a href="https://webya.opdsgn.com/tools/jquerypluginforsinglepage/">シングルページなサイトをデザインする上で、知っておいて損は無いかもしれないプラグインとか色々！ | バンクーバーのうぇぶ屋</a></cite><p><a href="https://webya.opdsgn.com/tools/jquerypluginforsinglepage/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/fad78738e46a76e8b2b00b7fccb902eb535b3aa3/backend=imagemagick;height=90;version=1;width=120/http%3A%2F%2Fwebya.opdsgn.com%2Fwp-content%2Fuploads%2F2014%2F02%2F71a71e20dd62f7d7e1f4aaec133f133d2-1.jpg" alt="シングルページなサイトをデザインする上で、知っておいて損は無いかもしれないプラグインとか色々！ | バンクーバーのうぇぶ屋" title="シングルページなサイトをデザインする上で、知っておいて損は無いかもしれないプラグインとか色々！ | バンクーバーのうぇぶ屋" class="entry-image" /></a></p><p>最近多いですねー、1ページで完結するタイプのサイト。One Page Loveのサイトなんかから、シングルページの事例も大量に見ることが出来ますし、パララックスやらフリップ型のコンテンツやら、なんか色々出てきてて着いて行くのがやっとです… でも実際シングルページをつくろうとすると、え？何これどうなってんの？って...</p><p><a href="https://b.hatena.ne.jp/entry/s/webya.opdsgn.com/tools/jquerypluginforsinglepage/"><img src="https://b.hatena.ne.jp/entry/image/https://webya.opdsgn.com/tools/jquerypluginforsinglepage/" alt="はてなブックマーク - シングルページなサイトをデザインする上で、知っておいて損は無いかもしれないプラグインとか色々！ | バンクーバーのうぇぶ屋" title="はてなブックマーク - シングルページなサイトをデザインする上で、知っておいて損は無いかもしれないプラグインとか色々！ | バンクーバーのうぇぶ屋" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/webya.opdsgn.com/tools/jquerypluginforsinglepage/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://morizyun.github.io/blog/javascript-learning-tech-yourself_01/ taka-jun 2014-01-25T14:29:29Z javascript programming 892 <blockquote cite="https://morizyun.github.io/blog/javascript-learning-tech-yourself_01/" title="JavaScript 徹底入門のための資料＆書籍まとめ - 酒と泪とRubyとRailsと"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fmorizyun.github.io%2Fblog%2Fjavascript-learning-tech-yourself_01%2F" alt="" /> <a href="https://morizyun.github.io/blog/javascript-learning-tech-yourself_01/">JavaScript 徹底入門のための資料＆書籍まとめ - 酒と泪とRubyとRailsと</a></cite><p><a href="https://morizyun.github.io/blog/javascript-learning-tech-yourself_01/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/81d72e1f2a24e979660376b9780bd73233cb7dc8/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fmorizyun.github.io%2Fimg%2Fog_image.png" alt="JavaScript 徹底入門のための資料＆書籍まとめ - 酒と泪とRubyとRailsと" title="JavaScript 徹底入門のための資料＆書籍まとめ - 酒と泪とRubyとRailsと" class="entry-image" /></a></p><p>JavaScriptはブラウザから簡単に使えるし、jQuery Pluginも簡単に追加できるので、つい基礎をおろそかにしたまま使っていて、ちょっと凝ったことをしようとした時にいつもハマっていました。ということで今回は、独習JavaScriptの第二版を購入して読み進めつつ、ネットのお勧めのドキュメントを見て、補足しながら勉強し...</p><p><a href="https://b.hatena.ne.jp/entry/s/morizyun.github.io/blog/javascript-learning-tech-yourself_01/"><img src="https://b.hatena.ne.jp/entry/image/https://morizyun.github.io/blog/javascript-learning-tech-yourself_01/" alt="はてなブックマーク - JavaScript 徹底入門のための資料＆書籍まとめ - 酒と泪とRubyとRailsと" title="はてなブックマーク - JavaScript 徹底入門のための資料＆書籍まとめ - 酒と泪とRubyとRailsと" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/morizyun.github.io/blog/javascript-learning-tech-yourself_01/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://speakerdeck.com/1000ch/brush-up-your-coding taka-jun 2013-12-08T13:43:02Z JavaScript HTML Coding 14 <blockquote cite="https://speakerdeck.com/1000ch/brush-up-your-coding" title="Brush up your Coding"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fspeakerdeck.com%2F1000ch%2Fbrush-up-your-coding" alt="" /> <a href="https://speakerdeck.com/1000ch/brush-up-your-coding">Brush up your Coding</a></cite><p><a href="https://speakerdeck.com/1000ch/brush-up-your-coding"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/17c9ef68afed5cf8f0cf1c4daf393f97b3190bc7/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Ffiles.speakerdeck.com%2Fpresentations%2F876fcb001e760131f03e7e1022f85296%2Fslide_0.jpg%3F2160818" alt="Brush up your Coding" title="Brush up your Coding" class="entry-image" /></a></p><p>2013/10/23に開催されたHTML5BeginnersのBrush up your Codingのセッションの資料です。</p><p><a href="https://b.hatena.ne.jp/entry/s/speakerdeck.com/1000ch/brush-up-your-coding"><img src="https://b.hatena.ne.jp/entry/image/https://speakerdeck.com/1000ch/brush-up-your-coding" alt="はてなブックマーク - Brush up your Coding" title="はてなブックマーク - Brush up your Coding" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/speakerdeck.com/1000ch/brush-up-your-coding"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://koba04.hatenadiary.org/entry/20131128/1385568428 taka-jun 2013-12-05T14:19:46Z javascript TDD test web 376 <blockquote cite="https://koba04.hatenadiary.org/entry/20131128/1385568428" title="Webアプリケーションのテストを書くときに考えていること - 車輪を再発明 / koba04の日記"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fkoba04.hatenadiary.org%2Fentry%2F20131128%2F1385568428" alt="" /> <a href="https://koba04.hatenadiary.org/entry/20131128/1385568428">Webアプリケーションのテストを書くときに考えていること - 車輪を再発明 / koba04の日記</a></cite><p><a href="https://koba04.hatenadiary.org/entry/20131128/1385568428"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/94f41459c86052f08cf874efab32ecca8ad96221/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fcdn.image.st-hatena.com%2Fimage%2Fscale%2Fff2ba02cd19963f769345519ef59b819f0f81071%2Fbackend%3Dimagemagick%3Bversion%3D1%3Bwidth%3D1300%2Fhttps%253A%252F%252Fcdn-ak.f.st-hatena.com%252Fimages%252Ffotolife%252Fk%252Fkoba04%252F20131128%252F20131128010217.png" alt="Webアプリケーションのテストを書くときに考えていること - 車輪を再発明 / koba04の日記" title="Webアプリケーションのテストを書くときに考えていること - 車輪を再発明 / koba04の日記" class="entry-image" /></a></p><p>テストを書く目的 自分の書いたコードが意図した通りに動いてるか確認するために書くのですが、自分が楽をするためと他の人のために書いてます。 自分が楽するため Webアプリの場合、実装した機能がちゃんと動作するかを確認するために何度もブラウザポチポチしてというのは時間がかかります。なのでその回数をなるべく...</p><p><a href="https://b.hatena.ne.jp/entry/s/koba04.hatenadiary.org/entry/20131128/1385568428"><img src="https://b.hatena.ne.jp/entry/image/https://koba04.hatenadiary.org/entry/20131128/1385568428" alt="はてなブックマーク - Webアプリケーションのテストを書くときに考えていること - 車輪を再発明 / koba04の日記" title="はてなブックマーク - Webアプリケーションのテストを書くときに考えていること - 車輪を再発明 / koba04の日記" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/koba04.hatenadiary.org/entry/20131128/1385568428"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://www.moongift.jp/2013/11/maplace-js-%E8%BB%BD%E9%87%8F%E3%81%AAjquery-%C3%97-google%E3%83%9E%E3%83%83%E3%83%97%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA/ taka-jun 2013-11-28T15:26:22Z map jquery javascript 136 <blockquote cite="https://www.moongift.jp/2013/11/maplace-js-%E8%BB%BD%E9%87%8F%E3%81%AAjquery-%C3%97-google%E3%83%9E%E3%83%83%E3%83%97%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA/" title="Maplace.js - 軽量なjQuery × Googleマップライブラリ MOONGIFT"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.moongift.jp%2F2013%2F11%2Fmaplace-js-%25E8%25BB%25BD%25E9%2587%258F%25E3%2581%25AAjquery-%25C3%2597-google%25E3%2583%259E%25E3%2583%2583%25E3%2583%2597%25E3%2583%25A9%25E3%2582%25A4%25E3%2583%2596%25E3%2583%25A9%25E3%2583%25AA%2F" alt="" /> <a href="https://www.moongift.jp/2013/11/maplace-js-%E8%BB%BD%E9%87%8F%E3%81%AAjquery-%C3%97-google%E3%83%9E%E3%83%83%E3%83%97%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA/">Maplace.js - 軽量なjQuery × Googleマップライブラリ MOONGIFT</a></cite><p><a href="https://www.moongift.jp/2013/11/maplace-js-%E8%BB%BD%E9%87%8F%E3%81%AAjquery-%C3%97-google%E3%83%9E%E3%83%83%E3%83%97%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/bbde08befb34842ed8b5b8b8da0e0719531f0019/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fs3-ap-northeast-1.amazonaws.com%2Fmoongift%2Fattaches%2F11825%2Flist.%3F1385004864" alt="Maplace.js - 軽量なjQuery × Googleマップライブラリ MOONGIFT" title="Maplace.js - 軽量なjQuery × Googleマップライブラリ MOONGIFT" class="entry-image" /></a></p><p>Googleマップをプログラマブルに組み込むのに良さそうです。 GoogleマップはAPIの多彩さ、機能の柔軟さもあって様々なサービスで使われています。位置情報や地図を扱おうと思ったら一番に考えるのではないでしょうか。 そんなGoogleマップをさらに手軽に使えるようにしてくれるライブラリがMaplace.jsです。機能は限られ...</p><p><a href="https://b.hatena.ne.jp/entry/s/www.moongift.jp/2013/11/maplace-js-%E8%BB%BD%E9%87%8F%E3%81%AAjquery-%C3%97-google%E3%83%9E%E3%83%83%E3%83%97%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA/"><img src="https://b.hatena.ne.jp/entry/image/https://www.moongift.jp/2013/11/maplace-js-%E8%BB%BD%E9%87%8F%E3%81%AAjquery-%C3%97-google%E3%83%9E%E3%83%83%E3%83%97%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA/" alt="はてなブックマーク - Maplace.js - 軽量なjQuery × Googleマップライブラリ MOONGIFT" title="はてなブックマーク - Maplace.js - 軽量なjQuery × Googleマップライブラリ MOONGIFT" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.moongift.jp/2013/11/maplace-js-%E8%BB%BD%E9%87%8F%E3%81%AAjquery-%C3%97-google%E3%83%9E%E3%83%83%E3%83%97%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> http://blog.livedoor.jp/sasata299/archives/51891797.html taka-jun 2013-05-22T13:41:51Z javascript jquery tutorial 856 <blockquote cite="http://blog.livedoor.jp/sasata299/archives/51891797.html" title="実際のサイト上で動作するチュートリアルが簡単に作れるIntro.jsが便利すぎる件 - (ﾟ∀ﾟ)o彡 sasata299&#39;s blog"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fblog.livedoor.jp%2Fsasata299%2Farchives%2F51891797.html" alt="" /> <a href="http://blog.livedoor.jp/sasata299/archives/51891797.html">実際のサイト上で動作するチュートリアルが簡単に作れるIntro.jsが便利すぎる件 - (ﾟ∀ﾟ)o彡 sasata299&#39;s blog</a></cite><p><a href="http://blog.livedoor.jp/sasata299/archives/51891797.html"><img src="" alt="実際のサイト上で動作するチュートリアルが簡単に作れるIntro.jsが便利すぎる件 - (ﾟ∀ﾟ)o彡 sasata299&#39;s blog" title="実際のサイト上で動作するチュートリアルが簡単に作れるIntro.jsが便利すぎる件 - (ﾟ∀ﾟ)o彡 sasata299&#39;s blog" class="entry-image" /></a></p><p>2013年05月08日18:21 JavaScript 実際のサイト上で動作するチュートリアルが簡単に作れるIntro.jsが便利すぎる件 さて、先日簡単なチュートリアル作ろうと思ったんですが、どうやるのが良いのかなーと思って悩んでました。キャプチャ取ってそこに説明文を書いて…ってしてもいいんですけど、キャプチャだと一部分なのでサ...</p><p><a href="https://b.hatena.ne.jp/entry/blog.livedoor.jp/sasata299/archives/51891797.html"><img src="https://b.hatena.ne.jp/entry/image/http://blog.livedoor.jp/sasata299/archives/51891797.html" alt="はてなブックマーク - 実際のサイト上で動作するチュートリアルが簡単に作れるIntro.jsが便利すぎる件 - (ﾟ∀ﾟ)o彡 sasata299&#39;s blog" title="はてなブックマーク - 実際のサイト上で動作するチュートリアルが簡単に作れるIntro.jsが便利すぎる件 - (ﾟ∀ﾟ)o彡 sasata299&#39;s blog" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/blog.livedoor.jp/sasata299/archives/51891797.html"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://beatsync.net/main/log20130428/ taka-jun 2013-05-13T15:05:02Z javascript json command jq 566 <blockquote cite="https://beatsync.net/main/log20130428/" title="jqコマンドが実は高性能すぎてビビッた話 - beatsync.net"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fbeatsync.net%2Fmain%2Flog20130428%2F" alt="" /> <a href="https://beatsync.net/main/log20130428/">jqコマンドが実は高性能すぎてビビッた話 - beatsync.net</a></cite><p><a href="https://beatsync.net/main/log20130428/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/dbeed7f880f611c979fa2a13844386c87643015f/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fbeatsync.net%2Fimages%2Fogp-default.png" alt="jqコマンドが実は高性能すぎてビビッた話 - beatsync.net" title="jqコマンドが実は高性能すぎてビビッた話 - beatsync.net" class="entry-image" /></a></p><p>GWが始まりましたが、鎌倉のGWは観光客多すぎて逆に住民はげんなりして外に出なくなる感じです。とはいえ路地まで観光客が攻め込んでくることは少ないので、路地を散歩する分には天気がよくていい感じですね。ちなみに人力車のおにーさんはそういう味のある路地を知り尽くしているので人力車で移動するのはそこそこオス...</p><p><a href="https://b.hatena.ne.jp/entry/s/beatsync.net/main/log20130428/"><img src="https://b.hatena.ne.jp/entry/image/https://beatsync.net/main/log20130428/" alt="はてなブックマーク - jqコマンドが実は高性能すぎてビビッた話 - beatsync.net" title="はてなブックマーク - jqコマンドが実は高性能すぎてビビッた話 - beatsync.net" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/beatsync.net/main/log20130428/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://www.testcording.com/ taka-jun 2012-11-06T12:38:10Z javascript 2969 <blockquote cite="https://www.testcording.com/" title="TEST CORDING » Sassの@functionの使い方まとめ – プログラマブルな処理は@function"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.testcording.com%2F" alt="" /> <a href="https://www.testcording.com/">TEST CORDING » Sassの@functionの使い方まとめ – プログラマブルな処理は@function</a></cite><p><a href="https://www.testcording.com/"><img src="" alt="TEST CORDING » Sassの@functionの使い方まとめ – プログラマブルな処理は@function" title="TEST CORDING » Sassの@functionの使い方まとめ – プログラマブルな処理は@function" class="entry-image" /></a></p><p>Thank you for your trust!You will be redirected to System.io page in 15 seconds.</p><p><a href="https://b.hatena.ne.jp/entry/s/www.testcording.com/"><img src="https://b.hatena.ne.jp/entry/image/https://www.testcording.com/" alt="はてなブックマーク - TEST CORDING » Sassの@functionの使い方まとめ – プログラマブルな処理は@function" title="はてなブックマーク - TEST CORDING » Sassの@functionの使い方まとめ – プログラマブルな処理は@function" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.testcording.com/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> https://www.suzukikenichi.com/blog/6-ways-to-improve-page-speed-by-optimizing-javascript/ taka-jun 2012-11-06T12:22:53Z javascript 高速化 402 <blockquote cite="https://www.suzukikenichi.com/blog/6-ways-to-improve-page-speed-by-optimizing-javascript/" title="JavaScriptの読み込みを最適化してページの表示速度を高速化する6つの方法"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=https%3A%2F%2Fwww.suzukikenichi.com%2Fblog%2F6-ways-to-improve-page-speed-by-optimizing-javascript%2F" alt="" /> <a href="https://www.suzukikenichi.com/blog/6-ways-to-improve-page-speed-by-optimizing-javascript/">JavaScriptの読み込みを最適化してページの表示速度を高速化する6つの方法</a></cite><p><a href="https://www.suzukikenichi.com/blog/6-ways-to-improve-page-speed-by-optimizing-javascript/"><img src="https://cdn-ak-scissors.b.st-hatena.com/image/square/53598692c4bc328502c02f2434914e8f6da1942b/backend=imagemagick;height=90;version=1;width=120/https%3A%2F%2Fwww.suzukikenichi.com%2Fblog%2Fwp-content%2Fuploads%2Fsplash_1200_675.png" alt="JavaScriptの読み込みを最適化してページの表示速度を高速化する6つの方法" title="JavaScriptの読み込みを最適化してページの表示速度を高速化する6つの方法" class="entry-image" /></a></p><p>[対象: 中〜上級] 僕のブログではてブ数がいちばん多いのはウェブページを高速化するTIPSを解説した記事です（まだ読んでない人はぜひ読んでください！）。 その記事では高速化全般を扱っていましたが、今日の記事ではJavaScriptに的を絞って表示速度をスピードアップできる施策を6つ紹介します。 もともとはSearch Engi...</p><p><a href="https://b.hatena.ne.jp/entry/s/www.suzukikenichi.com/blog/6-ways-to-improve-page-speed-by-optimizing-javascript/"><img src="https://b.hatena.ne.jp/entry/image/https://www.suzukikenichi.com/blog/6-ways-to-improve-page-speed-by-optimizing-javascript/" alt="はてなブックマーク - JavaScriptの読み込みを最適化してページの表示速度を高速化する6つの方法" title="はてなブックマーク - JavaScriptの読み込みを最適化してページの表示速度を高速化する6つの方法" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/s/www.suzukikenichi.com/blog/6-ways-to-improve-page-speed-by-optimizing-javascript/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> http://www.designmap.info/tobewebdesigner/web_selfstudy/howtostudy_javascript/ taka-jun 2012-07-23T17:01:54Z javascript jquery 748 <blockquote cite="http://www.designmap.info/tobewebdesigner/web_selfstudy/howtostudy_javascript/" title="WebデザイナーのためのJavaScript、jQueryの勉強法 - DESIGNMAP"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Fwww.designmap.info%2Ftobewebdesigner%2Fweb_selfstudy%2Fhowtostudy_javascript%2F" alt="" /> <a href="http://www.designmap.info/tobewebdesigner/web_selfstudy/howtostudy_javascript/">WebデザイナーのためのJavaScript、jQueryの勉強法 - DESIGNMAP</a></cite><p><a href="http://www.designmap.info/tobewebdesigner/web_selfstudy/howtostudy_javascript/"><img src="" alt="WebデザイナーのためのJavaScript、jQueryの勉強法 - DESIGNMAP" title="WebデザイナーのためのJavaScript、jQueryの勉強法 - DESIGNMAP" class="entry-image" /></a></p><p>まったくのプログラミング初心者の方を対象にJavaScriptの独学方法をのべていきたい。今回とりあげるJavaScriptの勉強法はあくまでWebデザイナー向け（もしくはフロントエンドエンジニア向け）なので、Node.jsのようなサーバーサイドJavaScriptはとりあげていない。 JavaScriptとjQueryをどちらから勉強するべきか。今回...</p><p><a href="https://b.hatena.ne.jp/entry/www.designmap.info/tobewebdesigner/web_selfstudy/howtostudy_javascript/"><img src="https://b.hatena.ne.jp/entry/image/http://www.designmap.info/tobewebdesigner/web_selfstudy/howtostudy_javascript/" alt="はてなブックマーク - WebデザイナーのためのJavaScript、jQueryの勉強法 - DESIGNMAP" title="はてなブックマーク - WebデザイナーのためのJavaScript、jQueryの勉強法 - DESIGNMAP" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/www.designmap.info/tobewebdesigner/web_selfstudy/howtostudy_javascript/"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote> http://libro.tuyano.com/index2?id=52003 taka-jun 2012-05-27T12:09:41Z jquery javascript 599 <blockquote cite="http://libro.tuyano.com/index2?id=52003" title="初心者のためのjQueryプログラミング入門 - libro"><cite><img src="https://cdn-ak2.favicon.st-hatena.com/64?url=http%3A%2F%2Flibro.tuyano.com%2Findex2%3Fid%3D52003" alt="" /> <a href="http://libro.tuyano.com/index2?id=52003">初心者のためのjQueryプログラミング入門 - libro</a></cite><p><a href="http://libro.tuyano.com/index2?id=52003"><img src="" alt="初心者のためのjQueryプログラミング入門 - libro" title="初心者のためのjQueryプログラミング入門 - libro" class="entry-image" /></a></p><p>※ページが正常に表示されない場合 AddBlockなどの広告ブロックツールがONになっていると、ページの一部が表示されないことがあります。これらのツールをOFFにしてみてください。</p><p><a href="https://b.hatena.ne.jp/entry/libro.tuyano.com/index2?id=52003"><img src="https://b.hatena.ne.jp/entry/image/http://libro.tuyano.com/index2?id=52003" alt="はてなブックマーク - 初心者のためのjQueryプログラミング入門 - libro" title="はてなブックマーク - 初心者のためのjQueryプログラミング入門 - libro" border="0" style="border: none" /></a> <a href="https://b.hatena.ne.jp/entry/libro.tuyano.com/index2?id=52003"><img src="https://b.st-hatena.com/images/append.gif" border="0" alt="はてなブックマークに追加" title="はてなブックマークに追加" /></a></p></blockquote>