行為主体性の進化：生物はいかに「意思」を獲得したのか 作者:マイケル・トマセロ白揚社Amazonこの『行為主体性の進化』は、認知科学が専門のマイケル・トマセロによる、「行為主体性」について書かれた本だ。霊長類や他の哺乳類はアリやハチといった昆虫と比べると「知的」であるようにみえる。しかしその知的さをどのようにはかるべきだろうか。もちろん、これについては行動の複雑さなど無数の尺度が考えられるだろうが、本書ではその知的さの違いを「行動の制御」に見出していく一冊だ。 たとえば、アリやミツバチの行動は、それがどれほど複雑であっても個体がすべてをコントロールしているようにはみえない。彼らの行動を主に制御しているのは個体の判断ではなく生物学的機制(バイオロジー)である。一方の霊長類や他の哺乳類は、ある程度は自分のコントロールにおいて、情報に基づく決定を能動的に下しているようにみえる。これに関連して出て

はじめに タイトル通り、読んで欲しい（圧）技術書をたくさん集めてみました。自身の担当から外れる領域に関しては、会社の人に協力を仰ぎ、編集しました。「何を読めばいいかわからない」、「次の読む本を探したい」などのように考えている方の参考になればと思います。 また、大きく、 ・新米エンジニア ・脱新米エンジニア と分けてまとめたので、参考にしてみてください。 技術書のススメ 技術書の紹介の前に、技術書で得られるものについて説明したいと思います。全然読み飛ばしてもらって大丈夫です。この章から本の紹介を行なっていきます。 技術書は体系的な構成となっているため、技術書を読むことで、 ・論理的な思考力が身に付く ・技術の歴史・背景を知れる ・技術の知識、手法を学べる これらを学ぶことができます。論理的な思考力、知識はわかるけど、技術の歴史・背景を知ってどうするんだと思う方もいるかもしれません。しかし、歴

界隈で話題になっている（と私は認識している）「世界一流エンジニアの思考法」を早速読んでめちゃくちゃ良かった, とにかく人に勧めたいぞ！ という現役エンジニア（私）による書籍の感想エントリーとなります. 話題の本めちゃ良かったです. このブログを書く数日前にkindleで買って読む→めちゃいいやん！→紙版も買う←今ここ ってぐらいすごく良かったです*1. 世界一流エンジニアの思考法 (文春e-book) 作者:牛尾 剛文藝春秋Amazon 何が良かったか一言で言うと, 「強いエンジニアの習慣がここまでいい感じに言語化されている！！！」 という所ですね, 割と余すところなく詰まっていると思いますし, 一つ一つのTipsは再現性もあると思います（真似できるかどうかは別として真似は可能*2）. そんな「世界一流エンジニアの思考法」の感想を手短に書きます, 気になる方はお付き合いください. TL;D

CSSで便利な機能の1つがcalc()、ページのレイアウト、要素やフォントのサイズ設定に活躍します。特に異なる単位で加算減算（calc(1rem + 1px)）できることが便利ですが、乗算除算（calc(1rem / 1px)はできません。 そこでCSSの三角関数です。すべてのブラウザにサポートされているatan2()を使用すれば、異なる単位で計算ができます。tan(atan2())を使用して、スクリーンサイズやフォントサイズを取得するテクニックを紹介します。 CSS Type Casting to Numeric: tan(atan2()) Scalars br Jane Ori (@Jane0ri) 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに tan(atan2())は単なる数値である 追記: 三角関数を学び直

CSSのサブグリッド（subgrid）がChrome 117でサポートされ、Safari, Firefoxではすでにサポートされていたので、これで主要ブラウザのすべてで利用できるようになりました。 先日の記事でもお伝えしたように、subgridを使用するとカード内の見出しやテキストの水平グリッドを簡単に揃えることができます CSSのサブグリッド（subgrid）の基礎知識と使い方、プログレッシブエンハンスメント、デベロッパーツールによるデバッグ方法などを紹介します。 CSS Subgrid by Adam Argyle 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。基づいてというのは、貢献部分に関して同ライセンスも含みます。 はじめに サブグリッド（subgrid）の基礎知識 ページレベルの「マクロ」グリッドを共有する サブグリッドのサポートをチェ

" class=code-demo loading=lazy style=height:350px>これを突き詰めると、スプリングアニメーション（Spring Animation）のような、従来は JavaScript でフレームごとに描画していたアニメーションも CSS アニメーションで実装できます。 iOS のスプリングを CSS 数式アニメーションで再現する この記事では数式を使ったアニメーションを CSS で行う方法について、実際にデモを実装しながら解説します。 数式でアニメーションを表現できることの利点 #数式でアニメーションを表現すると聞いて、ピンとこない人もいると思います。以下の画像はこの記事のはじめのデモで使っている数式をグラフにしたものです。このグラフの形がイージング関数に似ていると気づいた方もいるかもしれません。 このようなグラフを描く数式を作ることができればイージング

