Delete in Rails Without jQuery and UJS | Viget
We’re a full-service digital agency that’s been helping clients make lasting change since 1999. Contact Us
将来は標準のDOM APIを使うのがより身近になると思ってる - @hadashiA
最近、標準のDOM APIは別に悪くない、と考えるようになった。 そう考えて劇的に何か変わるかというと、現時点ではライブラリを使うことに慎重になるという気分的なものかもしれない。 気分が変わった結果として、僕は直近のプロジェクトのごくふつうのWebページでは、標準のDOM APIを直接さわる形に変更した。フレームワークは使わずRxJSのみ使っている。結果、パフォーマンスと細かいUIの挙動とコードの透明度が改善された。 標準のDOM APIは、べつに不必要に冗長なところがあるわけではないし、扱っているものが特別プリミティブ過ぎるとも思わない。むしろ、意図しない動作が入りずらく、インターフェイスが明示的にできている点なんかは優れている。 欠点があるとすれば、あらゆるスコープから好きなNodeの書き換えが禁止されてない点、クライアントサイドでのレンダリングのサポートが弱い点、何をするにもまず検索
HTML5で追加された input[type=number] を使う上での注意 - Qiita
input[type=number] とは HTML5 の input[type=number] は数値だけを受け付ける入力部品です（デフォルトでは小数の入力も想定されています）。 これを使えば、スマートフォンなら自動でキーパッドが数値用になるらしいです。なるほど、普通の input[type=text] だと文字入力用のキーボードが出る可能性があるので、数値だけしか入力しない場合は input[type=number] のほうが便利そうです。 また、PCでは（ブラウザの実装等にもよると思いますが）「増やす」「減らす」ボタンが出てきたりします。以下がサンプルです。 （一応言っておきますが、↑のサンプルは画像なので、操作できません。） 注意点 せっかく数値入力専用の部品があるのだから、数値入力でこれを使わない手はないですねぇ。もし input[type=number] に未対応のブラウザで表
![HTML5で追加された input[type=number] を使う上での注意 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/fb3b0800912a409204fc9cfd505c0815c108728b/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFwLW5vcnRoZWFzdC0xLmFtYXpvbmF3cy5jb20lMkYwJTJGNDg3NTAlMkZwcm9maWxlLWltYWdlcyUyRjE1NjQ5MDM0MTI_aXhsaWI9cmItNC4wLjAmYXI9MSUzQTEmZml0PWNyb3AmbWFzaz1lbGxpcHNlJmZtPXBuZzMyJnM9YzM0NTU4M2ZjZmJhMGM1ODdlZDYwMmRkOTEwY2M5MmM%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253D595c9248ad9be921da290ca44f5f2628%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9SFRNTDUlRTMlODElQTclRTglQkYlQkQlRTUlOEElQTAlRTMlODElOTUlRTMlODIlOEMlRTMlODElOUYlMjBpbnB1dCU1QnR5cGUlM0RudW1iZXIlNUQlMjAlRTMlODIlOTIlRTQlQkQlQkYlRTMlODElODYlRTQlQjglOEElRTMlODElQTclRTMlODElQUUlRTYlQjMlQTglRTYlODQlOEYmdHh0LWFsaWduPWxlZnQlMkN0b3AmdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT01NiZ0eHQtcGFkPTAmcz02MDkyMzNjOTExMTBmZjI1NGY2NWY3MTUzYzdlNDk2NA%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBteXpreXkmdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtcGFkPTAmcz00MTJlNjE0ZDAyMjJkOGE2YzgzNzczYTA5YWMwZGNlOA%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3D2c0063e9d07f415d6cb6be3daabefdb2)
jQueryで楽になる部分、楽にならない部分、顧客が本当に必要だったもの - Qiita
俺も昔はお前のような jQueryスパゲッティジェネレーターだったのだが、膝にReactを受けてしまってな… 基本的な方針 とくにライブラリ設計者において、小さなモジュールを単機能で分割する以上、ライブラリ設計者は可能な限り依存を減らすことを求められます。node環境ならdependency hellの回避のため、フロントエンド環境ならファイルサイズを減らすためです。 ライブラリ設計者ならずともコードのポータビリティを維持するため、できるだけライブラリに依存しないコードを書くのが望ましいです。 Githubみてる限り、最近書かれるJSのライブラリの多くはjQuery非依存です。ユーザーから見る限りは、jQueryElement渡すかHTMLElement使うかぐらいの違いですけどね。 また、Angular, React等のSPAをスクラッチで設計する場合、気づいたらjQueryを使っていな
Rails にオートコンプリート機能付きのテキストフィールドを追加する
今作ってる Web サイトでテキストフィールドにオートコンプリートをつけたいなーと思ったので調べたら gem があったので使ってみた。 peterwillcn/rails4-autocomplete jQuery UI のオートコンプリート機能を利用しているっぽい。 rails4 autocomplete を使う準備 自分の環境は ruby 2.1、rails は 4.1 を使用しています。 Gemfile に rails4-autocomplete を追加する gem 'rails4-autocomplete' jquery をいれてなかったら gem 'jquery-rails' もいれておく。 Gemfile 編集したら bundle install しよう。 JavaScript と CSS を読み込む app/assets/javascripts/application.js に
Node.jsでスクレイピングするならば - プログラマでありたい
昔、Rubyでクローラー/Webスクレイピングの本を書きました。今でもちょくちょくとスクレイピングのコードを書いたりはするのですが、実行基盤についてはサーバの運用管理が面倒くさいのでAWS Lambdaを使うことが多いです。そうなると、Lambdaは基本的にはRubyが使えないので、言語はPythonかNode.jsを利用することになります。Pythonもいいけど、今後のことを考えるとNode.js力を高めておきたいと考えています。ということで、Node.js縛りでスクレイピングの仕方です。 スクレイピング対象のページの種類 私の中の勝手な定義ですが、スクレイピングには3種類あります。 1. 静的サイト／JavaScript不要なページに関するスクレイピング 2. 対話型サイト／JavaScript不要なページに関するスクレイピング 3. JavaScript前提のページに関するスクレイピ
あのライブラリは何故誕生したの?のまとめ - Qiita
はじめに 最近、フロントエンドのライブラリ乱立問題について盛り上がってました。 自分はnobkzさんの以下の文に全てがまとまっていると思います。 僕の最初の違和感は、「技術的な流行り」に乗ることに何の価値があるのだろうか?ということである。もちろん、最新のツールやフレームワークはより何かが良くなってるかもしれない。しかし、 それをあなたのプロジェクトで採用するには何の価値があるだろうか? 「最近のフロントエンドへの違和感 - nobkzのブログ」より 裏を返せば、新しいライブラリの内容、特に「どのような問題を解決するためにこのライブラリが生まれたのか」という思想を把握しておくことは重要だと言えます。 つまりは、 "How?(ライブラリの使い方)" よりも "Why?(なぜそのライブラリが必要なのか)" を学んでおこう ということです。この記事では どのような既存の問題・要求を どう解決して
React.js v0.14 チュートリアル【日本語翻訳】
Your first component: はじめてのコンポーネントReact is all about modular, composable components. For our comment box example, we’ll have the following component structure: Reactはモジュラー、構成可能（コンポーザブル）なコンポーネントが全てです。コメントボックスの例では、以下のような構造のコンポーネントを使っていきます。 Let’s build the CommentBox component, which is just a simple <div>: CommentBoxコンポーネント（シンプルな<div>）を作りましょう。 // tutorial1.js var CommentBox = React.createClass({ ren
10年のツケを支払ったフロント界隈におけるJavaScript開発環境（2016年4月現在）。 - 日々、とんは語る。
2015年はCSSが普及した以来となる10年に1度のフロントエンド大変革期で、それまでのツケが一気に回ってきたと個人的に感じていました。目まぐるしく状況が変化していきましたが、2016年になり、個人的にだいぶ落ち着いてきたと感じているので、ここらへんでまとめておきたい思います。 最初に結論を書いておくと、 『React + Redux + react-router + material-ui + axios + ES2015 + Babel + webpack + ESLint + Airbnb JavaScript Style Guide』 という組み合わせが、いま僕の採用しているJavaScriptの環境です。 主要ライブラリは React A JavaScript library for building user interfaces | React 去年、一気に普及したReact
URLのクッションページを動的に生成 - Qiita
必要になったので作ったが、こういうTIPS投稿サイトに投稿することを念頭に入れてると、jQuery使わない方がいいような気がしてヤキモキしますね……（震え声） 特徴は、このページから飛んだ場合、飛び先でリファラが「about:blank」になるから、足が一切つかないことか。メリットとなる場合もデメリットとなる場合もありそう。 なんか怪しいサイトのために作られたような存在だな……（震え声） function openCushionUrl(url, isOpenInNewTab) { if (isOpenInNewTab === void 0) isOpenInNewTab = true; var viewUrl = (function(html){ var elem = document.createElement('div'); elem.appendChild(document.crea
Railsで構築しているWebサービスをjQueryベースからReactに移行する時の知見 | スペースマーケットブログ
こんにちは、エンジニアの小林です。 先日、スペースを貸し出すオーナー様向けのダッシュボード(管理画面)をリニューアルしました。 スペースマーケットはwebサーバもAPIサーバもRailsで構築しているのですが、JQueryをベースに構築していたリニューアル前の実装からReactをベースにした実装へ移行した際に得た知見を書きたいと思います。 サーバ構成 既存のサーバ構成では、webサイトはwebサーバから、アプリはAPIサーバからそれぞれデータベースを参照していました。 リニューアルに伴いwebサーバからもAPIサーバを参照する構成となります。 webサーバから別ドメインのAPIサーバにアクセスするためには CORSの設定 webサーバとAPIサーバはドメインが違うため、ReactのコードからAPIサーバにajaxリクエストが送れません。これを回避するためにCORS(Cross-Origin
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
初夏のJavaScript祭 NHNテコラス株式会社 テコラスカフェ
http://post.simplie.jp/posts/27
CodeWinds React.js Fundamentals - comprehensive self-paced online video training course
数字の3ケタごとに「,(カンマ)」を付ける【JavaScript】 - Qiita
Why is my .data() function returning [ instead of the first value of my array?
WantedlyにReact + Reduxを導入した話
渋川よしき on Twitter: ""ES6だとthisが本当にthisになる なので逆にjQueryにアローで書いた関数渡すと破滅する" って聞いて、あーこれ初心者殺しだなって思った。jQueryはまだbootstrapとかで使われているし情報多いし。今のうちに、初心者が成仏できるようにせめて祈っておく 🙏"
Ruby on Railsでオートコンプリート
Date.prototype.setMonth() - JavaScript | MDN