タグ

JavaScriptとjavascriptに関するmag4nのブックマーク (431)

  • jQueryが必要とされなくなってきたのは, Reactなどの他のフレームワークが登場したせいではなく, 標準DOM APIが進歩したおかげです

    jQueryが必要とされなくなってきたのは, Reactなどの他のフレームワークが登場したせいではなく, 標準DOM APIが進歩したおかげです JavaScript Advent Calendar 2017 - Qiitaの2日目の記事です. 何故この記事を書こうと思ったか JavaScriptの定番ライブラリであるjQueryは, 最近以前と比べて必要とされなくなってきました. その理由はよく, Reactなどの他のフレームワークが登場したせいだと勘違いされています. しかし, jQueryが必要とされなくなってきた理由は標準DOM APIの進歩によるものです. この記事ではそれを書いていきます. なお, この記事ではReact Nativeについて触れる必要がないため, React DOMのことも一緒くたにReactと記述します. また, 私がweb開発を開始したのは3年前ぐらいから

    jQueryが必要とされなくなってきたのは, Reactなどの他のフレームワークが登場したせいではなく, 標準DOM APIが進歩したおかげです
    mag4n
    mag4n 2017/12/02
    jQuery依存のライブラリがまだ便利なうちは使うかも。でも基本脱jQueryのながれ。
  • Writing Maintainable Software: Clean Code vs Dirty Code

    Published November 16, 2017 Writing Maintainable Software: Clean Code vs Dirty Code React JavaScript Clean-Code Best-Practices This article will focus on clean code practices as they apply to modern React software development. I’ll also talk about some of the “sugar” that ES6/ES2015 brings to the table. What is clean code, and why do I care? Clean code is a consistent style of programming that mak

    Writing Maintainable Software: Clean Code vs Dirty Code
    mag4n
    mag4n 2017/11/20
    てかブログあったのか
  • Making dev.to insanely fast

    DEV Community Follow A space to discuss and keep up software development and manage your software career

    Making dev.to insanely fast
    mag4n
    mag4n 2017/11/15
    dev.toの速さの秘密
  • DocBaseの同時編集機能を実現しているアルゴリズム – KRAY Inc.

    はじめに 皆さんはGoogleドキュメントやHackMDを使ったことはあるでしょうか。これらのツールは「ネット越しに同時に複数の人で1つのドキュメントを編集できる」という特徴を持っています。お互いの編集がリアルタイムに反映されるので、相手が何を書くのかを意識することなく、簡単にドキュメントを複数人で編集することができます。これを実現するためには、同時編集に参加しているユーザ全員の編集内容がネットワークの延滞に影響されることなく、それぞれの編集内容をうまい具合にマージして反映してくれるような賢いアルゴリズムが必要になります。今回はこのアルゴリズムに関して書きます。 編集内容のマージとは 編集内容をうまい具合にマージしなければいけないケースを考えてみます。 AさんとBさんが次のドキュメントを同時編集するとします。最初は、お互いブラウザ上では次のように見えています。当然、この状態ではお互いに見え

    DocBaseの同時編集機能を実現しているアルゴリズム – KRAY Inc.
  • 2017年JavaScriptのテスト概論 | POSTD

    稿は、JavaScriptのテストについて最も重要な根拠、用語、ツール、アプローチなどの知識を身に着けることを目的とした簡略版ガイドブックです。稿で検討する数々の側面に関する最新の秀逸な記事も紹介しつつ、私たちが経験的に得たことも多少付け加えたいと思います。 Facebookによるテスト用フレームワークであるJestのロゴをご覧ください。 見てお分かりのように、このフレームワークは「苦痛のない」JavaScriptのテストをスローガンに掲げています。しかし、 “次のように言う人” もいます。 苦痛のないテストなんてあり得ない。 実際、Facebookはこのスローガンを掲げるだけの素晴らしい理由があります。一般的にJSのデベロッパは Webサイトのテストにあまり満足していません 。JSのテストには制限があり、実装が難しく、低速である傾向があります。 一方、正しい戦略を立てて適切にツールを

    2017年JavaScriptのテスト概論 | POSTD
    mag4n
    mag4n 2017/11/14
    フロントでこの手のテスト書くのはModelに対しての網羅性テストはやる
  • 僕が遭遇したIE11固有の不具合とその対策 - Qiita

    最近大学時代の同期と飲んだらMSに転職したので 現在から過去の案件で産廃IEくたばれと心底思った発生した事象と対策を書いていきます 他にもこんなことあったぜ!って意見ありましたらお待ちしております。 キャッシュ Windows10のIE11で遭遇した事象 ログイン→ログアウト→別アカウントログイン したときの挙動が最初のログインアカウントの状態のレスポンスが返ってくる Authorization: Bearerヘッダーが再ログインしても前のBearerトークンが残り続ける APIレスポンスが前回のものが返ってくる 対策 JSのすごい人に助けてもらいました・・・ ClearAuthenticationCacheを無効にする リクエストキャッシュしないようにリクエストパラメータ末尾に日付をつける→jQueryでもこの方法で回避しているらしい これIEのバグですよね? // ClearAuthe

    僕が遭遇したIE11固有の不具合とその対策 - Qiita
  • Nintendo Switchの中ではReactが動いてる!Nintendo eShop開発秘話を聞いてきた

    Nintendo Switchの中ではReactが動いてる!Nintendo eShop開発秘話を聞いてきた 白石 俊平(HTML5 Experts.jp編集長) こんにちは、編集長の白石です。 この記事は、9月24日に開催されたHTML5 Conference 2017に登壇したエキスパートに、お話されたセッションのトピックを中心に語っていただこうとういものです。セッションの内容をより深く理解する手助けになるだけでなく、記事単体でも面白く読んでいただけることを目指しています。 今回は、「Nintendo SwitchとWeb」という講演をされていた任天堂さんに、Switch開発におけるWeb技術の活用方法や、開発秘話を伺ってきました。任天堂のお二人は京都から、リモートでの取材に応じていただきました。 Nintendo SwitchではWeb技術が大活躍! 白石 簡単に自己紹介をお願いで

    Nintendo Switchの中ではReactが動いてる!Nintendo eShop開発秘話を聞いてきた
    mag4n
    mag4n 2017/11/06
    SPAコンテンツの応用例。遅いのはSwitch触ってないから分からんけど、WebviewのUIコンポーネントの質とかレンダリング速度とかも関連するのでフロント技術側だけのせいでもない。
  • フロントエンドチェックリスト(日本語訳) - Qiita

    GitHubで公開されているフロントエンドチェックリストというドキュメントが、網羅されている内容が幅広く便利そうだったので、日語に翻訳しました。 日語版は、以下のGitHubリポジトリにあります。GitHub側と自動的に連携するようにしておりますので、誤訳や誤りなどがあれば GitHub のプルリクエストまたは Issue で報告していただけると幸いです。 https://github.com/miya0001/Front-End-Checklist 日語版への貢献方法 最終更新日時: 2017-11-19 03:50:47+09:00 (未翻訳) Front-End Checklist The Front-End Checklist is an exhaustive list of all elements you need to have / to test before lau

    フロントエンドチェックリスト(日本語訳) - Qiita
  • jQuery から Vue.js へのステップアップ - Qiita

    はじめに 最近耳にする Vue.js(ビュージェイエス) ってどんなもの? jQuery とどう書き方違うの?とか、jQuery でやってたこういう事って Vue.js だとどうやるの?jQuery しか使ってないけど Vue.js も使ってみたいなぁ~と思っている人向けの小難しいことは省いた記事です。私もそちら側から来たものです。 Vue.js 日公式ページ(日語翻訳率が半端ないと評判) もともと「jQuery から Vue.js への移行」というタイトルでしたが、それだと jQuery を完全にやめる、的なニュアンスになってしまうので、少し変更しました🐹 jQuery と Vue.js の違い jQuery は、セレクタ操作に特化したライブラリで HTML の一部をちょっとだけ弄るには手軽に扱えます。更新のたびにセレクタから要素を探して操作をするため、複数の UI を連携させるよ

    jQuery から Vue.js へのステップアップ - Qiita
    mag4n
    mag4n 2017/10/14
    この2者の思想が違うので、移行と言われるともにょる。vue.jsは設計思想をまずは理解しないとキツイので公式ページを10回読むべき。
  • 差分検出アルゴリズム三種盛り - Object.create(null)

    こんばんは. 気がつけばもうずいぶんと涼しくなってきました. 勢い余って凍ってしまったりせぬよう, くれぐれも普段の言動にはお気をつけください. はじめに さて, 我々人類にはどうしても二つの文字列 (あるいは行ごとに区切られたテキスト) 間の差分を求めなければいけない瞬間が発生します. 先人たちはそういった時のために diff のようなツールを開発し, それを利用することで文明はめざましい発展を遂げてきました. しかしながら, 使用するアルゴリズムを比較検討したい場合, 「差分」の定義を変えるなどして既存のアルゴリズムに変更を加えたい場合, diff のない異世界に飛ばされて自分で実装しなければいけない時などにおいては, 差分検出アルゴリズムについての理解が必要不可欠です. というわけで, この記事では文字列間の差分検出とは何かということと, 差分を求める三種類のアルゴリズムの紹介・解説

    差分検出アルゴリズム三種盛り - Object.create(null)
  • JavaScript ベスト・オブ・ザ・イヤー 2016

    JavaScriptコミュニティは日々進化しています。今日のトレンドも数か月後には陳腐化しているなんてことは日常茶飯事です。 2016年は終わってしまいましたが、何か重要なことを見逃したのではないかと感じているそこのあなた! 2016年の主要なトレンドをおさらいして、そんな不安を払拭しちゃいましょう。 過去12か月に獲得された Github のスター数を比較して、2016年に支持を集めたプロジェクトを数値に基づいて評価していきます。 2015年はなんといっても React でした。そして、Flux 実装を席巻したのは Redux でしたね。 2016年、JavaScript の人気プロジェクトはどのようなものだったのでしょうか?

  • JavaScript における文字コードと「文字数」の数え方 | blog.jxck.io

    Intro textarea などに入力された文字数を、JS で数えたい場合がある。 ここで .length を数えるだけではダメな理由は、文字コードや JS の内部表現の話を理解する必要がある。 多言語や絵文字対応なども踏まえた上で、どう処理するべきなのか。 それ自体は枯れた話題ではあるが、近年 ECMAScript に追加された機能などを交えて解説する。 なお、文字コードの仕組みを詳解すること自体が目的では無いため、BOM, UCS-2, Endian, 歴史的経緯など、この手の話題につき物な話の一部は省くこととする。 1 文字とは何か Unicode は全ての文字に ID を振ることを目的としている。 例えば 😭 (loudly crying face) なら 0x1F62D だ。 1 つの文字に 1 つの ID が割り当てられているのだから、文字の数を数える場合は、この ID の

    JavaScript における文字コードと「文字数」の数え方 | blog.jxck.io
  • http://post.simplie.jp/posts/111

    http://post.simplie.jp/posts/111
  • Addons :: XRegExp

    More regex stuff by me: • Awesome Regex List of the best regex resources • Regex+ JS regexes + future “Regular Expressions Cookbook manages to be simultaneously accessible and almost ridiculously comprehensive.” —Jeff Atwood If you want, you can download XRegExp bundled with all addons as xregexp-all.js. Alternatively, you can download the individual addon scripts from GitHub. XRegExp's npm packag

  • 2016年にJavaScriptを学ぶとこんな感じ

    このストーリーは、Circle CIに投稿された”It’s the future”というストーリーにインスパイアされたものです。オリジナルはこちら。ここに書いたことは一つの意見というだけで、他のJavaScriptフレームワークもそうですが、過剰に真に受けないでください。このストーリーを執筆中に新たなJavaScriptフレームワークは作成されていません。 やあ、今新しいプロジェクトをやっているんだけど、実はここ数年ウェブのコード書いていなくてさ、しかも以前とは少し変わったとも聞いているよ。それで君が一番この辺でウェブ開発に詳しいって聞いたんだけど? -フロントエンドエンジニア、といったほうが正しいが…まあ、俺なら間違いない。俺のは2016年のウェブだからな。ビジュアライゼーション、ミュージックプレイヤー、サッカーをするドローン等々。JsConfとReactConfから帰ってきたばかりだか

    2016年にJavaScriptを学ぶとこんな感じ
    mag4n
    mag4n 2016/12/13
    ツール多すぎ問題なー
  • Vue.jsで実現するMVVMパターン Fluxアーキテクチャとの距離

    Copyright © 2025 Speaker Deck, LLC. All slide content and descriptions are owned by their creators. About Terms Privacy DMCA Accessibility Statement

    Vue.jsで実現するMVVMパターン Fluxアーキテクチャとの距離
    mag4n
    mag4n 2016/12/12
    vuexつかえばよいとおもうよ
  • 一から始めるJavaScriptユニットテスト - Hatena Developer Blog

    この記事は、はてなエンジニアアドベントカレンダー2016の5日目の記事です。 こんにちは、はてなでアプリケーションエンジニアをしている id:shiba_yu36 です。先日、buildersconにおいて、現在所属しているプロジェクトJavaScriptのユニットテストを導入した知見について、「一から始めるJavaScriptユニットテスト」というタイトルで発表しました。 speakerdeck.com この発表は、実際にJavaScriptのユニットテスト環境を作ってみると非常にハードルが高いと感じたので、そのハードルを少しでも下げられればという思いで、非常にシンプルな例で一から環境を作る例を紹介しました。アジェンダは次のとおりでした。 カクヨムのJS環境 JSのテストツールを整理する 通常の関数のユニットテスト DOM操作する機能のユニットテスト カクヨムのJS環境や、JSのテスト

    一から始めるJavaScriptユニットテスト - Hatena Developer Blog
  • [JS]スマホの「プルダウンするとリフレッシュ」を簡単に実装できるスクリプト -PulltoRefresh.js

    スマホやタブレットの便利操作、プルダウンするとリフレッシュできる機能をページに簡単に実装できるJavaScriptの軽量ライブラリを紹介します。 リフレッシュは範囲やトリガーを設定でき、通常のプルダウンしてリフレッシュする挙動だけでなく、ヘッダを残してコンテンツだけというのもできる優れ物。 PulltoRefresh.js PulltoRefresh.js -GitHub PulltoRefresh.jsのデモ PulltoRefresh.jsの使い方 PulltoRefresh.jsのデモ デモはスマホ、タブレットでご覧ください。 ※デスクトップ環境では動作しません。 という訳で、iPadでデモページを見てみました。 デモではリフレッシュ時に、アラートが表示されます(もちろん無しにできます)。

    [JS]スマホの「プルダウンするとリフレッシュ」を簡単に実装できるスクリプト -PulltoRefresh.js
  • JavaScript Promiseの本

    この書籍はCreative Commons Attribution-NonCommercialの ライセンス で公開されています。 また、PDFとしてレンダリングしたバージョンは以下からダウンロードすることができます。

    JavaScript Promiseの本
  • http://frogstech.com/blog/2015/08/28/bootstrap-datepicker/

    http://frogstech.com/blog/2015/08/28/bootstrap-datepicker/