Reduxが分からない人のためにReduxを概念から説明してみる - Qiita
TL;DR 要点だけ知りたい方は、最後の方だけ読めば大丈夫です。 背景:Reduxが全然わからないのでちゃんと勉強した 開発現場にReduxを導入しておきながら、チーム全員が「全然分からない。俺達は雰囲気でReduxをやっている」状態だったので、本腰入れてドキュメント読みました。基本を押さえたら一気に見通しが良くなったので、説明します。色々なサイトやドキュメントは明らかに冗長な説明多いので、極限までエッセンシャルを絞って説明することで、ゼロ知識からでもある程度、理解できるレベルの説明に落とし込むことに挑戦しました。うちの開発チームで知見として残すために作成したものですが、需要がありそうかなと思ったので、公開します。需要がなければすみませんでした。おかしな点があれば、まさかりお待ちしております。 今回は、公式ドキュメントのBasics辺りの話まで。 Reduxの主な登場人物 Reducer
技術書典4で販売された「DNSをはじめよう」をフォローする感じの記事にしたい - Qiita
はじめに 技術書典4にて「DNSをはじめよう」が販売され、400部あったはずの紙の本の在庫がなくなり、その後まもなくしてダウンロード用のカードも溶けるようになくなるという現象が発生しました。 自分も午後に会場入りして買いに行ったら「ダウンロード版も売り切れた」と言われショックを受けるものの、ダウンロード版については追加生産をしているとの事なので、ほどなくして再度ブースを伺ったら無事に買う事ができました。 尚、今現在もBOOTHにてPDF版が販売されています。 内容については「さぁDNS！」…の前にドメイン名の取得から丁寧に書いており、ドメイン名の取得からDNS設定の流れを体感するにはちょうどいい本ではないかなと。 なお、ドメインを利用する為にはレジストラやどこかのリセラー経由で登録料を払いドメイン名を登録してもらう必要があり登録手順も様々であるなか、お名前.comからの取得を例にして説明し
モナドを理解するために JavaScript で例外モナドを実装してみた - Qiita
モナドを理解するために Monads for functional programming の例題にある例外モナドを JavaScript で実装してみたのでメモっとく。 戻るボタンをクリックする前に無心で写経してみてほしい。Web ブラウザーの JavaScript コンソールで試せるようにしてあるので！ ちなみに、モナドを理解するために書いたコードなので JavaScript でモナドを実用する上では役に立たないのでご注意を。 前提知識 コードを簡潔に表現するために下記のような言語仕様を活用する。 アロー関数 アロー関数を活用して関数を簡潔に表現する。 var add = (n, m) => n + m; // var add = function(n, m) { // return n + m; // }; // var mul = n => m => n * m; // var m
ID生成大全 - Qiita
セッションIDやアクセストークン、はたまた業務上で使う一意の識別子など、いろんなところで一意のIDを生成しなきゃいけないケースが存在します。 そこで世間で使われているIDの生成方法について調べてみました。 選択基準 ID生成における要求として、以下の観点が上げられるかと思います。 生成の速度 大量にデータを短期間で処理し、それらにIDを付与する場合、ID生成そのものがボトルネックとなることがあります。 推測困難性 IDを機密情報と結びつける場合、IDを改ざんされても、機密データが見れないようにできている必要があります。 順序性 採番した順にデータをソートする必要がある場合は、IDがソートキーとして使えないといけません。 それぞれについて各生成手段を評価します。 ID生成の手段 データベースの採番テーブル 採番用のテーブルを作り、そこで番号をUPDATEしながら取得していくやりかたです。古い
広告の効果測定サービスで利用している、計測用のJavaScriptタグでSafariのITP対応した話 - Qiita
広告の効果測定サービスで利用している、計測用のJavaScriptタグでSafariのITP対応した話JavaScriptSafaricookie はじめに この記事は下記の勉強会での発表資料になります 自己紹介 株式会社オプト シニアエンジニア @sisisin GitHub Twitter フロントエンドマン（Angular,AngularJS中心） Scalaも少々 最近はスクラムマスターやってます 先日、Safari11にてIntelligent Tracking Prevention(以下ITP)という機能がリリースされました ITP機能はユーザーのプライバシー保護のためにCookie利用に制限をかける機能で、これにより弊社の広告の効果測定サービスのユーザー行動の計測部分にも影響が出ました 最前線で使われるリアルなJSフレームワーク事情！ という題目とはちょっと逸れてしまいますが
WPTをChromeで実行してHTML5 APIを理解する - Qiita
WPTとは WPT (web-platform-tests)という、ブラウザを作っている人のためのテストスイートがある。これは、ブラウザがどう動くべきかを定義している様々なWeb標準を、各ブラウザが満たしていてるかを確認するためのテストなのだが、Webサイトを作っているWebデベロッパーが新しいWebのAPIをどう使ったらいいかを調べるときにも役立つと思う。 という話を、電車で横に座っていたとある人に話したら「じゃあ、やり方を(日本語で)紹介してくださいよ。」と言われたので、簡単に紹介したい。 手軽に試す 手軽に試したければ、https://w3c-test.org 以下にある目的のテストファイルを開くといい。 例えば、Service Worker Navigation Preloadのテストであれば https://w3c-test.org/service-workers/service
HTTPで「418 I’m a tea pot」を実装してはいけない(2018/10/18追記) - Qiita
418 I’m a tea potとは ステータスコード 418 I’m a tea potは、エイプリルフールに発行されたジョークRFCであるRFC2324「Hyper Text Coffee Pot Control Protocol」 で定義されているステータスコードです。 Googleでも 418 を返すURLがあります。 Error 418 (I’m a teapot)!? https://www.google.com/teapot 昨日、golangとnodejsにおいて、418 I’m a tea pot の実装を削除するIssue が投げられています。 golang: net/http: remove support for status code 418 I'm a Teapot nodejs: 418 I'm A Teapot #14644 Issue中でも書かれている通
2年目のErlangプログラマが身につけておきたい12のデバッグ術 - Qiita
吐かせる方法には以下の方法があります. VM上でerlang:halt("slogan")を実行する kill -SIGUSR1 ${PID} でVMを殺す CrashDumpは読める Erlangのcrash dumpは人間が割と読めますが, 問題発見を早める為に以下のツールが有用です. CrashDumpViewer erl_crashdump_analyzer 自分がよく使うのは後者です. 前者はGUI環境が必要なので運用している環境だと辛いかもしれません. また, 後者は最初に知りたいであろうことしか出力しないので迷うことがないと思います. 細かい部分は直接dumpを読むので私は困りませんでした. binary部分を読む必要がある場合は, binppのfrom_str/1を使っても良いかもしれません. 8割方メッセージキューが詰まる時が問題が起きる時 私の経験上の話です. ログは一
JavaScriptの循環importを図で可視化してみた - Qiita
先日、JavaScriptファイルのロード中に、循環importによる初期化エラーが出て困ったので、図をつくって可視化してみました。 生成物は一番下にあります。 JavaScriptにおける他ファイル参照 ブラウザ上で動くJavaScriptコードを書くうえでは、奇妙な制約が多々あります。 言語自体が奇妙な場合も多いですが（本当に多い！）、他ファイルのimport的な機能は、もともと「ブラウザが通信してソースファイルをダウンロードしないといけない」という都合もあるため、なかなかに無茶な仕組みになっています。 そもそも最近までimport自体が存在しなかったので、適当なライブラリで専用の記法を使うか、トランスパイラで糖衣構文に変換するという手法が用いられています。 2015年のECMAScript2015（ES6）でようやくimportという構文が仕様に入りましたが、今のところどのブラウザも
OAuth 2.0 全フローの図解と動画 - Qiita
RFC 6749 (The OAuth 2.0 Authorization Framework) で定義されている 4 つの認可フロー、および、リフレッシュトークンを用いてアクセストークンの再発行を受けるフローの図解及び動画です。動画は YouTube へのリンクとなっています。 English version: Diagrams And Movies Of All The OAuth 2.0 Flows 追記 (2019-07-02) 認可決定エンドポイントからクライアントに認可コードやアクセストークンを渡す方法については、別記事『OAuth 2.0 の認可レスポンスとリダイレクトに関する説明』で解説していますので、ご参照ください。 追記（2020-03-20） この記事の内容を含む、筆者本人による『OAuth & OIDC 入門編』解説動画を公開しました！ 1. 認可コードフロー RF
今、Reactでリポジトリ公開するなら、これくらいは対応しておきたい - Qiita
趣味で作ったwebサービスのリポジトリをgithubに公開して2ヶ月くらい フロントエンドのソースが雑だったので、リファクタリング中にした対応を紹介 前記事：Go + react + ansibleでサービスを作ってOSSにしてみた http://qiita.com/wheatandcat/items/66d72445ad0c5df2a8be github 記載している内容は、下記のリポジトリに取り込み済みの内容です。 うまく動かなかったら、こちらから動きを見てもらえたらと思います。 ■dotstamp_client https://github.com/wheatandcat/dotstamp_client flow javascriptでも型が使えるようになるライブラリ。 ファイル単位で実装していけるから、稼働中のプロジェクトでも柔軟に導入していけるのが魅力。 導入的にはファイルの頭に
erlang + rebar3 + cowboyの最小構成 - Qiita
並列分散処理を得意とするerlangという関数型言語に興味のある方は多いではないでしょうか？ 自分は身近にerlang識者がいたため、興味を持つ事になりました。 今回は、そんなerlangの入門として 「erlang + rebar3 + cowboy」 でHTTPサーバを構築したいと思います。 erlangについて 並列分散処理に強い関数型言語。 OTP（Open Telecom Platform）フレームワークがすばらしい。 参考書の受け売りなので、ニュアンスが間違っているかもですが、大体こんな感じで書いてました。 rebar3について Erlangアプリケーションのコンパイル等一括で行ってくれる便利なツール。 また、erlangモジュール等のdependencies（依存関係）を一括管理してくれたりもしています。 rebar3より以前にrebarが存在しましたが2016年6月現在は非
Erlangパフォーマンス・チューニング - Qiita
-module(httpd_tcp_listener). -export([start_link/0]). start_link() -> Pid = spawn_link(fun init/0), {ok, Pid}. init() -> Port = 8888, Backlog = 10244, Options = [binary, inet6, % support both ipv4 and ipv6 {active, false}, {reuseaddr, true}, {backlog, Backlog} ], {ok, Listen} = gen_tcp:listen(Port, Options), accept(Listen). accept(Listen) -> case gen_tcp:accept(Listen) of {ok, Socket} -> {ok, Pid}
小〜中規模サイトのフロントエンド・コーディング規約 CSS・JavaScript編 - Qiita
2021/3/16 初めて記事を書いてから３年以上経過してしまったので、 内容を見直ししました。 関係者が10名以下の小〜中規模案件の開発・保守が多い弊社のCSS・JavaScript規約（にしたい）です。 長くなってしまったコーディング規約もようやく最後です。 ↓関連 環境構成編 HTML編 CSS、JavaScript は数年で書き方が変わってしまうので、 定期的に規約の見直しができると理想ですね。 小〜中規模サイトのフロントエンド・コーディング規約 CSS編 ディレクトリ構成 CSSに関するファイルの一般的な例を示します。 ルート ├ src ... 作業ディレクトリ │ ├ scss │ │ ├ lib ... 外部ライブラリなど │ │ ├ sprite ... spritesmith などで生成したファイル │ │ ├ foundation (base) ... 変数や mix
ゼロから始めるWebAssembly - Qiita
学習記録 WebAssemblyとは ブラウザ上でクライアントサイドのスクリプトとして効率的に動くバイナリフォーマットです。 現在JavaScriptより軽量で高速な処理を提供するためにベンダー各社で開発されています。 現時点ではDOM, WebAPIへのアクセスとかできません。GCもない。なので現状使いどころは重い処理をWebAssembly部分に投げ出すイメージです。 スレッドとかもFuture Workらしい。 https://github.com/WebAssembly/design/blob/master/FutureFeatures.md#threads もちろんWebを意識しているが、最終的にはWeb以外でも使えるような思想です。一つのバイナリを作ってしまえばどんなところでも動くようなReact Nativeのようなところを目指しています。 https://github.co
LinuxのCPU使用率の%stealについて - Qiita
はじめに Linux で採取できるCPU使用量(率)の情報として、%user や %sys 等に加えて %steal という量がある。これが追加されたのは、仮想化が広く使われはじめた10年くらい前だろうか。筆者は Xen を調べていて気づいたのだが、もっと前にs390のために追加されたのかもしれない。当時、ESXの場合も含めて調べていたのだが、最近、KVMの場合にどういう実装になっているのか、ふと気になって軽く調べてみたのでメモ。 CPU使用率の計算 まず最初に、sar や vmstat や mpstat 等、さまざまなツールでCPU使用率を取得することができるわけだが、どのような情報を元に、どのような計算を行って算出しているのか？ まず、kernel内ではboot以後の各種実行モードのCPU時間を分類して積算値として保持している。user モード、特権モード、割り込み処理に使った時間..
Webpacker を使わずに webpack で頑張る - Qiita
はじめに Rails で Sprockets を使ったフロントエンドの開発環境を webpack に徐々に移行していく話です。 Rails の開発環境と JavaScript 周りのエコシステムの話は度々話題に上がります。 Rails 5.1 から Webpacker が導入されるようですが、個人的には次のような思いがあります。 Rails のレールにはできるだけ乗りたいが、フロントエンド環境は分離したい 新しいヘルパを導入する必要がある ( javascript_pack_tag など ) Webpacker の開発速度に依存してしまうのが不安 そこで、以上の問題を踏まえつつ、スムーズに移行できるような構成を考えてみました。 方針 Sprockets のヘルパーや digest 機構はそのまま使う なるべく webpack で完結 (gulp や grunt のようなツール、rake タ
Rails5.1から導入されるwebpacker.gemは本当にRailsのフロントエンド開発に福音をもたらすのか? - Qiita
Rails5.1が今betaで出ていますね。中でも目玉はwebpacker.gemによるモダンなフロントエンド開発がRailsに導入されることでしょう。 今までのRailsのasset pipelineとは別に、yarnによって依存性を管理しwebpackで結合する独立したjsのビルドシステムがサポートされます。 これによって、以下のような従来のasset pipelineでは解決がむずかしかった問題への解が示されました。 coffee scriptへの依存 npmによる依存性、バージョン管理が難しい javascriptのライブラリが野良gem化されてupdateされない問題 webpacker.gemはyarn/webpackの薄いwrapperとなっていて、加えて幾つかのrakeタスクを追加することでフロントエンド開発をサポートします。 具体的には以下のような機能が提供されます。 y
【動画付き】Rails 5.1で作るVue.jsアプリケーション ～Herokuデプロイからシステムテストまで～ - Qiita
はじめに Rails 5.1ではJavaScript/index.html.erb周りのサポートが大きく改善されました。 これにより、Vue.jsやReactといったモダンなJSフレームワークをRails内で非常に扱いやすくなっています。 僕も実際に試してみましたが、本当にびっくりするぐらい簡単にVue.jsやReactを動かすことができました。 そこでこの記事ではRails 5.1とVue.jsを組み合わせたサンプルアプリケーションの作成方法をチュートリアル形式で、できるだけ詳しく説明します。 また、ローカルで動かしておしまい、ではなく、Herokuにデプロイしたり、テストコードを書いたりするところまでカバーします。 この記事自体は長いですが、実際に手を動かすと（スムーズに進んだ場合）30分以内で終わらせることができるはずです！ 今回作成するサンプルアプリケーション 今回は以下のリンク先
Rails4以降で正規表現の `^` や `$` を使うと怒られる訳。 - Qiita
こんにちは。18歳女子高生ながらエンジニアとして色々なところでアルバイトをしている 7coco です。 Rails で ArgumentError 先日 Rails で validation を書いていたら The provided regular expression is using multiline anchors (^ or $), which may present a security risk. Did you mean to use \A and \z, or forgot to add the :multiline => true option? (ArgumentError) と Rails に言われました。 要するに「^と$はセキュリティ的に問題があるかもよ。\Aと\zを使いたかったんじゃない？そうじゃなかったら :multiline => true をオプションで
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
