より良いReact開発者になり、より優れたコードを書き、コーディング面接で抜き出るため、Reactの技量を改善するすぐに使える知識です。 さあ、皆さん。始めましょう。 1. Reactフックを使った関数コンポーネント フックはReact v16.8で導入され、Reactの関数型プログラミングを大きく向上させました。Reactフックで、クラスコンポーネントの代わりに関数コンポーネントが使えますし、使うべきです。しかし...関数コンポーネントとステートとは?ライフサイクルメソッドとは? 怖がる必要はありません。Reactフックを使えばできます。 例をいくつか見てみましょう。 これは、クラスを使う従来の方法です。次のようにuseStateフックが使えます。 簡単に見えますか?その通りです!useStateフックを使って、初期状態を空の文字列('')に設定し、現在の状態(value)とその状態を変
状況 sshしたラズパイとか結構非力なマシンにsshしてあれこれビルドしようかなーと思って始めたmakeや make installとかが終わらなくて泣きたいときにするワークアラウンド。 方法 アプローチとしては実行中のコマンドのバックグラウンド化と非所有化(?)。 下準備(というか前提) 実行したいコマンド群はあらかじめシェルスクリプトに書いておき、実行するようにしましょう。 ;で区切って1行にまとめたコマンドはそれぞれが別のジョブになってしまうためです。 tmuxやscreen使え (2021/12/3追記) ご指摘ありがとうございます。そうですね。tmuxなどを使うととても良いのですが、お恥ずかしながら使った事がありませんでした。勉強になります。 これらツールの使い方は本題では無いため各自ググって使って下さい。 手順 1. クソ長いジョブの走っているターミナルで Ctrl + Zをし
React 18はReactの次期メジャーバージョンで、2021年の6月にalpha版が、11月にbeta版が出ました。また、Next.js 12でもReact 18のサポートが実験的機能として追加されました。React 18の足音がだんだんと我々に近づき、アーリーアダプターではない皆さんの視界にもいよいよReact 18が入ってきたところです。 特に、React 18ではServer-Side Rendering (SSR) のストリーミングサポートが追加されます。現在ReactでSSRを行いたい人の強い味方としてNext.jsが存在しているわけですが、Next.js 12でもReact 18を通してストリーミングの恩恵を受けることができます(Next.jsではSSR Streamingと呼んでいるようです)。また、厳密にはReact 18とは別ですが、React Server Comp
この記事は HTML アドベントカレンダーの 3 日目の分です。 フォームの送信先 URL や送信に使う HTTP メソッドは、基本的には form 要素の属性に記述します。送信先 URL なら action 属性、HTTP メソッドなら method 属性ですね。 しかし、ときには「この送信ボタンを実行したときだけ、通常と違う送信先 URL に送信したい」と思うかもしれません。それを実現するのが送信ボタン (<button type="submit"> 要素や <input type="submit"> 要素など) の formaction 属性です。 以下の例では、「保存する」ボタンを実行すると URL /edit に送信されますが、「削除する」ボタンを実行すると URL /delete に送信されます。 <form method="post" action="/edit"> ...
Miro大好きjacopenです。エンタープライズなIT界隈ではおそらく日本でトップクラスにMiroを愛している自信がある。 さて今日はMiro Advent Calendar 2021の3日目。 今日は、人類がいかにWeb会議に不向きかという話と、そのギャップをMiroで埋めようという話。あとは自分が関わっているカンファレンスでMiroを使いまくっている話をする。 Web会議の8割はXX コロナ禍でだいぶ定着したWeb会議。でも、個人的には世の中のWeb会議の8割は上手くいっていないと思っている。数字に根拠はないけど。 何を持って上手くいっていないとするかだが、「対面の会議と比較して伝えられる度合いが低下している」とすると、8割くらいはそれに該当すると言っても過言ではないだろう。 何故そうなるかというと、基本的に人は言葉だけで物事を正確に伝えることはできないからだ。 人間の会話において、
この記事は Autify アドベントカレンダー2021の2日目のためのブログエントリです。Autify の中の人(Autify のカスタマーサクセスエンジニアをしています)よりお届けしています。 qiita.com Autify では、テストプランを利用することで、定期的にテストを自動実行させることが可能です。 設定画面は上記のようなものになっており、これ以上の内容でのスケジュール設定は、Autify 単体では行わせることはできません。 こんなとき、システム運用などの経験が少しある方であれば、「例えば cron のようなことができれば...」といったことを思い浮かべるかもしれません。 e-words.jp ただ、シンプルに cron を利用しようとすると、「それを実行するサーバーがいるよね」「どうやって準備しよう」「運用どうしよう」......とかとか、考えなければいけないことがいくつかあ
この記事は HTML アドベントカレンダーの 2 日目の分です。 HTML のフォームコントロール要素 (input 要素、textarea 要素、select 要素、button 要素など) は、基本的にはその要素の祖先に位置する (その要素を取り囲む) form 要素に紐づいています。しかし、実は祖先にない form 要素に紐づけることもできます。フォームコントロール要素の form 属性の値に、紐づけたい form 要素の ID (id 属性の値) を指定すればよいのです。 この機能を使えば、フォームの一部に別のフォームの送信ボタンを埋め込んだり、 <form id="edit-form" method="post" action="/edit"> ... <p> <button type="submit">保存する</button> <button type="submit" fo
これは 大都会岡山 Advent Calendar 2021 2日目のためのブログエントリです。 コロナ禍となる少し前くらい・2019年7月からフルリモートで働き始めてから満2年とちょっとが経つのですが、僕は、幸いなことに仕事のために区切られた空間を用意することができているものの、以下のような課題があることを認識しはじめておりました。 2歳の子が日に日にパワフルになっていっていること コンテキストに合わせて環境を変えることは、生産性の向上に寄与するよなぁということ 「真剣モードで働いている人が、一つ屋根の下のどこかにいる、ということ」は、実はじわじわと奥さんに負担を掛けていたということ そんなおりに、自分が所属する会社が月3万円までのコワーキングスペース手当の支給制度を整えてくれました。その制度を活用して、倉敷は美観地区にあるコワーキングスペースでときどき働いているよ〜、という話になります
この記事は HTML アドベントカレンダーの 1 日目の分です。 HTML をパースするとき、要素名として扱われる文字の範囲は意外と広大です。最初の 1 文字が ASCII の英字であれば、あとは以下に挙げた文字以外のすべての文字が要素名の一部として扱われます。 タブ (U+0009) 改行 (U+000A) フォームフィード (U+000C) 復帰 (U+000D、改行文字の正規化により改行と同じ扱いになる) スペース (U+0020) スラッシュ / (U+002F) 大なり記号 > (U+003E) 日本語文字はもちろん、全角空白まで要素名の一部として扱われるということです。 ただし、これは Web ブラウザがおかしな HTML コードを受け取ったときにどこまでを要素名として扱うかという話であり、Web 製作者がおかしな名前の要素を使ってよいということではありません。カスタム要素の名
M1 ProのMacBook Pro '14を買いました。ちょうど業務PCとして買えるタイミングだったのでラッキーだった。多少トラブルはありますが、それも含めて楽しんでいます。 SDカードスロットが復活したことも話題でしたが、正直要らんなと思っていました。しかし @yamaz さんの以下のツイートを見て、確かにTime Machine運用するのは面白いかもしれない、と思ってやってみた。 なんでなんで!?みなさん、Timemachineのディスクは外付けのSDカードじゃないの?? https://t.co/YTj4QNixNm — 最速配信研究会 山崎大輔 (@yamaz) October 18, 2021 これまでTime Machineは自宅のQNAPに取っていたのだが、正直Time Machineが役に立ったことは全く無い割にはメンテナンスコストがかかっていたので微妙に思っていた。正直
Intro 本サイトは自作の Markdown ビルダを使っていたが、色々と気に食わない部分があったのでフルスクラッチで作り直し、それにともなってサイトの刷新を実施した。 必要だった要件や、意思決定を作業ログとして記す。 Markdown 本サイトは、一般に使われている Markdown -> HTML の変換結果では要件を満たせないため、最も都合の良い AST を吐く Kramdown のパーサから AST だけを取得し、それを Traverser でカスタマイズしてから自前でシリアライズしていた。 その実装を、微修正を繰り返しながら、継ぎ足し継ぎ足しで 5 年くらいイジってきたので、そろそろ自分がブログを書く上での要件も固まっており、記事中の Markdown のスタイルも固定してきた。 一方、 Kramdown の実装が原因でどうしてもワークアラウンドが必要だった部分に、フラストレー
LAPRASの機能でアウトプットをまとめてくれるのだけど、日々の日記しか書いてないので、日記のまとめ記事ができた。 社内のブログには、今のチーム状況的にはこういうことをやったらよいのでは、とか、アーキテクチャがいまこうなっているけど、どこをどうしましょうね、みたいなこととかを書いている。 日記をいつ書いていますか?って質問されたので書いておくと、いまは昼休みに書いている。 大風呂敷を広げずに話を終えるということが大事で、話題を大きくしなければ数行くらいで話を終えることができるのではないか。今日書かなくても、明日の日記に書けば良いので、いつこの日記を終えても良い、という気持ちで書ける。 いつも、適当なところで打ち切っているけど、読者のみなさま(そもそも、読者が誰もいないと想定して書くのも大事…)から、この日記は書きかけだ!って怒られたことは一度もないと思う。 Blog等 2021/11/24
既存の開発に参加するときや、0->1の開発をしているとき、いつも「せめてリポジトリの各ディレクトリの概要説明だけでも欲しい」と思っていました。 既存のプロジェクトに参加するときは「プロジェクトの理解をする側」、0->1のプロジェクトで開発をしているときは「説明をする側の立場」で、です。 Ruby on Railsのような基本のディレクトリレイアウト決まっていてもそのプロジェクトの独自性がでてきますし、Goのようにスタンダードなレイアウトがないのであればなおさら初見ではわかりません。 「じゃあREADME.mdにでも書いておけばいい」というのはその通りです。 ただ、概要説明であっても一度書いたら終わりではなく、更新は必要になります。特に0->1のプロジェクトの初期ではディレクトリレイアウトすら途中で変わるということはままあります。 (ここらへんは「継続的ドキュメンテーション」として私の興味の
データ構造をimmutableにしたい、イベントは起きたことをそのまま記録したい、更には監査の観点から修正させたくない、という人類の夢と希望に対して、「だってそれじゃあ現場は回らないんだよ」という例外運用のバランスをどこで取っていくか?というのは昨日・今日出てきた話ではないんですよ— magnoliak🍧 (@magnolia_k_) 2021年11月28日 所謂、業務システムの設計の一番肝心なところって、「起きた事実をありのまま記録する」っていう要件と、実際の運用がそうなっていない現実との戦いなんじゃないかって みんなそうしたいんだよ、でもできないんだよっていう— magnoliak🍧 (@magnolia_k_) 2021年11月28日 「データを活用しよう」って言い出しても、「活用できるように維持していましたっけ?」みたいな話も同じなんだけど、とにかく例外との戦いなんですよ— m
C# ライブ配信をしていて、「括弧用の記号の種類が少なすぎる」みたいな話題から、 「あるよ、括弧。Unicode には」みたいな話になり、 「Swift ではマジでいろんな記号が使える」という話に脱線したときの話。 配信では「括弧がたくさんある」という話と「Swift では演算子にいろんな文字が使える」という話が混ざっていて、 実際に Swift で色々使えるのは括弧ではないんですけど、演算子の方は本当に Swift で使えるものがかなり自由が効く仕様になっていまして。 例えば以下のコードはコンパイルして実行できます。 (1から5の和で、15が出力されます。) prefix operator ∑ prefix func ∑ (x: [Int]) -> Int { var sum = 0 for i in x { sum += i } return sum } let Σ = [ 1, 2,
週刊Railsウォッチについて 各記事冒頭には🔗でパーマリンクを置いてあります: 社内やTwitterでの議論などにどうぞ 「つっつきボイス」はRailsウォッチ公開前ドラフトを(鍋のように)社内有志でつっついたときの会話の再構成です👄 お気づきの点がありましたら@hachi8833までメンションをいただければ確認・対応いたします🙏 TechRachoではRubyやRailsなどの最新情報記事を平日に公開しています。TechRacho記事をいち早くお読みになりたい方はTwitterにて@techrachoのフォローをお願いします。また、タグやカテゴリごとにRSSフィードを購読することもできます(例:週刊Railsウォッチタグ) 🔗 Rails 🔗 Read Model 元記事: Difference between Cache and Read Model, an example
週刊Railsウォッチについて 各記事冒頭には🔗でパーマリンクを置いてあります: 社内やTwitterでの議論などにどうぞ 「つっつきボイス」はRailsウォッチ公開前ドラフトを(鍋のように)社内有志でつっついたときの会話の再構成です👄 お気づきの点がありましたら@hachi8833までメンションをいただければ確認・対応いたします🙏 TechRachoではRubyやRailsなどの最新情報記事を平日に公開しています。TechRacho記事をいち早くお読みになりたい方はTwitterにて@techrachoのフォローをお願いします。また、タグやカテゴリごとにRSSフィードを購読することもできます(例:週刊Railsウォッチタグ) 🔗Rails: 先週の改修(Rails公式ニュースより) 以下の公式情報から見繕いました。 公式更新情報: Automated shard swapping
JSer.info #568 - Lighthouse 9.1.0がリリースされました。 Release v9.1.0 · GoogleChrome/lighthouse Next.js向けのStack Packが追加されたため、Next.jsのアプリに対するAuditが追加されています。 feat: Add Stack Pack for Next.js by kyliau · Pull Request #66 · GoogleChrome/lighthouse-stack-packs Storybook 6.4.0がリリースされました。 Release v6.4.0 · storybookjs/storybook Storybook Addon InteractionsでInteractionsタブが追加され、インタラクション操作のシミュレートとデバッグができるようになっています。 また
今回は本連載において何度か登場しているPercona Toolkitのツールの1つ、pt-show-grantsについて紹介したいと思います。Percona Toolkitのツールに関しては、過去に以下の記事があります。インストール方法などもそちらで説明していますので、併せてご確認ください。 第9回 pt-query-digestを使って遅いクエリーを発見する 第116回 pt-upgradeを使ってインデックスチューニングの成果を確認する 第156回 pt-archiverを使って部分的にテーブルから情報を取得する 今回使用するPercona Toolkitのバージョンは、2021年11月時点で最新の3.3.1です。MySQLは8.0.26を使用しています。 pt-show-grantsを使ってみる pt-show-grantsは指定したMySQLに登録させているユーザアカウント一覧を出
OSSデータベース取り取り時報 第76回MySQL Database ServiceとHeatWaveの事例、PostgreSQL Conference Japanがオンサイト開催 この連載はOSSコンソーシアム データベース部会のメンバーがオープンソースデータベースの毎月の出来事をお伝えしています。 [MySQL]2021年11月の主な出来事 2021年11月のMySQLの製品リリースはありませんでした。MySQLのマネージドサービスMySQL Database Serviceでは、Oracle Cloud InfrastructureのIdentity and Access Management(OCI IAM)を利用してMySQLサーバーのユーザーアカウントを集中管理できるようになりました。MySQL Database Serviceにauthentication_ociプラグインが
Linux Daily Topics 2021年12月1日Linux 5.16-rc3がリリース、Intel Alder Lakeで発生していたバグを修正 Linus Torvaldsは11月28日(米国時間)、次期Linuxカーネル「Linux 5.16」の3本目のリリース候補版となる「Linux 5.16-rc3」を公開した。RC3ではIntelのデスクトップ向け第12世代Coreプロセッサ「Alder Lake」に関連するものを含め、Intelプロセッサで発生していたバグを修正する重要なパッチが含まれている。 Linux 5.16-rc3 -Linus Torvalds Intelは11月4日付けでAlder Lakeの販売を解禁、すでにAlder Lake対応のマザーボードが複数のメーカーから発売されている。Alder Lakeは開発の初期段階からMicrosoftのエンジニア
ハイクラス求人TOPIT記事一覧HTTP/3とQUICはなぜ必要になり、どのように標準化されてきたのか? 現代のプロトコル設計とインターネットの課題 HTTP/3とQUICはなぜ必要になり、どのように標準化されてきたのか? 現代のプロトコル設計とインターネットの課題 IETFで標準化が進められているWebの新しい通信プロトコルQUICとHTTP/3について、現在のインターネットが抱える課題やプロトコル設計での議論を中心に、ASnoKaze blogの後藤ゆき(@flano_yuki)さんに執筆いただきました。 2021年、Webに新しい通信プロトコルが登場しました。RFC 9000として標準化されたQUICと、その上で動作するHTTP/3です。HTTP/3はまだドラフト版ですが出版準備段階となっており、すでに実際のWeb通信でも広く使われています この2つのプロトコルは、現在のWebやイン
Image by AuthorThe VSCode editor has seen a massive adoption since its launch back in 2015. Why? Because It is lightweight, easy to use, and allows a ton of customization. Its plugins are an essential part of its ecosystem and why many Developers are hooked on it. Its native Typescript support excels and drives a lot of the…
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く