諸般の事情により、俺の中にある漠然としたフロントエンド界隈のツールについてまとめたものを作ったので、一応SSにもあげておこう。Read less
俺的フロントエンド開発
諸般の事情により、俺の中にある漠然としたフロントエンド界隈のツールについてまとめたものを作ったので、一応SSにもあげておこう。Read less
JavaScript ベストプラクティス Part 1 | POSTD
ThinkfulはWeb/スマートフォンアプリの技術などを学ぶことができるオンラインスクール。プロフェッショナルな開発者がメンターとして1対1で伴走するため、他の同様サービスよりも続けることができる。 Javascript ベストプラクティス パート1 2つのパートに分けてお届けする「ベストプラクティス」のパート1では、MozillaのWebエバンジェリストであるChristian Heilmannが提供する人気のスライドショーから内容を抜粋しています。JavaScriptにはひどく扱いにくい特徴がいくつかありますが、それはこれまで以上にソフトウェア開発において重要になっています。この「ベストプラクティス」ではより読みやすく、効率の良いコードを書く手助けとなるサンプルコードやその使用例を紹介していきます。 もしWeb開発についてもっと学びたいと思うのであれば、私たちが提供しているフロントエ
JavaScript で DOM 要素の絶対座標を取得する方法 - tmlife
備忘録. スペニット的に使ってもらえれば幸いです. DOM 要素の絶値座標を取得する element.scrollTop とかだと親からの相対値になっちゃいます. getBoundingClientRect() を使えば絶対座標を取得できます. window.onload = function() { var element = document.getElementById('hoge'); // hoge というIDがついたやつを取得する var rect = element.getBoundingClientRect(); console.log(rect.left); // x座標(絶対座標) console.log(rect.top); // y座標(絶対座標) console.log(rect.width); // 幅 console.log(rect.height);
簡単にリッチなチャートが作れるC3.jsを使ってみた - undefined
C3.jsとは? C3.js | D3-based reusable chart library C3 はチャートに特化したビジュアライゼーションライブラリです。D3 のラッパーライブラリで、D3 の見た目の美しさやインタラクション性などの特徴を残しながら、チャートライブラリとして分かりやすいインターフェースを提供するという方針で開発を進めています。 http://blog.xica-inc.com/about-xica/member-12/ これはまではhighchart.jsを使っていましたが、商用利用は有償だったりするので今回C3.jsをいじってみます。 サンプル どんなチャートが作れるか以下のサンプルを見れば分かります。 C3.js | D3-based reusable chart library 使ってみる 音ゲーなどではゲーム終了時にスコアの軌跡がグラフとして描画されたりしま
Backbone.js ではじめるクライアントサイド MVC プログラミング | CYOKODOG
MVC と言えば Apache Struts をはじめとするサーバサイド・フレームワークを想像しますが、 今回は JavaScript による大規模開発の際に採用されるクライアントサイド MVC フレームワーク「Backbone.js」の使い方についてまとめてみました。 (厳密にはクライアントサイドの場合、MVC とは呼ばず MVVM とか MV* とか呼ばれてるようです。) 前提 Backbone.js の構成を簡単に言ってしまうと 単一データの管理を行うモデル 複数件のモデルの管理を行うコレクション 画面の管理を行うビュー の３つの主要モジュールを軸に構成されており、Underscore.js、jQuery(Zepto）に依存するかたちで動作するようになっています。 利用の際は、underscore.js、jquery.js、backbone.js の順で読み込みます。 //cdnjs
IE10 以下を切る場合の JavaScript チェックリスト - Qiita
この投稿は、 JavaScript Advent Calendar 18日目の記事です。 更新履歴 こちら をご覧下さい JavaScript の書き方をアップデートする JavaScript Good Parts で書かれているような JS の書き方は、古くなりつつある部分も多いです。 正直なところ、自分はあの本が「今でも」良書だとは思っていません。 初学者に勧めることもしません。まんべんなさと普遍性と客観性から「パーフェクト JavaScript」 を勧めています。 その頃と比べると、 JavaScript をとりまく環境は変わりました JavaScript の進化に合わせて書き方もアップデートしていくべきなので、今回は分かりやすいしきい値として 「IE10 以下を切れるとしたら」 という前提で、列挙してみます。 たとえば XHR2 や File API に依存したサービスをやる場合な
JavaScript デバッガの使用方法 | Firefoxの開発ツール
JavaScript デバッガ (JavaScript Debugger) JavaScriptのコードにブレークポイントを設定して、ステップ実行などを行えます。名前が同じで混同しそうですが、JavaScript Debugger (Venkman) ではありません。 SyntaxErrorなどのエラーが含まれるファイルは、デバッグできません。目的のファイルをJavaScript デバッガで見つけられない場合には、ブラウザコンソールでエラーが発生していないか確認します。 基本 起動方法 JavaScript デバッガは、そのデバッグ対象によって起動方法が異なります。それぞれ[Firefoxボタン]のメニューから、 Firefoxで実行しているWebコンテンツ … 【Web開発 → デバッガ】 Firefoxのシステム関連 (アドオンなど) … 【Web開発 → ブラウザツールボックス (ブ
[WEB開発] 私的な最近のおすすめサービス/ツール 14選 〜2014年版〜 - Qiita
社内のライトニングトーク用に Qiita:Team に書こうとしていたものですが、誰かの参考になればと思い、こちらにアップします。対象は 「エンタープライズ系ではない」「スクリプト言語系の」WEB系エンジニア/プログラマ です。 流行り廃り、好みがあると思いますが、これらは実際に、私が試してよかったものです。サービスであったりライブラリであったり粒度がバラバラではありますが、参考まで^^; 「最近の」というタイトルですが、私的に最近、活用しているという意味で、サービス自体は昔からあるものもあります。 ① Heroku Heroku を利用すると、Ruby(on Rails)、PHP、Node.js、Python 等のサーバ側アプリケーションをホスティングすることが出来ます。デプロイ方法は Git で push するだけ です。 商用でちゃんと使おうとすると、無料枠の構成では難しいですが、デ
![[WEB開発] 私的な最近のおすすめサービス/ツール 14選 〜2014年版〜 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/a05c54efc4e23b8f321cec1bcae63bb87257553f/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCV0VCJUU5JTk2JThCJUU3JTk5JUJBJTVEJTIwJUU3JUE3JTgxJUU3JTlBJTg0JUUzJTgxJUFBJUU2JTlDJTgwJUU4JUJGJTkxJUUzJTgxJUFFJUUzJTgxJThBJUUzJTgxJTk5JUUzJTgxJTk5JUUzJTgyJTgxJUUzJTgyJUI1JUUzJTgzJUJDJUUzJTgzJTkzJUUzJTgyJUI5JTJGJUUzJTgzJTg0JUUzJTgzJUJDJUUzJTgzJUFCJTIwMTQlRTklODElQjglMjAlRTMlODAlOUMyMDE0JUU1JUI5JUI0JUU3JTg5JTg4JUUzJTgwJTlDJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz1hYzRkNzQ2NGU1M2VlZDNkZTQwYTYxNDNlZmQ1MjZkOA%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBoa3VzdSZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9ZDQ2MDhlM2MxY2U1Y2E4MzU0YTFiOWMzNmI0MGNkZWE%26blend-x%3D142%26blend-y%3D436%26blend-mode%3Dnormal%26txt64%3DaW4g5qCq5byP5Lya56S-44KG44KB44G_%26txt-width%3D770%26txt-clip%3Dend%252Cellipsis%26txt-color%3D%2523212121%26txt-font%3DHiragino%2520Sans%2520W6%26txt-size%3D36%26txt-x%3D156%26txt-y%3D536%26s%3Dd239fddef9fb1a234fbc44b218471eb6)
Struts後時代のJava EE／Javaモダン開発はどうあるべきか～JJUG CCC 2014 Springまとめリポート（前編） - ＠IT
日本Javaユーザーグループは2014年5月18日、「JJUG Cross Community Conference 2014 Spring」を開催した。「JJUG Cross Community Conference」（以下、JJUG CCC）は毎年春と秋に開催されるカンファレンス。初心者向けからエキスパート向けまで、Java／JVMに少しでも関連すればいいという広いテーマでさまざまな講演が行われている。 今年は4トラック同時進行、合計25ものセッション、ハンズオンセミナーという規模で大いににぎわった。 そして最新仕様であるJava EE 7に準拠しているのは2014年5月現在「GlassFish」「WildFly」のみで、主流は多種多様なアプリケーションサーバーが対応しているJava EE 6とのことだ（楽天はGlassFishを活用していることでも有名）。 エンタープライズ分野でJa
JavaScript初級者から中級者になろう — uhyohyo.net
このページの最終更新日：2019年7月4日 JavaScript。主にWebページを作るのに使われるほか、現在ではさまざまなところで活躍しているプログラミング言語です。 このページはJavaScriptの中級講座です。最新鋭ではないかもしれませんが、読み進めれば大抵のものを自分で作れるようになることでしょう。 言い訳とJavaScriptの歴史 / 問い合わせ 最近の更新2017/10/05 全ページを手直ししました。十六章第六回を追加。2017/11/9 十六章第二十一回・十六章第二十二回を追加。2017/12/2 十七章第三回・十七章第四回を追加。2017/12/3 十七章第五回・十七章第六回・十七章第七回を追加。概要コンテンツは第一篇と第二篇に分かれています。 JavaScriptは昔からWebページに動きを与えるものとして用いられてきましたが、第一篇ではそのような、昔からあるJav
業務アプリケーションにおけるモダンWeb開発の現状ーHTML5開発って簡単なの？
CSS Nite in OSAKA, Vol. 36（2013/9/10）、CSS Nite in Ginza, Vol.71（2013/9/19）にて開催された「次世代のWebデザインへの2つのヒント」のスライド。両セッションのスライドをマージしてまとめています。 スライドの末尾で紹介していますが、2013/11/7に拙著『マルチデバイス時代のWebデザインガイドブック』が発売となりました。興味ある方は書店にて手に取ってみてください。 サポートサイト : http://2843.jp/books/nabebon/ Facebookページ : http://facebook.com/nabebon/ Amazon : http://www.amazon.co.jp/dp/4883378942/
AngularJS コードの構造化 | DevelopersIO
複数人で AngularJS を利用した Web アプリケーションを構築するときに必要なルールをまとめてみました。 ( あくまで策定中のルールであり、今後も改変する可能性があります。また、ベストプラクティスを謳うものではありません ) 使用 AngularJS のバージョン angular.js 1.2.5 angular-route.js 1.2.5 参考サイト Dan Wahlin's Blog | Structuring AngularJS Code http://weblogs.asp.net/dwahlin/archive/2013/12/01/structuring-angularjs-code.aspx GitHub | mgechev / angularjs-style-guide / README-ja-jp.md https://github.com/mgechev/a
マイクロソフトがテストツール「BrowserSwarm」発表
テスト結果はInternet Explorer（IE）、Google Chrome、Firefox、Safari、OperaなどのWebブラウザのバージョンごとに合格率が表示される。テストに合格した項目と不合格だった項目は別々に参照でき、修正が必要な個所がすぐに分かるようになっている。 BrowserSwarmのプロジェクトは、jQueryライブラリの開発などに参加しているappendTo、クラウドベースのテスト用プラットフォームを提供するSauce Labs、マイクロソフトのInternet Explorer（IE）チームが協力して手掛けている。 IEチームは「質の高いフレームワークは現代のWebの基盤であるにもかかわらず、さまざまな端末やWebブラウザで横断的なテストができるリソースはあまり存在していなかった。BrowserSwarmでは相互運用性を備えたフレームワークの構築を支援する
C++で作るWebアプリケーション
14 views Boost.勉強会 #12で発表した「C++で作るWebアプリケーション」 ... More… Boost.勉強会 #12で発表した「C++で作るWebアプリケーション」 C++をJavaScriptにコンパイルするコンパイラ Emscriptenを使ってC++でブラウザ上で動くアプリケーションを開発する方法を解説します C++で作るWebアプリケーション Presentation Transcript そんなC++の進出を拒んできた領域C++はとてつもなく汎用的な言語である2013年6月22日土曜日 WEB2013年6月22日土曜日 サーバ クライアントこっちは割とどんな言語でも書ける問題はこっち2013年6月22日土曜日 JavaScriptWEBブラウザで動く物を作るために長らく使われてきた言語近代的な多くのブラウザが共通して対応している唯一の言語2013年6月22
これからweb開発に携わりたいと考えている人にお勧めの言語
一説によると有史以来開発されたプログラミング言語は4000を超えるとされている。その中でどの言語を選べばいいのか初学者にとっては悩みの種であろう。この記事ではそんな初学者のとっかかりとなることを想定して書かれている。 Javascript(お勧め度☆☆☆☆☆)Javascriptは長らく「使えない糞言語」とのレッテルを張られていた言語である。2005年頃からAjaxの台頭で価値が見直され、2010年頃からはnode.jsの盛り上がりで一気にweb開発の主要言語の一つに躍進した。 node.jsは現在活発に開発が進んでおり今年中には実践投入が可能になる画期的なアーキテクチャとなる可能性が高い。それによって「クライアントサイド」と「サーバーサイド」をどちらもJavascriptで開発できることになり、これはよく比較対象にされるLLのライバル達が絶対になし得る事の出来ない独占的なメリットである。
Google Sites: Sign-in
Not your computer? Use a private browsing window to sign in. Learn more about using Guest mode
iOSプログラマへ。HTML5 Canvasがおもしろい！ | DOTAPON Blog
…という題で、発表してきました。 さいたま開発勉強会 vol5です。 iOSのCore Graphicsと共通点の多いHTML5 Canvas。 iOSプログラムの経験がまるごと活かせるぜ！面白いものつくろうぜ！ ということをお伝えしたく、実際に手を動かす場面を取り入れてみました。 実際に効果があったかどうかは…わかりません (^^;) 入門的な位置づけに仕上げてみましたので、iOSプログラマの方もそうでない方も、ぜひ触ってみてください。 iOSプログラマへ。HTML5 Canvasがおもしろい！ from cocopon 練習用の「HTML5 Canvas スターターキット」はこちらから。 マウス・タッチイベント両対応のInputManagerが付属していますので、ぜひご活用ください :) CanvasStarterKit_100.zip
JavaScriptみたいな最近噂の新言語、JSXのお話を聞いてきたよ！ | Ginpen.com
これ行ってきました。 Web先端技術味見部#4 （仮テーマはJSX！） : ATND JSXなにそれ JavaScriptっぽい新言語。本日DeNAが発表。 JavaScript風の記述 って言ってたけどそうでもないと思った。ActionScriptに近い？ 静的型付け →高速 クラスベース →高速 JavaScriptに変換しても →高速 玄人が書いたJavaScript並 クライアントサイドでもサーバーサイドでも動く というかJavaScriptが動く環境なら動く JavaScriptを置き換えるのが目標 リンク DeNA開発、高速なJavascriptコードを生成できる新言語「jsx」への反応まとめ – Togetter JSX – a faster, safer, easier alternative to JavaScript 公式サイト JSX – Statically-typ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
XSS再入門
Create a new fiddle - JSFiddle