JavaScript Patterns Workshop | JavaScript Patterns
The content is based on Patterns.dev - a free online resource on design patterns and component patterns for building powerful web apps with vanilla JavaScript and React. The patterns covered on this website and in the workshop can guide you when facing a problem other developers have encountered many times before, but are not a blunt tool for jamming into every scenario. The goal is to raise aware
コード変更で抜け漏れやミスを少なくするための習慣 - $shibayu36->blog;
自分はこれまでの仕事で、バグ修正や機能追加でPullRequestを送るときに、考慮の抜けもれやケアレスミスが非常に少ない方であると思っている。振り返ってみて、これは自分に課している習慣が大いに効いていると思っているので、メモしておく。 毎回のcommit時 必要な部分だけをgit addし、git diff --cachedによって差分をセルフコードレビューした上でcommitする PullRequest作成時 filesの内容をセルフコードレビューし、直した方が良い部分は直す + わかりにくい部分にGitHub上でラインコメントを行う + コード上にコメントを残した方がいいならコメントする ユーザーの導線に影響するコードなら、必ず自動テストだけでなく、自分自身でユーザーの行動をトレースし、違和感がある部分が存在しないかチェックする。チェックした流れについては、PullRequest上に
カスケードレイヤー「@layer」でCSSの実装がどう変わるのか、仕組みと基礎知識、さまざまな使用例を徹底解説
CSSの新機能「カスケードレイヤー」がいよいよ主要ブラウザすべてにサポートされます。Firefox 97（先月リリース）とChrome 99（3/1リリース）でサポートされ、そしてSafariでは次期バージョンでサポートされる予定です。 カスケードレイヤー@layerを使用すると、CSSの詳細度とスタイルの順番をカスケード内で明示的にレイヤー化（階層化）でき、これまでのCSSの実装方法が大きく変わります。 カスケードレイヤーの仕組みと基礎知識、さまざまな使用例を紹介します。 Hello, CSS Cascade Layers by Ahmad Shadeed CSSのカスケードレイヤーについて知識を得たい人は、下記の記事もお勧めします。 CSSの新機能カスケードレイヤー「@layer」CSSをレイヤー化して扱え、今までの実装方法が大きく変わる！ CSSの新機能カスケードレイヤーが主要ブラウ
セキュリティ資格一覧｜セキュリティ資格の解説とその取得メリット・選択ポイント（上）
サイバー攻撃が高度化し被害が深刻化するにつれ、その防御には専門的なスキルが不可欠となっています。セキュリティ担当者の深い知識と豊富な実務経験が求められているのです。 そのスキルを証明するものにセキュリティ資格があります。セキュリティ資格の種類も多数あり、受験者の増加傾向も見られるようになってきました。これらセキュリティ資格には、どのような職種向けに、どのようなものがあるのでしょうか。また、取得することで、個人や企業にどのようなメリットがあるのでしょうか。 ここでは、主にセキュリティ資格の取得メリットと選択ポイントを2回に分けて紹介します。 セキュリティ資格は多くの種類があり、その数も増えつつあります。国が制度として実施しているものもあれば、ベンダーが展開しているセキュリティ資格もあります。中間に位置するものとして、団体が提供するセキュリティ資格もあります。 さらに、日本国内のみならず、海外
【個人的に】Dockerがはかどる小技 - Qiita
初めて知ったときは感動したけど 自分の中で知ってて当然になってしまった小技をまとめました まだこの小技を知らない人に届いてくれるとうれしい Dockerfile RUNを1つにまとめる
コミットはスナップショットであり差分ではない
Git は紛らわしいという評判です。用語や言い回しが意味するものと、そこから想像する挙動が違ってユーザーが混乱すると言われます。これは、git cherry-pick や git rebase のような「履歴を書き換える」コマンドに最も顕著です。私の経験では、この混乱の根本的な原因は、コミットは 差分 であり順番を入れ替えることができるという解釈にあります。しかし、コミットはスナップショットであって、差分ではありません! Git がリポジトリデータをどのように保存しているかを見てみると、Git を理解しやすくなります。このモデルを調べた後に、この新しい視点が git cherry-pick や git rebase のようなコマンドを理解するのにどのように役立つのかを探っていきます。 本当に深く 掘り下げたいのであれば、Pro Git という書籍の Git Internals の章を読むと
UXにおけるビジュアルデザインの5つの原則
スケール、視覚的な階層、バランス、コントラスト、ゲシュタルトの原則を正しく適用すれば、美しいデザインを生み出せるだけでなく、ユーザビリティも向上させられる。 5 Principles of Visual Design in UX by Kelley Gordon on March 1, 2020 日本語版2020年12月17日公開 ビジュアルを見たとき、我々はそれが魅力的か不愉快かを、通常、すぐに判断できる（なぜならば、こうした判断は、Don Normanのエモーショナルデザインのモデルでいうところの、本能レベルで展開されることが多いからだ）。しかしながら、レイアウトが視覚的に魅力的である理由を言語化できる人はほとんどいない。だが、優れたビジュアルデザインの原則をグラフィックに活かすことで、エンゲージメントを促進し、ユーザビリティを向上させることは可能である。 ビジュアルデザインの原則は、
CSSの見過ごしがちだけど興味深い実装テクニック、ホバーでラインを引いて逆方向で元の状態に戻すエフェクト
先日、当ブログで紹介したThe State of CSS 2020（紹介記事）に使用されているホバーエフェクトが話題になっていたので、紹介します。 テキストリンクをホバーすると、ラインを引くまでは普通のアニメーションですが、ホバーを外した時に通常とは逆方向で元の状態に戻ります。 ラインが一方向にスーッと通り過ぎるような感じです。
Command Line Interface Guidelines
Contents Command Line Interface Guidelines An open-source guide to help you write better command-line programs, taking traditional UNIX principles and updating them for the modern day. Authors Aanand Prasad Engineer at Squarespace, co-creator of Docker Compose. @aanandprasad Ben Firshman Co-creator Replicate, co-creator of Docker Compose. @bfirsh Carl Tashian Offroad Engineer at Smallstep, first e
CSSの疑似クラス「:focus-within」が素晴らしい理由
CSSの疑似クラス「:focus-within」を使用して、フォームの入力時にハイライト表示させるテクニックを紹介します。 :focus-withinは適用した要素の子孫要素にフォーカスに当たった時に起動するセレクタで、効果的に使用すると非常に便利です。 Why CSS :focus-within is amazing by Chris Bongers 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに HTMLの構造 CSSの疑似クラス「:focus-within」 :focus-withinの効果をより素晴らしいものにする :focus-withinのサポートブラウザ はじめに ここでお話するのは、フォーカスされた要素にスタイルする:focusセレクタのことではありません。:focus-withinは、その中の子孫要素
Dropboxが新開発した「非同期処理フレームワーク」はどのように構築されているのか？
複数のプログラムを順番に処理していく同期処理システムでは、どこかひとつの処理に時間がかかると後続の処理がまるごと遅れてしまいます。そんな同期処理に対し、ある処理の完了を待たずに次の処理を実行できるのが非同期処理。重たい処理によるボトルネックを回避できるため、ウェブサイトの応答速度改善などに役立てられています。クラウドストレージサービスのDropboxで開発が進められていた大規模な非同期処理フレームワークについて、同社のエンジニアであるArun Sai Krishnan氏が解説を行っています。 How we designed Dropbox’s ATF - an async task framework - Dropbox https://dropbox.tech/infrastructure/asynchronous-task-scheduling-at-dropbox これまでDropb
Cookie規制が招くWeb体験の危機
欧州委員会はWebを破壊していると私は考えるようになりました。ユーザーのプライバシーを守ろうとする彼らの試み（GDPRやクッキー法とも呼ばれるeプライバシー指令）は、クッキー通知とプライバシーポリシーのオーバーレイの氾濫という予期せぬ結果を引き起こしました。 事実、平均的なユーザーの立場からすると、ネットワーク中立性の崩壊よりもクッキークライシスの方が、日々のWeb上での体験においてダメージが大きいと言えます。 それでも、ネットワーク中立性に関わるものと同じような組織的抵抗は、クッキー通知の異常性に対してはほとんど発生していません。私たちは、その意図が良いものであるために受け入れているのです。 誤解しないでほしいのですが、その意図自体は良いことです。どのサイトがトラッキングしてOKで、どの情報を収集しても良いかの主導権はユーザーが持つべきです。欧州委員会の取り組みは評価に値します。ただし、
《特別開講》社会人のためのデータサイエンス入門
2020年9月29日開講予定の「社会人のためのデータサイエンス演習」にさきがけて、「社会人のためのデータサイエンス入門」を特別開講いたします。 入門編と演習（実践編）を受講することで、データ分析の基本的な知識から、ビジネスの現場で使われる実践的なデータ分析（統計分析）の手法までを身につけることができます。 「社会人のためのデータサイエンス演習」はこちらのページをご参照ください。 講座内容 今、ビジネスの現場では、統計的な思考力によって様々な課題を解決していく能力、すなわち"データサイエンス"力の高い人材が求められている。このようなことを踏まえ、本コースでは"データサイエンス"力の向上を目指し、事例なども踏まえ、データ分析の基本的な知識を学ぶ。 コースは4つの部分に分かれている。第1週では、社会でデータがどのように活用されているかについて、実際のデータを用いた分析事例を紹介する。第2週では、
API Gateway 開発者に読んでほしい、意味がわかると便利な実行ログ - Qiita
API Gateway (REST API) では、開発やトラシューに役立つ実行ログ (Execution Logs) を出力することができます。 AWS サポートに問い合わせる際にも、この実行ログがあるとスムーズです。 実行ログは、ステージから設定できます。 設定後、API Gateway にリクエストを投げると、CloudWatch Logs に出力されます。 ロググループ名は、API-Gateway-Execution-Logs_<API ID>/<ステージ名> です。 こちらの実行ログの内容を解説していきます。 リクエスト/レスポンス API Gateway に Postman から以下のようにリクエストを投げます。 パスパラメータ groupId=111、クエリパラメータ userId=222、本文に name=hoge を指定しています。 API Gateway はこのリクエス
マルチスレッド・プログラミングの道具箱
まえがき クラウド上の仮想サーバから手元のスマートフォンまで、いまや複数のCPUコアを搭載するマルチコアはどこにでもある環境になりました。ハードウェア側が並列(Parallel)・並行(Concurrent)処理に向けて急速に進化する一方で、ソフトウェア側つまりプログラミング言語の進化はさほど追い付いていません。並行処理記述の手軽さを求めた Go言語 や、マルチスレッド処理の安全性を重視する Rust言語 などが登場してはいるものの、「普通にプログラムを記述するだけで複数CPUコア環境で高速に走るプログラミング言語」は遠い夢物語のままです。 モダンなプログラミング言語や並列・並行処理ライブラリは、複雑で難解なマルチスレッド処理を直接記述しなくてすむよう、安全性・利便性の高い抽象化レイヤを提供します（例：Go言語のgoroutineとchannel、Rust言語の Rayonライブラリ）。し
マンション光回線の配線方式のお話 - notokenの覚書
これは マンション光配線の方式別になぜ速度が出ないのか？を解説する資料 配線方式によって天地の差が出るマンションタイプの回線を、できる限り快適に利用したい人向けの情報 付随情報として、J:COMとかのCATVの話や、UCOM光とかBB4Uとかのマンション共有インターネットの話も載せておく (注意) 一部例外はあります。例外につきましては、「そういうこともある」だと思って下さい。 想定すべき前提知識 フレッツ光やauひかりの分岐数は方式に関わらず 1収容 あたり 最大で 32 回線 となる 光配線方式はGE-PONの仕様上、どの事業者でも最大分岐数は32分岐となる NUROの採用するG-PONは規格上の最大分岐数は64~254となっているが、実際の運用は資料がないのでわかりません NTT の シェアドアクセスを利用している以上、8以上、8の倍数(8, 16, 24, 32, .... )分岐
vmlinuxのヒミツ - VA Linux エンジニアブログ
1. vmlinuzの怪 2. vmlinuxの入手 3. ELFファイル 4. ELFセクション 5. セクションの意味 6. Linuxのセクションとldscript 7. .cpuidle.textセクション 8. おわりに 執筆者 : 箕浦 真 1. vmlinuzの怪 Linux (カーネル) のファイル名といえば、/boot/vmlinuz-<version>だ。なんでlinux-<version>とかじゃないのだろうか。 vmの方は、これはおそらくBSD Unixのカーネルvmunixに倣ったものだろう。ベル研究所のResearch Unixを、VAXのハードウェアを生かして仮想記憶 (Virtual Memory) 機能を大幅に強化したため、vmunixとした。 zの方は、これは圧縮されていることを表す。なぜZで圧縮なのかはよくわからないが、圧縮の意味なのだ *1。 現在一
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript 今ドキな書き方 ES2020