【GitHub x サイバーエージェント共催】GitHub Copilotで変わる開発文化の現実 https://cyberagent.connpass.com/event/292982/

2023年9月7日 CSS CSS小技集シリーズの第5弾！「【第4弾】少しのコードで実装可能な10のCSS小技集」から約2年。またまた便利でサクッと使えるコードが続々登場しています！初心者さんからベテランさんまで要チェック！ ↑私が10年以上利用している会計ソフト！ 目次 ネストで親子セレクターを管理 チェックボックスやラジオボタンの色を変更 アスペクト比を指定する 新しいメディアクエリーの範囲指定方法 背面の要素をぼかす 要素を画面のど真ん中に固定表示 空の要素にスタイルをあてる 条件に合致しないセレクターにスタイルをあてる スムーススクロールのジャンプ位置 動いているCSSアニメーションを止める HTML・CSSの全コードは各サンプルの「HTML」や「CSS」タブを、別タブでのサンプル表示は右上の「EDIT ON CODEPEN」をクリックしてご覧ください！ 1. ネストで親子セレクタ

CSSの進化は速く、ここ1,2年はさらに速くなりましたね。その要因の一つがIEのサポート終了で、現在はエバーグリーンのブラウザ（自動で最新版にアップデートするブラウザ）となり、モダンCSSの機能がたくさん使用できるようになりました。 2023年、CSSの現状調査をおこなった結果をまとめた「State of CSS 2023」を紹介します。今年は例年より早いですね。 State of CSS 2023 State of CSS 2023は、State of CSSでおこなわれたアンケートの調査結果（9,190人分）をまとめたものです。 まずは、アンケートに回答された人の属性。 世界中の人がアンケートに参加しており、日本人も参加しています。年齢は25-44才が多く、性別は男性が多めです。

ChatGPT Plus で使える Code Interpreter でのグラフ描画と PowerPoint のスライド化（ダウンロードできるファイルの生成）PythonChatGPTChatGPTPlusGPT-4CodeInterpreter はじめに 先ほど、ChatGPT の Code Interpreter を軽く試した流れ（＋関連情報）を記事にしたのですが、その後に試したことも記事にしてみます。 ●ChatGPT Plusユーザー向けの Code Interpreter で QRコード生成を試す！（Pythonの qrcode パッケージを使用した処理） - Qiita https://qiita.com/youtoy/items/89a944fc9125ee6b8426 この記事で紹介するのは、グラフ描画と、ダウンロードが可能な PowerPoint のファイルの生成です。

はじめに 私は長い間レガシーコードと共に仕事をしてきましたが、jQueryの重要性は依然として頻繁に話題に上がるトピックの一つです。ライブラリ自体は便利なままですが、それは別の時代のニーズを完璧に満たしていました。 現在、私たちは既にES2023について話していますが、過去にjQueryがカバーしていたほとんどの機能は、すでに2015年にリリースされたES6に取り込まれています。 ES6の標準は既に広範にサポートされており、96％のレベルに達しています（出典：caniuse.com）。そのため、特に要素の選択、スタイリング、アニメーション、データの取得などの基本的なタスクについては、ライブラリの使用を見直す良いタイミングかもしれません。 以下のトピックは、いくつかの標準的なjQueryのパターンと、それに相当するバニラJavaScriptでの手法を示す参考資料として役立つと思います。 要素

■ はじめに <div>要素にonClickを渡すべきではない、ということ聞いたことはないでしょうか？ ただ、なぜ渡すべきでないのか？ 理解してなかったので今回調べてみました。 サンプルコード 今回動作確認に利用したサンプルリポジトリのコードはReactで書いています。 ■ 結論：<div>にonClickを定義するのがなぜダメなのか？ ユーザーにとって操作性の低いボタンになってしまうから、です！ 要するに UX が悪くなってしまうから！ その理由を解説していきます！ ■ 操作性の低いボタンになってしまう理由 大きく３つあると考えています。 div要素は focus を持たないから returnキー, spaceキーをonClickに変換しないから スクリーンリーダーが認識しない要素だから ◎ focus を持たないから <div>要素はfocusを持ちません。 なので、tabキーで要素に

