Warning: nerdy This program renders whatever is displayed in the given Window into an image, thanks to svg's <foreignObject>. No server side code is required to produce the screenshot. There is no native Javascript API to take the screenshot of what the user is currently seeing on their screen (and because of security issues there probably will never be one). Since we don't have access to the raw

動機 きっかけはこの記事。ちょっと前にこれを読んで、 「モバイルネイティブアプリに慣れた開発者が、React Native for Webを利用することで手軽にWebアプリ開発できないか？」と思ってたので調べてみました。 iOSについて言えばSwiftUI登場後、宣言的にUIを構築するということが自然となり、Webアプリの各種FW（Reactなど）との距離感が縮まっていること。前述の記事にあるように、ネイティブ開発で馴染みのあるコンポーネントをReact Nativeを経由してWebの世界に持っていけるなら、Webアプリ開発の敷居が下げられるんじゃないかと思って調べてみました。 先に結論 React Native for Webを使って簡単なTODOアプリを作ってみました。 一応Firebase Hostingに置いてPWAとしてモバイルにインストールするところまで試しました。 githu

こんにちは、メルカン編集部のnatukifmです。 メルカリが「原則在宅勤務」になってから、2ヶ月以上経ちました。そこで気になるのが、リモート環境下でのマネジメント。メンバーによって勤務スタイルや業務量がよりさまざまとなるなか、マネージャーたちはどのように対応しているのでしょうか？ そこで今回のメルカンでは、リモート勤務下でのマネジメントについて簡単なアンケートを実施。KPT方式で振り返ってもらいました！ 【現状】リモートが始まってから、メンバーやチームの変化は？ まずは、在宅勤務になってからメンバーやチームがどのように変化したのかを聞きました。 1：勤務スタイルがよりバラバラになった ・ 出社・退社の区切りがなくなるので、勤務リズムが崩れてきた。同時に、子どもを保育園に預けられなかったり、家に閉じこもり続けていることでの心身状態の崩れも見え始めてきた。 ・ 何名かのメンバーは、朝方勤務に

JavaScript Primer 迷わないための入門書 azu, Suguru Inatomi アスキードワンゴ 3,344円 (3,040円+税) 変化に対応できる基礎を身につけよう! JavaScriptは激しく変化している言語です。このような変化に対応できる基礎を身に付けられるよう、単に書き方を解説するのではなく、プログラミングの現場で直面する問題を自分自身で解決するのに必要な調査方法についても焦点を当てています。 関連サイト本書の関連ページが用意されています。 JavaScript Primerを出版しました！/JavaScript Primerはなぜ書かれたのか？ | Web Scratch内容紹介変化に対応できる基礎を身につけよう! 本書の「第1部 基本文法」では、JavaScriptの文法と機能について、実際の利用方法を示しながら解説しています。また「第2部 ユースケース」

先日のAmazon SQSの障害には色々と肝を冷やした人も多いのではないでしょうか。 classmethod.jp 今回のようなケースとは別に障害は大小あれど、みなさん日々戦っていることだと思います。 障害対応はエンジニアの花形であるものの、サービスに対する知識やソフトウェアの知識など経験と技術の両方が必要です。 そのため、どうしてもトラブルシューティングはエースエンジニアなどの一部の人に依存してしまう…などの問題が発生しがちです。 そこで今日は私の経験から障害対応のいろはを書いて行きたいと思います。 今回のスコープの外 実際に障害時の具体的な対応、例えば障害切り分けやRDBMSのボトルネックの探し方などの話はしません。 まずissueを作ると良い 本題です。 トラブルを認知したらまずはissueを作りましょう。 issueを作るときはtemplateが事前に設定されていると便利です。 g

Flexboxも、margin: auto;も、CSSでよく使うプロパティです。 このFlexboxとオートマージン（margin: auto;）を組み合わせると、さまざまなレイアウト・配置ができます。例えば、ナビゲーションのアイテムを配置する際に、ロゴだけ左端に、検索を右端に、といった配置もオートマージンが活躍します。 オートマージン（margin: auto;）の仕組み、CSS Flexboxとオートマージンの効果的な使い方を紹介します。 Flexbox: Aligning with Auto Margins by Samantha Ming 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 Flexboxにおけるオートマージンの役割 マージンについて理解する オートマージンが常に優先される オートマージンの効果的な使い方 F