nilabのブックマーク / 2021年12月27日

【Box】boxnoteをtxt形式に変換するワンライナー - (O+P)ut

はじめにクラウドストレージであるBoxにはBox Notesというドキュメント作成ツールが内包されています。特にリアルタイムで文字入力が画面に反映されるのでチーム間で利用に力を発揮します。そんなBoxNotesですが、実態はJSONとマークダウンが混じったような形式なのでテキストエディタでそのまま開くと不要な記号列で画面が埋め尽くされます。それを受けて、BoxNotesをファイルとして見た際の.boxnote形式をUNIX環境にて.txtに変換するワンライナーを作成しました。コマンド実行環境 $ uname -a CYGWIN_NT-10.0 ... x86_64 Cygwin 変換ワンライナー該当の.boxnoteに対して以下ワンライナーを発行すればテキストとして読みやすくなります。 $ cat hoge.boxnote | awk '{print substr($0,ind

nilab 2021/12/27

「クラウドストレージであるBoxにはBox Notesというドキュメント作成ツールが内包」「実態はJSONとマークダウンが混じったような形式なのでテキストエディタでそのまま開くと不要な記号列で画面が埋め尽くされます」

リンク

老いに備える知的生活と作業ログ（仕事の心がけ）｜結城浩

年を取ってくると興味関心が弱くなる。興味関心の範囲が狭くなる。興味関心に従って行動する力も弱くなる。さらに「よし、やるか！」と踏ん切りを付けて始めることがなかなかできない弱さもある。その弱さをもう少しパラフレーズしよう。それは、やり始めれば進むことがわかっているけれど、先がどうなるかわかってしまうと急に動けなくなるという弱さだ。＊　＊　＊以前「ルーチンワークを創造して、一冊の本を書き上げる」という文章を書いた。仕事をするときには、頭を使って仕事の進め方をデザインし「あとはルーチンワークをこなすだけ」にしてしまえ！という話である。 ◆ルーチンワークを創造して、一冊の本を書き上げる（本を書く心がけ）しかし、このやり方がかえって害になる場合もあるようだ。老いのせいかもしれないけれど「あとはこれをこなすだけ」になってしまうと、急激にモチベーションが下がってしまうことがある。いつもそうなる

nilab 2021/12/27

老いに備える知的生活と作業ログ（仕事の心がけ）｜結城浩

リンク

Apple + NeXT、25年前の今日