昨今では、顧客理解 / ユーザ理解に取り組む必要性が様々な所で主張されており、一般常識になりつつある。そして「顧客のことを深く理解すれば、良質な仮説を立案できる」という言説が広く信じられており、マーケティング戦略を検討したり顧客体験をデザインするうえでの前提条件となっている。しかし、このような言説は本当に正しいのだろうか。 結論からいえば「顧客を深く理解すれば、良質な仮説を立案できる、という言説は間違っている」というのが本記事の主張である。この間違った言説が広く信じられてしまっていることが、ミクロな視点では「成果に繋がる施策仮説を立案できない」というビジネスパーソンの悩みの解消を阻んでおり、マクロな視点では企業の成長や競争力向上を阻む要因となっているのだ。 そこで本記事では、顧客理解の必要性・重要性を真っ向から否定することを試みる。「顧客を理解すれば、良質な仮説を立案できる」という言説が間

昨日の自分「今作ってる曲まじで良すぎる。天才かもしれん」 今日の自分「ﾅﾆｺﾚ。曲作り下手すぎか～～」 この記事は新歓ブログリレー23日目の記事です。 こんにちは、カシワデと言います。サウンド班に所属していてパソコンで音楽を作っています。 皆さん、DTMってしってますか？ DTMとはDeskTop Musicという和製英語の略で、パソコンで音楽を作ることを広く指します。パソコンで音楽を作ると言っても昨今の曲は大体パソコンを用いて作られているので、DTMというと特に&quot;打ち込み&quot;のニュアンスが出るような気がします。 でも、『パソコンで音楽を作る～』とか『打ち込み』っ… 🎉入学おめでとう🎉まずは新入生の皆さん、ご入学おめでとうございます！！！これから始まる大学生活は非常に短いですし、世間で言われる程時間に余裕があるわけでは無いので、後悔の無い充実した生活を送ってください！

アメトーーク『女性役やってる芸人』で、空気階段かたまりと男性ブランコ浦井が演じた「酔った女性がホテル誘われたら」の演技が良すぎて気が狂ってしまった。真理の扉が開いてしまった。 流れはこうだ。男女2人で酒を飲みに行った帰り道、かたまりこと「吉野あさひ」は酔いがかなり回ってその場にうずくまってしまう。 あさひ「あーすごい…」 浦井「大丈夫？」 あさひ「すごい飲んだ…すごい飲んじゃったよね？」 浦井「すごい飲んでたよ？」 あさひ「止めて…止めてくんないから」 浦井「でも全然強い…お酒強いんかなと思ってさ」 あさひ「いや全然…そんな強くないんだけど…」 浦井「ちょっ、大丈夫？気持ち悪くない？大丈夫？」 あさひ「うん。大丈夫…」 浦井「…しんどそうだからさ」 あさひ「うん」 浦井「どっかで休憩しない？」 あさひ「いいよ」 浦井「……え？」 あさひ「いいよ」 浦井「……言ってる意味わかる？」 あさひ「

HTML, CSS, JavaScript, PHPなどさまざまな言語に対応、コードのネストされたブロックを枠で囲って強調表示するVS Codeの機能拡張を紹介します。 さっそくインストールして使用してみましたが、これは見やすくなりますね！ 枠のボーダーや背景、ネストの深さを自由に変更もできるので、自分が見やすいようにカスタマイズできます。 Blockman -GitHub Blockmanの特徴 Blockmanのインストール Blockmanの使い方 Blockmanの特徴 Blockmanは、コードのネストされたブロックを強調表示するためのVS Code拡張機能です。 サポートしている言語は、JavaScript, JSX, TypeScript, TSX, C, C#, C++, Java, Ruby, PHP, R, Go (Golang), Dart, Rust, Swift,

MdN Bau-ya “「わかりやすさ」をデザインする 情報アーキテクチャ（IA）必修入門” (2023/1/18開催) https://www.street-academy.com/myclass/149720 上記イベントで使用したスライドを公開用に編集したものです。 作者：森田 雄 / 株式会社ツルカメ https://twitter.com/securecat https://turucame.jp/ Made with Canva https://www.canva.com/

HTMLページのhead内に記述する最小限の構成、そしてmeta要素やlink要素、ソーシャルサービス用の要素、デスクトップ・スマホのブラウザ用の要素などがまとめられた「HEAD」を紹介します。 HEAD: A simple guide to HTML <head> elements 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 以前の版からいろいろと変更されています。 2016年版: head内に記述する要素の総まとめ 2018年版: head内に記述する要素の総まとめ head内に記述する最小限の構成 head内の要素 meta要素 link要素 ソーシャル関連のhead内の要素 ブラウザ・プラットフォーム関連のhead内の要素 メモ head内に記述する最小限の構成 下記はシンプルなWebサイトで必須となるhead内に記