タグ

2019年12月21日のブックマーク (12件)

  • Custom Elements を正しく実装するのはとても難しい - ジンジャー研究室

    React みたいなコンポーネント作る系フレームワークだと思って Custom Elements を使おうとすると、たちまち死んでしまう。まだ色々試している最中なのでアウトプットはないんだけど、とりあえず今考えてることを書いておく。役立たないし刺されたら困るからポエム宣言しとこうか。ポエムです。 Custom Elements やっていきたい Custom Elements の良さは特定のフレームワークに依存しないところだと思う。例えば React とか Vue とかだとそれぞれのフレームワークの世界にどっぷり浸かってしまい互換性がないが、 Custom Elements ならば普通の要素の延長線上でどこに持って行っても使える。 npm とか使わなくても script タグで CDN とかから持ってくればすぐに動く。夢のよう。もちろん、データフローはアプリケーション固有のものになるだろうか

    Custom Elements を正しく実装するのはとても難しい - ジンジャー研究室
  • なぜNext.jsを採用するのか? - mottox2 blog

    こちらは Next.js Advent Calendar 2019 17日目の記事です。 Next.jsの話をすると「ReactでSSRをするやつでしょ?」と言われます。正しくはありますが、その答えでは不十分です。 ここでNext.jsの公式サイトを見るとランディングページにはThe React Framework for Production Server-rendered App, Static Websites, the Enterprise, the Desktop, the Mobile Apps, SEO-Freiendly App, PWAs and Electronとあります。要するに、いろんな用途に使えるということです。 SSRを使用しないのであれば、「ユーザー向け(Not管理画面)なサービス開発であればCRA(create-react-app)で十分じゃない?」と思う方

    なぜNext.jsを採用するのか? - mottox2 blog
  • React Fiberの「Fiber」とはなんなのか勉強してみた - Qiita

    色々素敵な記事が既に存在してはいますが、自分自身の理解を深めたく、React FiberのFiberとはなんなのか勉強してみたものをまとめました。 尊敬の念を込めて、大変勉強になった素晴らしい記事たちを先に紹介しときます。 React Fiber現状確認 ReactはなぜFiberで書き直されたのか?Reactの課題と将来像を探る React Fiberアーキテクチャについて 解説しないこと Fiber以外のReact ver.16以降での変更点 あくまでFiberとはなんなのかにフォーカスします。 (ただ個人的には render() の結果を文字列や配列で返せるようになるのは超嬉しいです。) React Fiberを理解するための前提知識 React Fiberを理解するにあたって重要なキーワードは次の3つです。 リコンシリエーション 作業 スケジューリング FiberはReactのリコ

    React Fiberの「Fiber」とはなんなのか勉強してみた - Qiita
  • 3000人に聞いた、2019年最先端のフロントエンド開発者が使ってるツールはこれだ - Qiita

    Ashley Nolanは、CSSJavaScriptの機能やフレームワークをどれだけ使っているかというアンケートを毎年行っています。 以下では2019年版である、The Front-End Tooling Survey 2019というアンケート結果の概要を紹介してみます。 回答者数が昨年から4割も減ってるのだが一体何があったのだろう。 The Front-End Tooling Survey 2019 - Results 3005人の開発者が、27の質問に回答してくれました。 私の家族に女の子が増えたので集計結果を出すのが遅れました。ごめんね! 昨年からの一年で変わったところを見ることで、みんなの考えやトレンドが他者と共有されているか確認することができます。 これらの結果から、フロントエンドツール全体の知識レベルや使用傾向を分析するのにも役立ちます。 Quick Thanks 手伝って

    3000人に聞いた、2019年最先端のフロントエンド開発者が使ってるツールはこれだ - Qiita
  • 【TypeScript】TS初心者の、TS初心者による、TS初心者のためのTS入門 - ecbeing labs(イーシービーイング・ラボ)

    はじめに ブンブン Hello world. どうもこんにちは。開発です。 前回「もし新人プログラマが「プリンシプル・オブ・プログラミング」を読んだら」の記事を書かせて頂いたあの開発です。 プログラマ界隈では「1年に1言語」とは言いますが、かくいう私も一念発起して新しい言語を学ぼうと思った次第でございます。 しかし、ただ学ぶだけではペースも落ちますし、やる気の上下も大きいと考えました。 そこで、”学んだ内容を記事にする”というタスクを自分に課すことで学習効率を無理やり持ち上げようと画策致しました 。 そんなわけで今回は、「新人プログラマがどのように未収得の言語を学習するか」について津々浦々と文字列を列挙したいと思います。 はじめに What's TypeScript 概要 JavaScriptとの違い 詳細 文法 型宣言 型推論 実際にやってみた 何はともあれ書いてみましょう 差分進化(D

    【TypeScript】TS初心者の、TS初心者による、TS初心者のためのTS入門 - ecbeing labs(イーシービーイング・ラボ)
  • TypeScript で window 直下にいろいろ生やしたりグローバル変数を定義する | DevelopersIO

    TypeScript は開発に安定をもたらしてくれますが、たまにやりたいことがちょちょっとできずにハマることがあります。今日はそのひとつ、 window オブジェクトにいろいろ生やしたいんだけどうまく生やせないあなたのための記事です。 ポイントは次のふたつです。 tsconfig.json の lib に "DOM" が指定されているかどうか window の定義において import / export を使っているかどうか tsconfig.json の lib に "DOM" が指定されているかどうか tsconfig.json の lib プロパティに "DOM" が指定されているかどうかで書くべき内容が変わります。ご自身の tsconfig.json の中身を確認してみてください。 lib プロパティがない場合は "DOM" が指定されているものとして扱ってください。 DOM あり

    TypeScript で window 直下にいろいろ生やしたりグローバル変数を定義する | DevelopersIO
  • GitHub Actions でキャッシュを使った高速化 - 生産性向上ブログ

    GitHub Actions Advent Calendar 2019 の 15 日目の記事です。 この記事では、GitHub Actions のキャッシュ機能について解説します。 目次 CI/CD とキャッシュ 簡単な例 (npm) 実験用リポジトリ作成 キャッシュ actions/cache Inputs と Outputs キーのマッチング順序 ビルド失敗時 キャッシュクリア 複数 OS で matrix ビルドするときのキャッシュ 言語ごとの例 アーティファクトとキャッシュの違い 制限事項 注意事項 まとめ CI/CD とキャッシュ CI/CD のビルドでは、リポジトリが依存するパッケージのダウンロードが原因でビルド時間が長くなってしまうことがよくあります。近年の CI/CD ではビルドごとに完全にクリーンな実行環境が用意され、前回のビルドでダウンロードしたファイルが持ち越されない

    GitHub Actions でキャッシュを使った高速化 - 生産性向上ブログ
  • The State of JavaScript 2019

    We were pretty sure 2018 would be the last time we did this survey. After all, the JavaScript ecosystem can’t very well keep changing again, can it? But what do you know, turns out JavaScript isn’t quite done changing just yet! And so after over 21,717 respondents took this year's survey we had to dig up our components and charts, curse us-from-a-year-ago for writing such crappy code, and get to w

    The State of JavaScript 2019
  • vscode-eslint v2 - Qiita

    Microsoft が自ら提供している Visual Studio Code の ESLint 拡張 (vscode-eslint) がメジャー バージョンアップして、その設定方法が大幅に変わったのでまとめてみます。 ESLint の自動修正を保存時に自動的に適用するための設定 v1 で提供されていた eslint.autoFixOnSave 設定は廃止され、代わりに editor.codeActionsOnSave または editor.formatOnSave を利用します。言い換えると、vscode-eslint 独自の方法で保存時の処理を実施していたのが、Visual Studio Code の標準的な方法で実施するように変更されたわけですね。2 つありますが、editor.codeActionsOnSave のほうが推奨されています。 editor.codeActionsOnSa

    vscode-eslint v2 - Qiita
    toshi-toma
    toshi-toma 2019/12/21
    VSCodeのESLint拡張で`eslint.validate`とか設定に書いて保存時にauto fixしてたけど、v2になってその設定不要になってた。拡張の更新時に自動で`editor.codeActionsOnSave`が設定されてたからちゃんと動いてた。設定消すだけ
  • マネージャの資質とマネジメントの本質 | Social Change!

    前回の記事では、「マネジメント」と「管理」は違うものであるという主張を述べた。管理はマネジメントの手段の一つに過ぎず、現代の再現性の低い仕事や多様な人材がいるチームビルディングにおいて、昔ながらの管理という手法は通用しないのではないか、と。 では、マネジメントとは何で、それを職務とするマネージャの役割は何か、その質について考えてみたい。 マネージャに求められる能力の誤解 以前にシステム開発の現場でプロジェクトマネージャをしていた頃は、マネージャたるもの技術や業務、顧客のことまですべて把握して理解していなければいけないと考えていたし、そう実践していた。 マネージャの大事な仕事の一つは、決断することだと考えていたし、その決断に伴う責任を負うことである、とも。そのためには、あらゆることを知っていないと判断ができない、だから大変だけど向き合ってきた。 しかし、そんな全知全能であろうとするのは遅か

    マネージャの資質とマネジメントの本質 | Social Change!
  • CSSの継承〜親から子へ受け継がれる意志〜 - Qiita

    アドベントカレンダー初挑戦!21日目(プラコレ的には10日目) こんにちは!横田です。 不適切なところがありましたらご指摘いただけると幸いです。 よろしくお願いします! 今一度見直したい「継承」 フロントをやっていて、そこまで日は浅くないのですが、これまであまりcssプロパティの「継承」について深く考えたことがありませんでした。 親要素からプロパティを指定していって、子要素で効いていなかったらまた指定しよう、ぐらいでした。 しかしたびたび思うのです。「またcolor: #555;って書くのか...」と。 そこで、継承についておさらいしてみました。 Sassなどでスマートに書ける今、変数や関数をつかってかっこよく書けるようになりましょう! 継承とは 親要素のプロパティの値が、子要素に引き継がれることです。 プロパティによって継承されるものとされないものに分かれます。 継承されるプロパティ 使

    CSSの継承〜親から子へ受け継がれる意志〜 - Qiita
  • Airシフトをより良くするためにチームで取り組んでいること | Recruit Tech Blog

    はじめに 記事は Recruit Engineers Advent Calendar 2019 – Adventar 21日目の記事です。 リクルートテクノロジーズの 辻 健人です.GitHubではmaxmellonで活動しています. 記事では,Airシフトをより良くするために実施していることを紹介します.技術的な改善につきましては,web.dev – five-ways-airshift-improved-their-react-app で紹介されたりもしました. この記事では,チームをどのようにしてより良い方向性にもっているかを紹介していきます. Airシフトとは Airシフトは,シフト表の作成はもちろん,スタッフとのやりとりや細かな調整業務もラクになるシフト管理サービスです. 直感的に操作できるシンプルな画面で,簡単にシフト作成が行えます.シフト表と一体となったチャットを使ってス

    Airシフトをより良くするためにチームで取り組んでいること | Recruit Tech Blog