【2021年1月】今月読んだ良記事
1ヶ月間で読んだテック系記事の中でも良記事やニュース記事をピックアップし、自分用の備忘録と記事の拡散・共有の意図を込めて毎月まとめています。
CSS
- CSSの中央揃えで、最も万能で信頼できる実装テクニック | コリス
- Web制作者が知っておくと便利なCSSの小ネタ | コリス
- コピペで簡単!ボタンやテキストリンク、アイコンで使えるCSSのさまざまなアニメーション -CSSeffectsSnippets | コリス
- Tailwind CSSが私には合わなかった理由 | コリス
- aspect-ratio | CSS-Tricks
- caret-shape | CSS-Tricks
- caret | CSS-Tricks
- margin-block | CSS-Tricks
- How to Play and Pause CSS Animations with CSS Custom Properties | CSS-Tricks
- FlexBox Cheat Sheets in 2021 || CSS 2021 - DEV Community
- グラスモーフィズム?CSSコピペできる新Webトレンドの参考HTMLスニペット、ツールまとめ - PhotoshopVIP
- Centering in CSS
- 垂直方向のマージンにはmargin-topを優先的に使う理由 - Yuhei Yasuda
JavaScript
- State of JS 2020
- Animating with Lottie | CSS-Tricks
- Custom Properties as State | CSS-Tricks
- Theming and Theme Switching with React and styled-components | CSS-Tricks
- Optional Chaining Operator - DEV Community
- 7 Unique APIs for your next project - DEV Community
- 10 Awesome Free Courses for Devs by Devs - DEV Community
- 【Node.js】開発に必要な基礎知識まとめ - Qiita
- JavaScript ベスト・オブ・ザ・イヤー 2020 - Qiita
- とにかくJavascriptで同期処理 - Qiita
- ちょっと高度なJavaScriptの話 - Qiita
- webpackの基本だけどハマりやすいentryの設定と[name] - Qiita
- リーダブルテストコード - Qiita
- State of JavaScript 2020:いちばん利用率の高いJSフレームワーク、フロントエンドがReact、バックエンドはExpress、テストにはJest。2万4000人の調査結果 - Publickey
React
- Video Chatting and Screen Sharing with React, Node, WebRTC(peerjs) - DEV Community
- Push Notifications in ReactJS with OneSignal - DEV Community
- What is useCallback hook in React? - DEV Community
- Next.js公式examples集を分類(2021年1月版) - Qiita
- [React] ReduxもMobXも合わなかったので状態管理ライブラリを自作してみた話 - Qiita
- React入門!!の前に知っておきたいNode.jsとJavaScriptの知識 - Qiita
- Reactアプリのデバッグ方法 - Qiita
- あなたが知っておくべき最高のReactデザインパターン - Qiita
- React でデザインシステムを正しく実装する - コンポーネントカタログを超えて | Wantedly Engineer Blog
- 今からでも遅くない!誰も教えてくれなかった React とアクセシビリティーの世界
TypeScript
- TypeScriptの導入にあたって考慮すべきメリットとコスト - LINE ENGINEERING
- まだTypeScriptのTypeGuard関数を手動で書いてるんですか!? - Qiita
- TypeScript:関数の引数に同じ長さの配列を渡したい - Qiita
- TypeScript 4.1で密かに追加されたintrinsicキーワードとstring mapped types
フロントエンドほか
- 各CSSフレームワークやJavaScriptフレームワーク等のデータを比較してグラフ化している・「Moiva.io」 | かちびと.net
- Are These the Most Interesting Front-end Developer Tools for 2021? - DEV Community
- フロントエンド開発者のための便利なオンラインツール11選 - Qiita
- フロントエンドコーディング時によく利用するジェネレーターサイト(随時更新) - Qiita
- 【React+TypeScript】Netflixのクローンを作るチュートリアル - Qiita
ブラウザ
- Chrome 88のここに注目!CSSのaspect-ratioプロパティでアスペクト比が簡単に、別窓はデフォルトでnoopenerに | コリス
- Apple、Windowsユーザー向けのChrome拡張機能「iCloudパスワード」をリリース | 気になる、記になる…
- Big Sur搭載のSafariはWebP画像を標準サポート、AVIFもサポートしてくれるかも | 海外SEO情報ブログ
Web系ほか
- 2021年版、フロントエンドとバックエンドのデベロッパーに必要なスキルやツールをまとめたロードマップ | コリス
- The Complete Full Stack Web Developer Roadmap 2021 - DEV Community
- GoogleやMicrosoftなどIT大手連合が「Open Web Docs」を発表 - GIGAZINE
- 2021年のウェブ標準とブラウザ:新春特別企画|gihyo.jp … 技術評論社
- VS CodeのAdobe XD用拡張機能が登場!デザインシステムにもとづきコード出力と補完が可能に - ICS MEDIA
- React を Azure Static Web Appsでホスティングする開発・本番環境を作る - Qiita
- Google、マイクロソフトらが設立、「Open Web Docs」を発表。MDNなど支援、Web技術のドキュメント化を推進 - Publickey
- WebAssemblyをWin/Mac/Linuxで実行可能なランタイム「Wasmer 1.0」正式リリース。事前コンパイルによる高速起動やクロスコンパイルなどにも対応 - Publickey
- Webエンジニアとしていま知っておきたいWebアクセシビリティ
デザイン / UI / UX
- デザイナーじゃなくても知っておきたい色と配色の基本 | knowledge / baigie
- Webデザインの出来を左右する「コンポジション」の重要性 | アドビUX道場 #UXDojo | Adobe Blog
- 最近のロゴのデザインに使われている、2021年に注目しておきたいトレンドのまとめ -Logo Design Trends 2021 | コリス
- 任天堂「Wii」のロゴの没案が発見される - GIGAZINE
- ダークモードにまつわる誤解を解いておく - Qiita
- 2021年に流行するWebデザインの最新トレンド12個まとめ | Web Design Trends
機械学習・AI
- 「バイクに乗るピカチュウ」「アボカドの椅子」など言葉から自動でイラストや写真を生成するAI「DALL・E」 - GIGAZINE
- 無料で読める統計学・機械学習周辺のチュートリアル論文や講義ノート10本 - Qiita
開発 / インフラ / ツール
- さまざまなオープンソースライセンスをまとめてみた。 - 紺屋高尾
- 3Dモデリングソフト「Blender」の操作を0から学べる1,400ページの解説書が無償公開 - 窓の杜
- コミットはスナップショットであり差分ではない - GitHubブログ
- テスト駆動開発(TDD)の利点に関する統計と研究(翻訳)|TechRacho(テックラッチョ)〜エンジニアの「?」を「!」に〜|BPS株式会社
- PythonやR対応の統合開発環境「JupyterLab 3.0」正式リリース。ビジュアルデバッガー搭載、レスポンシブ対応でモバイルデバイスの狭い画面でも使いやすく - Publickey
- 現代のオブジェクト指向の class の割れ窓化と宣言的プログラミング
SEO / マーケティング
その他
- 【2021年予想】5のスタートアップトレンドと注目サービス25選 デザイン会社 ビートラックス: ブログ
- プログラマがなりたい職業第1位になった話とか、昨今のプログラミングスクール問題とか - give IT a try
- 最近見かける新しいライセンスについて - Kengo's blog
- A list of actually useful Nocode tools and I am not talking about site builders. - DEV Community
- 65 Things I wish I knew when I started to Code 🌱🚀 - DEV Community
- “YouTube”がPWAに対応 ~PCやモバイル端末にインストールして利用できる - 窓の杜
- Twitter・Slack・Discordなどのチャットサービス統合アプリ「Beeper」が登場、WindowsやAndroidでもiMessageを利用可能 - GIGAZINE
- エンジニア採用で絶望する瞬間【面接官の本音】 - Qiita
- ポートフォリオのアプリを公開したらイタズラされまくった話 - Qiita
- Qiitaのいろいろランキング2020 - Qiita
- 技術的なハマりパターンを分類・オサレに命名し、パターン毎に解決策(エンジニアのググり方・質問の仕方)を明示してみた - Qiita
- ITエンジニアが投票した「ITエンジニア本大賞2021」ベスト10発表。「オブジェクト指向UIデザイン」「Clean Agile」「思考法図鑑」など - Publickey
- エンジニアの幸せを奪いがちな7つのこと