25年前の今日、私はNeXTのフィールド・システム・エンジニアで、カナダにいる3人のNeXT社員のうちの1人でした。私たちの家族はペンシルベニア州スクラントンで、生後3週間の赤ちゃんを祖母に紹介しました。当時、誰も信頼できる携帯電話を持っていなかったので、ほとんどのメッセージングはAudixというボイスメールシステムを使っていました。どういうわけか、今だにその番号、1-800-345-5588を覚えています。先日、その番号にダイヤルしてみました。この番号は使われていません。しかし、私は今でもすぐにダイヤルできます。とにかく、突然のAudixのメッセージが来ました。緊急です。午後2時に全員がダイヤルする必要があります。それが何なのかよく分からないまま、信頼できる固定電話を探しに行ったところ、どういうわけかスチームタウン鉄道博物館の公衆電話にたどり着きました。(とにかく行ってみたかった

nilab 2021/12/27

ブログ: Apple + NeXT、25年前の今日

リンク

芸能人にも大人気「ハイブリッドドッグ」に隠された、「残酷すぎる現実」（石井万寿美） @moneygendai

「ハイブリッドドッグ」、あるいは「デザイナードッグ」という言葉をご存じでしょうか。最近人気が高まっている一部の犬種で、「マルプー」や「シープー」などが該当します。人気芸能人やYouTuberが飼っていることも多く、YouTubeの動画に登場したのを見たことある人もいるのではないでしょうか。そんな場面を目にして、「ぬいぐるみのようにかわいいので、我が家でも飼いたい」と思った人も多いかもしれません。しかしハイブリッドドッグには、後述するような悲劇的な歴史や問題もあります。ハイブリッドドッグとは？ハイブリッドドッグとは、2つの血統種を交配して生まれた犬のことで、特に血統書付きの犬同士を人為的に交配させて生まれた「ミックス犬」を指しています。よく聞く「雑種」は、一般的に様々な犬種が交配した犬のことを言います。そのため、雑種とハイブリッドドッグは違うのです。例を挙げた方がわかりやすいので、ハ

nilab 2021/12/27

“「ハイブリッドドッグ」、あるいは「デザイナードッグ」という言葉をご存じでしょうか。最近人気が高まっている一部の犬種で、「マルプー」や「シープー」などが該当します”

リンク

Next.js 12

As we announced at Next.js Conf, Next.js 12 is our biggest release ever: Rust Compiler: ~3x faster Fast Refresh and ~5x faster builds Middleware (beta): Enabling full flexibility in Next.js with code over configuration React 18 Support: Native Next.js APIs are now supported, as well as Suspense <Image /> AVIF Support: Opt-in for 20% smaller images Bot-aware ISR Fallback: Optimized SEO for web craw

nilab 2021/12/27

Blog - Next.js 12 | Next.js

リンク

JavaScriptフレームワーク「Next.js 12」リリース、Rustコンパイラによる高速化やミドルウェアのベータ提供など

「Next.js 12」は、これまでで最大のリリースであり、Rustコンパイラにおけるバンドルとコンパイルの最適化によって、ローカルでの更新を最大3倍、本番環境でのビルドを最大5倍高速化するとともに、認証やボット保護、リダイレクトや書き換えなど一連のページロジックを共有するあらゆるものに使用できる、ミドルウェアがベータ提供されている。さらに、FacebookのReactチームとの協力によって、「React 18」用の「Next.js 12」を実験的に試せるようになり、「React 18」のサーバ側Suspenseの組み込みサポートと、SSRストリーミングサポートによって、HTTPストリーミングを使用してページをサーバ側でレンダリングできるようになるとともに、Reactのサーバコンポーネントを使用した、コンポーネント自体を含むすべての、サーバ上でのレンダリングが可能になった。ほかにも、「

nilab 2021/12/27

「FacebookのReactチームとの協力によって、「React 18」用の「Next.js 12」を実験的に試せるように」

リンク

知ってると得をするReactコンポーネントのイケてる書き方 - Qiita

はじめに基本的にReact + TypeScriptでフロントの開発をしているんですが、実際にコードを書いている時に気をつけていること、便利な書き方として知っておくと得をするReactコンポーネントの書き方を紹介します。 Propsが多くなりすぎたらやたらpropsが多くなってしまうことありませんか？しかも同じような名称ばっかりを何回も書くことになるという。そうゆうときはできる限りショートハンドで書きましょう。 return ( <SampleComponent type={user.type} name={user.name} em ail={user.em ail} image={user.image} /> )

nilab 2021/12/27

「やたらpropsが多くなってしまうことありませんか？」「できる限りショートハンドで書きましょう」「<SampleComponent {...user} />」「<SampleComponent {...{type, name, email, image}} />」

リンク

GatsbyでMissing "key" prop for element in iteratorが出る - Qiita

const posts = data.allContentfulPost.edges return ( <Wrapper> <List> {posts.map(({ node }) => { return ( <ArticleIt em title={node.title} heroImage={node.heroImage} slug={node.slug} /> ) })} </List> </Wrapper> ) 原因 ArticleIt emにkeyを渡してないため。 Reactのドキュメントには以下の通りの記載があります。 Keys should be given to the elements inside the array to give the elements a stable identity: 解決策以下のようにArticleIt emにkeyで一意の値を渡してあげれば

nilab 2021/12/27

「keyで一意の値を渡してあげれば大丈夫」「Reactのドキュメントに記載の通り、最悪indexを渡せばいいそう」

リンク

Lists and Keys – React

These docs are old and won’t be updated. Go to react.dev for the new React docs. These new documentation pages teach modern React and include live examples: Rendering Lists First, let’s review how you transf orm lists in JavaScript. Given the code below, we use the map() function to take an array of numbers and double their values. We assign the new array returned by map() to the variable doubled a

nilab 2021/12/27

"Keys help React identify which items have changed, are added, or are removed. Keys should be given to the elements inside the array to give the elements a stable identity"

リンク