Phoenix で WebSocket 通信をする - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
画像を描画する-HTML5編
画像を描画する命令drawImage() まずcanvasに画像を描画するdrawImage()の使い方を３通り見ておきましょう。 context.drawImage(画像,X1,Y1) 画像を指定座標に描画する X1は画像を描画するX座標,Y1は描画するY座標 context.drawImage(画像,X1,Y1,W1,H1) 画像を指定した座標に、幅と高さも指定して描画する W1は画像を描画する際の幅、H1は描画する際の高さ context.drawImage(画像,X0,Y0,W0,H0,X1,Y1,W1,H1) 元画像の一部分を切り抜いてcanvasに描画する X0,Y0は切り抜く元画像の座標、W0,H0は切り抜く画像の幅と高さ 今回描画する元画像は649×433ピクセルの下のものです。この画像を3通りの方法でcanvasに描画していきます。 元画像を切り抜いてcanvasに描画す
ES2015(ES6)な時代だからこそ、ES5を改めて調べたJavaScript初級者のメモ - Qiita
はじめに ECMAScript2015(第6版、通称ES6)が承認され、Babelも登場し、世はまさにES2015時代。なのだけど、JavaScript初級者としてはES5自体をちゃんと把握していなかったりするので、今さらながら調べてみることにした。 間違っている所があれば、ご指摘いただけると大変助かります。 ECMAScript5で追加されたもの ECMAScript5 compatibility tableにて、ES5で追加された機能がどのブラウザに対応しているかが分かる。また、es5-shimというライブラリが、古いブラウザでES5の一部の機能が実装可能になる。 基本的には、IE9以上／iOS7以上、それ以外はモダンなブラウザであれば大抵対応している。 use strict スクリプトの先頭、もしくは関数内の先頭に記載することでstrict modeで実行される。自分が書いているもの
とほほのBootstrap 3入門 - とほほのWWW入門
とほほのBootstrap 3入門 トップ Bootstrap 3入門 はじめに このページは 「Bootstrap 3」について説明しています。Bootstrap 4 については、「Bootstrap 4入門」を参照してください。 Bootstrap とは Bootstrap は、スマートフォンなどのモバイル端末にも対応し、レスポンシブデザインを採用した HTML, CSS, JavaScript フレームワークです。 Twitter 社で開発され、最初は「Twitter Bootstrap」と呼ばれていましたが、現在は「Bootstrap」となりました。 ライセンスは MIT License で、商用利用も可能です。 現時点(2018年5月6日)の最新バージョンは 4.1.1 です。 Bootstrap 2 と Bootstrap 3 以降では一部互換性の無い機能があります。 2018
開発に便利なタスクランナー「gulp」で出来る事、導入方法などをまとめました ｜https://wp.yat-net.com/name
2015年 09月 10日 開発に便利なタスクランナー「gulp」で出来る事、導入方法などをまとめました カテゴリ： gulp タグ：gulpタスクランナー タスクランナーの一つであるgulp（ガルプ）。使い出すとすごく便利で今ちょっと手放せない開発ツールの一つなんですが、使ってない人からすると、導入コストとか学習コストが気になって、まだ手を出してないという方もいますよね。なので、今回導入用の記事を書いたので、ちょっと気になってるという方、試してみたかったという方に役立てばいいなと思います。 1.タスクランナーとは？ gulpで何ができるのか？ 2.gulpに必要な環境を整える – Node.jsのインストール 3.gulpに必要な環境を整える – package.jsonの作成 4.gulpに必要な環境を整える – gulpfile.jsの作成 5.gulp-ejsを使った開発環境 6.
Electron for the Mac App Store
SASCHA WISE Electron for the Mac App Store August 12, 2015 Before you go any further it is important to know that this blog post is out of date. The technique used here has been integrated into the offical Electron project. Look here for more info. Electron and the Mac App Store are 2 things that are difficult to pair, like fine wine and McDonalds. Chromium, the rendering engine for Electron, uses
Tasks, microtasks, queues and schedules
Posted 17 August 2015 - hold onto your butts for this one, it's spec-heavy When I told my colleague Matt Gaunt I was thinking of writing a piece on microtask queueing and execution within the browser's event loop, he said "I'll be honest with you Jake, I'm not going to read that". Well, I've written it anyway, so we're all going to sit here and enjoy it, ok? Actually, if video's more your thing, P
JavaScriptのモナド | POSTD
恒等モナド Maybeモナド リストモナド 継続モナド Do 記法 連鎖呼び出し モナド とは、一連のステップによって実行する計算を記述する際に使用する、1つのデザインパターンです。 純粋関数型プログラミング言語 では、モナドは 副作用を管理する ために広く利用されていますが、 マルチパラダイム言語では、モナドで複雑性を制御することもできます 。 モナドはデータ型をラップして、空の値を自動的に伝播したり（ Maybe モナド）、非同期コードを簡略化したり（ 継続 モナド）といった、新たな動作を既存のデータ型に追加します。 一連のコードをモナドと見なすためには、その構造には次に挙げる3つの要素が含まれていなければなりません。 型コンストラクタ — 基本的な型に対してモナドの動作を追加した型を作成する機能です。例えば、基本的なデータ型 number に対して、 Maybe<number> とい
Writing Better JavaScript with Flow — SitePoint
Stay Relevant and Grow Your Career in TechPremium ResultsPublish articles on SitePointDaily curated jobsLearning PathsDiscounts to dev toolsStart Free Trial7 Day Free Trial. Cancel Anytime. Key Takeaways Flow is a static type checker for JavaScript created by Facebook, designed to find type errors in JavaScript code, often without requiring code modification. This results in the minimization of pr
Chrome DevToolsを使ってJavaScriptのメモリリークを検出し、解消する - 人生dat落ち
JavaScriptを書いていたらブラウザがくっそ重くなる症状に出くわした。あぁ、噂のメモリリークですわ。 先人の知恵に頼るマン。それっぽい記事が見つかる。 javascriptのメモリリーク対策(随時更新) - Qiita Shibu’s Diary: JavaScriptのメモリリークを10倍速で発見する Taming The Unicorn: Easing JavaScript Memory Profiling In Chrome DevTools Writing Fast, Memory-Efficient JavaScript - Smashing Magazine angularjs - How to catch memory leaks in an Angular application? - Stack Overflow 上の記事はProfiles + Take Heap
Web Componentsの現状 | POSTD
Alex Russell が Fronteers Conference 2011 で初めて発表したWeb Componentsは、長きにわたり開発者の注目を集めてきました。その概念はコミュニティに衝撃を与え、発表以来、講演や議論のテーマとして多く取り上げられています。 2013年 Google は、Web Componentsをベースとするフレームワーク、 Polymer をリリースしました。その目的は、新規APIの動作を簡易的にチェックし、コミュニティからフィードバックをもらい、さらなる資金や評価を得ることでした。 導入から4年が経った今、Web Componentsは十分に普及している はず です。ところが実際は、”あるバージョン”のWeb Componentsに対応したブラウザは Chrome しかないという現状です。Polyfillがあっても、大半のブラウザでサポートしない限り、W
React.jsを使いたいRailsおじさんがJavaScriptライブラリをそれっぽく管理しながら入門する - ppworks.jp
Sendagaya.rb #114に来たので、目標のブログ記事を書いてた。 今日はsendagaya.rbへ行ってブログ記事を一本仕上げるのが目標。— Koshikawa Naoto (@ppworks) August 10, 2015 今日は、React.jsの会なので、RailsからReact.jsをざっくり使って見る準備をしてみます。 目指すもの sprocketsのままとりあえず進む jsのライブラリをnpmで管理したい React.jsをES6で書きたいし、JSX書きたい herokuで動かすぞ！ react-railsは使いたくない 方針 sprocketsと共存するために、browserify-railsを利用し、ES6はBabelを利用します。ライブラリはそのまま、npmで管理します。 npmを入れます もし入っていなければnpmを入れましょうね。 brew install
npmに上がっていないブラウザ向けに書かれたJavaScriptをnode.jsから雑に使うの術 - 時計を壊せ
ブラウザ向けに書かれたJavaScriptだと、windowに対してexportしていて、nodeから使いにくくて困ることがある。 nodeでも動くようなpatchを書けばいいという話ではあるが、githubにコードが上がっていないとやりにくくてつらい。 そこで、適当なObjectをcontextにして、vmでぶん回すことで、雑に解決することができた。 以下はGeoHexというライブラリのJavaScriptの実装がwindow.GEOHEXにエクスポートする実装であったために困ったので雑に解決した例。 "use strict"; var http = require('http'); var co = require('co'); var get = function (url) { return new Promise(function (resolve, error) { http.
javascript再勉強のためにreact + ardaでマインスイーパーをつくったので気づきを忘れないようにメモ - Qiita
一ヶ月近くの有給休暇を経て8/1から完全な無職になりました。前職ではjsといえばviewsに$()を書きまくるという所業をはたらいておりましたが、railsはapi、フロントは別口でというのが流れであるっぽいので、ちゃんとしたjs作業をしましょうというのが今月のあらすじ。 成果物 うごいてるもの No Mines Land 左右同時押しがMouseEventから簡単にとれてびっくりした。 ソース https://github.com/mmmpa/mine はじめてつかった Browserify とくにBrowserifyはとてもよくて、javascriptのファイル分割に関する知見がまったくない自分でも、簡単に分割と結合が行えるようになっており本当によかった。 Browserifyについて勘違いしていたこと Browserifyを読み込んでおくとrequireが使えるようになると思っていた
MA(マッシュアップアワード)11でMonacaを使おう
こんにちは、アシアルの岡本です MA(マッシュアップアワード)11に参加される方向けにMonacaの情報をお伝えいたします。 この記事は随時更新してまいります。 Monacaはスマホのアプリを開発するためのサービスです。HTML5やJavaScriptといったWeb技術を応用してアプリを作成でき、各プラットフォーム向けにアプリをビルドすることでマーケットにリリースすることが可能です。 開発環境がクラウド上に用意されるためハッカソンのような短期間でチームを組んでアプリを作り上げる時に大変便利です。Goldプラン以上ならプロジェクトを共有することもできるためコンテストに向けてリモートでチーム開発を進めていく場合にもお勧めです。 Monacaはアプリ開発をプロジェクトという単位で行います。そして、プロジェクトを立てる時のひな型になるのが『テンプレート』です。テンプレートは新規でプロジェクトを立て
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
flux-utilsについて
Code4Sec | LinkedIn
これからのWebセキュリティ フロントエンド編 #seccamp
形態素解析の実装言語Talk パネルディスカッション
Destructuring assignmentのご利用は計画的に - Qiita
