Big Changes Ahead for Deno
TLDR: We’ve been working on some updates that will allow Deno to easily import npm packages and make the vast majority of npm packages work in Deno within the next three months. Our goal is to make Deno the fastest JavaScript runtime. For starters, the next release of Deno will include a new HTTP server. It is the fastest JavaScript web server ever built. Given the extensive use of Deno by develop
チームで高品質なコードを追求するための「設計標準」の育て方 / loglass coding standard
ログラスでは、チームとして高品質なコードを追求するために「設計標準」というものを定め、チームで育てています。 この資料ではそのような取り組みについてご紹介します。 株式会社ログラス会社紹介資料 https://speakerdeck.com/loglass2019/whats-loglass ウラ凸 - シリーズA 17億円調達のログラスのウラ側へ、カジュアル面談で突撃しよう https://meety.net/articles/t2--zrl4ohf4gx6 外部公開している設計標準の資料 https://little-hands.hatenablog.com/entry/2022/01/28/programming-principle https://little-hands.hatenablog.com/entry/2022/01/24/domain-object-design
お前らはまだ img タグの alt 属性の付け方を間違っている - Qiita
1行で alt属性は、「全ての 画像をそのalt属性のテキストに置き換えたときにページの意味が変わらない 」ようにつける。 （HTMLの標準規格書より） マジでこれに尽きる。 具体例 例１：ロゴ ❌ 間違ったマークアップ
Practice Live Job Interviews - For Free
Pramp definitely played a role in my performance. Nothing beats mock coding interviews. I still remember my first coding interview [...]a few years back with another company. I was so nervous, and shaking..., and sweating... needless to say, I failed it. It's come a long way since then. Believe it or not, this time I wasn't even nervous when the day came. It was just another regular day with a set
MPEG-5 EVCコーデックメモ - Qiita
https://mpeg.chiariglione.org/standards/mpeg-5/essential-video-coding 正式名称「MPEG-5 Part 1 Essential Video Coding」 ISO/IEC 23094-1 Essential video coding 特許問題により普及しないH.265/HEVCコーデックの代替を狙った、ライセンス・フレンドリ(licensing-friendly)な動画像コーデック。 目的 ロイヤリティフリー(RF; Royalty-Free)な枯れた技術1のみを用いる Baseline Profile と、特許技術を用いてより高効率を目指す Main Profile という2オプションを提供する。 ロイヤリティフリー・コーデック運用ができるよう、任意の Main Profile 向け符号化ツールは選択的に無効化可能。
2022年、注目しておきたいCSSの新機能のまとめ
2022年に注目しておきたいCSSの新機能を紹介します。いくつかの機能はすでに1つ以上のブラウザでサポートされており、他のブラウザもそれに続く予定です。 ビューポートではなく親コンテナに応じてスタイルを定義できる「コンテナクエリ」、詳細度とスタイルの順序を明示できる「カスケードレイヤー」、相対色構文が追加された「カラー関数」、Safariの100vhを解決する新しいビューポート単位「svh」など、今すぐにでも使用したい機能ばかりです。 Photo by Jr Korpa on Unsplash CSS in 2022 by Bramus 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 注目の新機能（クロスブラウザでサポート） まだ先の新機能（実験的/シングルブラウザでサポート） 停滞している新機能 Safariは「新し
Coding Font by Typogram – Find Your True Love of Coding Fonts
Coding Font Blog As software engineers, we spend a lot of time skimming, reading, making changes to code. The coding font that we spend 8 hours a day staring at has a lot to do with our productivity and comfort. That is why I created this gamified experience to help you find your true love of coding fonts! Coding Font is built with NoCode / LowCode tools! I share the process of building apps on my
このCSSなら簡単！フォームのチェックボックス・ラジオボタンとテキストをベースラインに揃えて配置
フォームの実装で面倒なのがフォーム要素とテキストを揃える、特にチェックボックス・ラジオボタンとテキストをベースラインに揃えることです。 flexboxでalign-item: baseline;を使用すると、チェックボックス・ラジオボタンとテキストを揃えるのは簡単に実装できます。複数行のテキストにも対応します。 <div class="flex-demo --start checkbox-input"> <label for="demo"><b>flex-start</b> 複数行の長いテキストでも大丈夫</label> <input type="checkbox" id="demo"> </div> <div class="flex-demo --center checkbox-input"> <label for="demo2"><b>center</b> 複数行の長いテキストでも大丈
これが完全版！レスポンシブ対応のwebp画像を実装するHTMLのコード
画像を実装するには、以前はimg要素にsrcで画像を指定するだけで簡単でしたが、レスポンシブ対応、Retina対応、遅延読み込み、そしてさまざまな画像フォーマットの登場により、HTMLのコードが複雑になっています。 レスポンシブ対応のwebp画像を実装するHTMLのコードの完全版を紹介します。非サポート用のフォールバックにも対応しており、コピペで簡単に使用できます。 A picture element to load correctly resized webp images in HTML by Stefan Judis 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 2021年現在、画像の主要フォーマット 新しい画像フォーマットを読み込むための取り組み 最初のステップ: picture要素でwebp画像を読み込むには 完全版
現在のGoogle HTML/CSS Guide コーディング規約/日本語訳
コーディングを勉強している方や、普段当たり前のようにコーディングしているけれど、上手く使えているのか不安な方向けにGoogle HTML/CSS Guideの翻訳記事を書きました。（2024年02月29日更新） 色んな方のコーディングを見ていると実に様々。情報や知識が古いままで、今では推奨されない書き方も散見されます。 特に仕事で使っていると、誰かに指摘されない限り自分のコーディングを見直す事は無いかもしれません。 ですがW3Cの定めたHTML5の廃止など、変化の速い業界では定期的な見直しは勿論、何か指標となる物があると安心です。 そこで今回はGoogleが用意しているgoogle html/css style guideのドキュメントを元に、Googleコーディング規約と要点を解説。このコーディングガイドラインが絶対的な正解では無いかも知れませんが、参考になれば嬉しいです。 Google
【保存版】CSS Flexboxでレスポンシブ対応のレイアウトを実装するHTMLとCSSのシンプルなコードのまとめ
CSS Flexboxで実装するWebページでよく見かけるレスポンシブ対応のレイアウト、カードレイアウト、ナビゲーションバー、サイドバー、聖杯レイアウトなどのHTMLとCSSのコードを紹介します。 コードは非常にシンプルなので、テンプレートやスニペットとして再利用できます。 Master CSS Flexbox 2021 🔥- Build 5 Responsive Layouts🎖️|| CSS 2021 by Joy Shaheb 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 Flexboxの構造・各プロパティと値 実装の準備 Level 1: シンプルなカードレイアウト Level 2: ナビゲーションバー Level 3: サイドバー Level 4: 少し複雑なカードレイアウト Level 5: Holy Grai
えっ、著作権の帰属を表すHTMLタグがあるんですか？ - Qiita
smallタグ smallタグです。 かつては文字を小さく表示するために使われるタグでしたが、今ではセマンティックな役割が与えられています。 そのうちの1つが著作権の帰属を表すです。 なんでこの記事を書いたのか smallの役割って意外と知られていない気がする 最近レビューで連続でこの話をした という2つの理由から記事を書きました。 内容の補足 コピーライト表記ってありますよね？ © 2019-2021 Example Corporation All rights reserved. みたいなやつです。 色々なサイトのマークアップを見学していてspanタグで実装されていることが多いことに気がつきました。 しかしHTML Living Standardのsmallタグの章を見てみると Small print typically features disclaimers, caveats, l
Micro Frontends Architecture Patterns
本書は、Micro Frontends Architecture Patternsというタイトルを付けていますが、モノリスからJAMstack、Micro Frontendsまで、Webフロントエンドを包括した様々なアーキテクチャパターンの詳細を体系的に紹介しています。 ソフトウェアとしてのアーキテクチャ全体を俯瞰し、他のシステムとのやりとりを設計するような考え方が役に立つことは多いです。フロントエンド観点で、様々なアーキテクチャパターンをまとめることで、Web開発の助けになればと考えています。 また、アーキテクチャの歴史と変遷を知ることで「Micro Frontends」への理解を深めることができると筆者は考えました。Micro FrontendsはThoughtWorksのTechnology RadarではすでにADOPTとなり、海外で多くの事例が存在します。Micro Fronte
async/await は Promise を置き換えない - Okapies' Archive
まとめ async/await 構文は、Promise で書ける処理のうち特定のケースしか表現できない 特定のケースとは、ある非同期処理の前処理と後処理がそれぞれ 1 個ずつの場合のみである async/await 構文は初心者に非同期処理を導入する際に適しているが、非同期処理を逐次処理として書けるという幻想を与えるので、どこかで知識をアップデートする機会を設けるべきである この記事はなに？ 少しバズったのでまとめておこうかと。 「async/await があれば Promise なんて難しいものは要らない！」とか言ってるウブな子に、複数の API に並列にリクエストを投げて一つ以上成功した時だけ先に進む、みたいな問題を与えて愛でてみたい。— Yuta Okamoto (@okapies) 2020年12月11日 async/await は Promise のネストを手続き的なコードに見え
CSS組版 Vivliostyle ユーザーと開発者の集い 2020秋
小形克宏 @ogwata CSS組版 Vivliostyle ユーザーと開発者の集い 2020秋 vivliostyle.connpass.com/event/189940/ 開会しました！ 質問などあれば、#vivliostyle をつけて呟いてください。適宜こちらで拾って、16:40からのQ&Aセッションでぶつけます。 2020-10-24 13:06:44
マルチスレッド・プログラミングの道具箱
まえがき クラウド上の仮想サーバから手元のスマートフォンまで、いまや複数のCPUコアを搭載するマルチコアはどこにでもある環境になりました。ハードウェア側が並列(Parallel)・並行(Concurrent)処理に向けて急速に進化する一方で、ソフトウェア側つまりプログラミング言語の進化はさほど追い付いていません。並行処理記述の手軽さを求めた Go言語 や、マルチスレッド処理の安全性を重視する Rust言語 などが登場してはいるものの、「普通にプログラムを記述するだけで複数CPUコア環境で高速に走るプログラミング言語」は遠い夢物語のままです。 モダンなプログラミング言語や並列・並行処理ライブラリは、複雑で難解なマルチスレッド処理を直接記述しなくてすむよう、安全性・利便性の高い抽象化レイヤを提供します（例：Go言語のgoroutineとchannel、Rust言語の Rayonライブラリ）。し
【Python】良い書き方と悪い書き方を知って中級者を目指す🐍 - Qiita
Pythonでコードを書くときのGood/Badプラクティス こちらの記事は、DuomlyによりDev.to上で公開された『 Good and Bad Practices of Coding in Python 』の邦訳版です（原著者から許可を得た上での公開です） 元記事：Good and Bad Practices of Coding in Python ※ 記事の内容に注意すべき点と誤りがあるので、詳しくは注釈まで目を通すことをおすすめします。 （以下、翻訳した本文） この記事は元々 https://www.blog.duomly.com/good-and-bad-practices-of-coding-in-python/ に公開されたものです。 Pythonは可読性を重視した高水準のマルチパラダイムプログラミング言語です。Pythonは、「Pythonの禅」、別名ではPEP 20と
H.266/VVCコーデックメモ - Qiita
H.266/VVC(Versatile Video Coding) ITU-T Rec. H.266 Versatile video coding ISO/IEC 23090-3 MPEG-I Versatile Video Coding H.264/AVC および H.265/HEVC の直接後継となる動画像コーデック国際標準規格。 "Versatile"＝多用途 とあるように、HD～UHD(4K,8K)解像度をもつSDR／HDR(Standard／High Dynamic Range)動画像、360°パノラマ動画像、Light-fieldカメラ、スクリーンコンテンツまで広範な用途での利用を目指している。 コーデック性能比較 新しい H.266/VVC コーデックは、一世代前の H.265/HEVC コーデックにくらべると1： 同等の客観的画品質(PSNR-Y)であれば、ビットレートを
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Warp: Your terminal, reimagined
ytt playground