Tailwind CSSチーム、GitHubスター数2.4万超のUIコンポーネント集「Headless UI」をメジャーアップデート
5月8日、Tailwind LabsはReact用の「Headless UI v2.0」をリリースした。 Headless UIとは、Tailwind CSSベースのUIコンポーネント集である。 Tailwind CSSチーム自身が開発を行っており、GitHubスター数も2.4万を超えるなど、高い人気を博している。 このアップデートは、開発者がより少ないコードでより良い開発体験を実現できるようにするための多数の改善を含んでいる。 主な更新点は以下の通りだ。 組み込みアンカーポジショニングのサポート 新しいチェックボックスコンポーネントの追加 HTMLフォームコンポーネントの拡充 状態検出の向上 コンボボックスリストの仮想化 新しいウェブサイトと改善されたドキュメント 組み込みアンカーポジショニングのサポート Floating UIがHeadless UIに直接統合され、Menu、Popov
「きれいだな」「残しておきたいな」と思った風景を、そのまま切り取って残せる写真。 たくさん写真を撮っていると、あるときふと、どれも同じような写真に見えたり、思い通りのイメージで撮れないと感じたりすることがあります。 そんなときは、まず「構図」を見直してみましょう。 同じ写真でも構図を変えるだけで、写真の雰囲気や印象は大きく変わります。 構図を意識して写真を撮ることで、その写真の中で特に目立たせたい要素が際立ち、作品を通して伝えたいメッセージがより伝わりやすくなるからです。 さらに、構図をたくさん知っておくと、写真撮影の引き出しが増え、目の前の被写体や風景の魅力を引き出しやすくなります。 この記事では、よく使われる構図から応用編まで、15種類の構図を紹介します。 この記事の内容を参考に、表現の幅を広げ、もっと写真撮影を楽しんでくださいね。 まず押さえておきたい10の基本構図 まずは、基本的な
中級Git操作
今回の記事の内容はGitHub共同創業者のScott Chacon氏の「Pro Git」と同氏の今年の「So You Think You Know Git」（Gitがわかっているとでも思っているか？）発表をベースにしている。 コンフィグ ここでコンフィグにてデフォルトとして指定して損がないオプションをいくつか紹介します。 git rerere git rerereは"reuse recorded resolution"（記録ずみ解決方法を再利用）の略語になっている。 名の通りマージコンフリクトがどう解消されたかを記録し、次に同じようなコンフリクトが発生した際、同様の解決方法を自動的に適用するためのコマンドです。 また、基本的にデフォルトにしてもときに差し支えないため、ぜひgit config --global rerere.enabled trueを実行してみてください。 git main
GitHub、「Copilot Workspace」テクニカルプレビューを開始。ほとんど全ての開発工程をAIで自動化
GitHub、「Copilot Workspace」テクニカルプレビューを開始。ほとんど全ての開発工程をAIで自動化 テクニカルプレビューは上記のCopilot Workspaceのページからウェイトリストボタンをクリックして申し込みます。 Copilot Workspaceはほとんど全ての工程を自動化 Copilot Workspaceは、自然言語で書かれたIssue（課題）を基に、Copilotが仕様案と実装計画を示し、コーディングや既存のコードの修正を行い、ビルドをしてエラーがあればデバッグも行うという、プログラミングのほとんど全ての工程をCopilotが自動的に実行してくれる、というものです。 人間は各工程でCopilotから示される内容を必要に応じて修正するか、そのまま見守ることになります。 GitHub CEOのThomas Dohmke（トーマス・ドムケ）氏は、Copilot
より良いコミットメッセージを残すことは Git を使った開発をする上で重要なことです。優れたコミットメッセージは、それを読んだ人がコードを理解するのに大いに役立ちます。 では、どのようなメッセージが良いもので、どのようなメッセージが悪いものなのでしょうか？ それについて掘り下げていきたいと思います。 基本的な Git Commit Message の書き方 詳しいところは、以下の3サイトを参照してください。特に「How to Write a Git Commit Message」には基本がすべて書かれています。 How to Write a Git Commit Message https://cbea.ms/git-commit/ Gitのコミットメッセージをうまく作成する7つのルール （「How to Write a Git Commit Message」の和訳記事） https://
その他のサンプル: Wikipedia:良質な記事, Wikipedia:長いページ 紹介 「テキストゆれないくん」は文章に含まれる表記揺れを検出するツールです。「コンピュータ」と「コンピューター」、あるいは「全て」と「すべて」といった同じ単語の別表記が使われていないかどうかをチェックできます。 「テキストゆれないくん」は元々このサイト (https://inzkyk.xyz/) の文章校正用に開発されました。機能が成熟してきたので UI を付けて公開します。 このページから手動で使う限り、「テキストゆれないくん」は商用/非商用を問わず自由に使って構いません。「テキストゆれないくん」は無保証で提供されます。 特徴 ウェブブラウザから使える このページをウェブブラウザで開いているなら、「テキストゆれないくん」は既に動いています。このページの最初にあるのは「テキストゆれないくん」を使うための完
東京都中央区に拠点を構えるクラウド型のノートツール「EVERNOTE」を提供する日本法人であったエバーノート株式会社は、4月26日の官報にて解散することを発表しました。 同社は、2010年6月23日に設立。初代のVice President of Japanese Operationsは元ソニーの中島健氏が就任するなど話題を呼びました。その後、日本経済新聞社からの出資などもありましたが、近年ではユーザーが伸び悩み、各国で撤退が相次ぐ状況となっていました。 追記 Evernoteは、公式アカウントにて、「日本の Evernote 法人を閉鎖いたしましたことをお知らせします。ただし、日本法人の閉鎖は単に組織再編の一環であり、Evernote のお客様には実質的な影響はございませんのでご安心ください。日本国内のお客様はこれまでと同様に Evernote のご利用が可能です。ご混乱をお招きいたしま
見出しなどのテキストを目立たせたいときに便利なフキダシ（吹き出し）。 この記事では、HTMLとCSSだけで簡単に実装できる、シンプルなデザインのフキダシをご紹介します。 雑誌やポスターなどで見かける可愛いあしらいをウェブサイトにも取り入れたいと思ったことが、今回のテーマを選んだきっかけです。 とくにフキダシは、少ないコードで表現でき、見出しなどのテキストに華やかな印象を与えられます。 ウェブサイトを制作する際に、ぜひ取り入れてみてください。 また、この記事のほとんどの作例で、CSSの疑似要素『::before』と『::after』を利用しています。 疑似要素を使うと、不要なHTMLタグを増やさずにCSSで装飾できます。 ::before ＝ 選択した要素の最初の子要素として疑似要素を生成 ::after ＝ 選択した要素の最後の子要素として疑似要素を生成 これらは、要素に装飾的な内容を追加
ブーム来る？ 「和文バリアブルフォント」の世界
そんな事もあり、4月10日は新しいフォントがいくつか発表された。今年の目玉はなんといっても「和文バリアブルフォント」であろう。 われわれが普段使用するフォントは、同じデザインでも細いもの、太いもの、横が詰まったものなどがそれぞれ個別のフォントとして提供され、1つのファミリーを形成している。 一方バリアブルフォントは、そうした文字の変形を1つのフォントで提供していこうという比較的最近のフォントフォーマットで、米Adobe／米Apple／米Google／米Microsoftが共同開発した。フォントパラメータとして、太さや字幅がバリアブルで変更できるため、従来はファミリーで提供しなければならなかったフォントデータが、1つのフォントで小さく提供できるというメリットがある。 もちろんデザインする側も、細いか太いかの2択ではなく「中間」も選べるし、縦長、横長も選べるので、表現の幅が広がるわけである。た
Docker Desktopの代替となる「Podman Desktop 1.9」リリース。Macでの安定性や性能が大幅に向上したコンテナエンジン「Podman 5.0」を搭載
Red Hatが主導して開発するDocker互換のコンテナエンジンであるPodmanを搭載した、Docker Desktop代替となるGUIツール「Podman Desktop」の最新版「Podman Desktop 1.9」正式版がリリースされました。 Podman Desktopの主な機能 Podman Desktopは、デスクトップアプリケーションのGUIを通じて、コンテナの一覧、検索、実行、終了などの基本的な操作、コンテナイメージのビルド、コンテナレジストリへのコンテナイメージのプッシュやプルなどのライフタイムを通じた管理、ローカルでのKubernetes環境の実現、CPUやストレージの利用量の参照などを手軽に行えるツールです。 さらにDocker Dekstopの拡張機能を取り込むこともできます。 Podman Desktop 1.9の新機能 Podman Desktop 1.9
すべてのフォームが要件を満たしている場合のみ、送信できます。 フォームバリデーションのデザイン 上記の例では最低限のHTMLのみ実装されています。しかし、実際のサイトではバリデーションエラーをユーザーにフィードバックする必要があります。よりユーザビリティの高いフォームでは、以下の点を検討する必要があります。 エラー時のスタイル エラーメッセージの出し方 バリデーションエラーの表示タイミング 以下では、それぞれについて深堀りします。 エラー時のスタイル エラーを検知する方法として、CSSには:valid疑似クラスと:invalid疑似クラスがあります。これらの疑似クラスは『CSS疑似クラスを活用した、モダンでインタラクティブなフォームの作り方』でも紹介されている、バリデーションエラーが起きている要素にのみ適用されるクラスです。 しかし、この疑似クラスには欠点があります。required属性を
2024-04-19に開催されたBARフロントえんどう #2 「CSS Library / Framework」（サイボウズ）での登壇資料です。 イベント → https://cybozu.connpass.com/event/311066/
開発生産性が上がるって分かったので GitHub Copilot Business を積極活用しています - Money Forward Developers Blog
エンジニアリング戦略室の高井といいます。 みなさん、GitHub Copilot は利用されていますか？ GitHub Copilot は GitHub と OpenAI が共同で開発した生成 AI を活用した開発支援ツールです。コードの自動補完、コード生成、ドキュメントの提案など、多岐にわたる機能を提供し、開発者の生産性を向上させることを目的としています。 マネーフォワードでは、昨年度にトライアルとして Copilot の利用を開始しました。本記事では、Copilot を利用して半年以上経過して、その利用がどのような効果をもたらしたかをレポートします。なお、ここで GitHub Copilot として言及されている Copilot のプランは GitHub Copilot Business です。 Copilot 利用状況・分析対象 なお、分析にはエンジニアリング組織のパフォーマンスを可
こんにちは！株式会社Rabeeの新人デザイナーのakaneです🏋 今回は、Webデザインで「紙っぽさ」を出す方法を考えてみました。参考事例も掲載しながら紹介していくので、どうぞ最後までお楽しみください！ はじめに：「紙っぽさ」とは？私が言う「紙っぽさ」とは、おもに「雑誌っぽさ」のことです。Webデザインだけど、雑誌っぽい。ディスプレイに映っているけれど、エディトリアル感がある。 たとえば、以下のようなデザインは私にとって「紙っぽい」例です。 出典：六本木未来会議出典：DMN出典：ぼくのおじさんどうして、私はこれらを雑誌のようだと感じるのでしょう？自分なりに考えたポイントを、ひとつずつ紹介していきます。 その①：文字が「組まれて」いる最初に挙げたWebサイトのひとつをよく見てみると、画像左上にある「NO. 153」の文字のうち、「NO.」だけが縦向きになっています。「NO.」と「153」を
Top > ビジネス > ChatGPT以降の労働市場は本当にAIに置き換えられているのか？ 500万人分のフリーランスの仕事を分析したリサーチが公開される
Webサイトやスマホアプリの実装に、ボタンは欠かせない要素の一つです。そんなボタンの実装に設定しておくと便利なCSSのスタイルを紹介します。 スマホでボタンをタップした際にズームなどの誤動作が起きないようにするCSS、ボタンのテキストが選択されてハイライトにならないようにするCSS、フォーカス時のアウトラインをより見やすくするCSS、ボタンの論理サイズを設定するCSSなど、デフォルトのスタイルとして設定しておくと便利です。 CSS Button Styles You Might Not Know by David Bushell 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに スマホでボタンをタップした際の誤動作を防止 ボタンのテキストの意図しない選択 ファイル選択のボタン ボタンをフォーカス時の視覚的なアウトライン
どういうこと？/TL;DR AWS → Cloudflareに移行したら費用が99%削減できました。 対象読者 今CloudFront + S3で構築しているけど転送量に困っている人 Cloudflare R2を検討している人 (CloudFrontとCloudflareをよく間違える人) はじめに 元々、動画CDNの構築はCloudFront + S3で構築していました。 この構成の場合、課金ポイントは主に三つあります。 CloudFrontのアクセス数に対する課金: そこそこ(多量ではない) S3の保管に対する課金: 200GB程度 CloudFrontの転送量(Egress)に対しての課金: 数TB そのため、毎回イベントごとにかなり費用がかかる状態でした。 動画の数もアクセス数もそこそこではあったのですが、動画特有の転送量が非常に多い… そういった状態でした。 導入前夜 この時はち
Googleが2024年4月3日、新たなJPEGのコーディングライブラリである「Jpegli」を発表しました。Jpegliは高い下位互換性を維持しながら機能が強化されており、高品質の圧縮設定で圧縮率を35％も向上したとのことです。 Introducing Jpegli: A New JPEG Coding Library | Google Open Source Blog https://opensource.googleblog.com/2024/04/introducing-jpegli-new-jpeg-coding-library.html libjxl/lib/jpegli at main · libjxl/libjxl · GitHub https://github.com/libjxl/libjxl/tree/main/lib/jpegli インターネットは人々の生活や仕事に
新しいプログラミング言語やライブラリ、フレームワークを学ぶには、実際にそれらを試して挙動などを見てみることが大事ですが、実行環境を用意するのは手間がかかります。 そこで役立つのが、いわゆる「プレイグラウンド」と呼ばれる、Webブラウザでプログラミング言語やライブラリ、フレームワークをすぐに試すことができるサービスです。 主要なプログラミング言語の公式サイトには、実際にその言語をすぐに試せるプレイグラウンドが用意されていることも多く、また公式サイト以外にもネット上にはさまざまなプレイグラウンドがあります。 プレイグラウンドを使えば、気軽にいろんなプログラミング言語やライブラリ、フレームワークを試せます。 この記事ではそうしたプレイグラウンドをまとめてみました。ここで紹介したプレイグラウンドの他にも、あなたのお気に入りのプレイグラウンドがあればX/Twitterやブックマークのコメント、メール
はじめに みなさんはChromeの拡張機能を使っていますか？ 僕も使っていますが、案外Chromeの拡張機能を作るのは簡単です。 今回は、普段の業務の効率を上げるのも兼ねて自作してみました! 最低限準備するもの manifestファイル Javascriptファイル ぶっちゃけ、これだけで動きます。 実際に作ってみよう それでは実際に作成していきましょう。 今回はDとVを押すだけで、Markdownのリンクを作成する拡張機能を作成していきます。 まずは、manifestファイルから設定していきます! manifestファイル を参考にして、備忘録も兼ねて説明していきます。 今回は、最低限の設定を行います。 { "manifest_version": 3, "name": "Create markdown link", "version": "1.0.0", "icons": { "16":
オンラインデザインツール「Canva」を手掛ける豪Canvaは3月26日、プロフェッショナル向けデザインツール大手の英Affinityを買収すると発表した。取得額など詳細については明かしていない。 Canvaは2013年に設立。オンライン上でアクセスできる統合型のデザインツールで、スライドやポスター、SNS用のバナーといったデザインから、写真・動画編集にいたるまで、さまざまなデザインニーズに対応することができる。無料でも利用できる点やユーザーインタフェースに優れていることもあり、全世界で1億7500万人のユーザーを抱えるまでに成長している。 一方Affinityは、PCやスマートフォン、タブレット用のデザインツールを手掛ける企業。現在、ベクターベースのグラフィックソフト「Affinity Designer」、写真編集ソフト「Affinity Photo」、ページレイアウトソフト「Affin
静的サイトジェネレーター「VitePress 1.0」正式リリース。VueとViteを採用し、高速なWebサイトを構築
静的サイトジェネレーター「VitePress 1.0」が正式リリースされた。UIフレームワークのVueと高速なバンドラであるViteを基盤に、MarkdownのコンテンツからSPAなWebサイトを構築できる。 オープンソースとして開発されている静的サイトジェネレーターの「VitePress 1.0」正式版がリリースされました。 VitePressは、Markdownで記述されたコンテンツを静的で美しい外見を持つWebサイトへと高速に変換する機能を備えたフレームワークです。 デフォルトでテクニカルドキュメントに適したテーマが用意されており、すでにVite、Rollup、Pinia、VueUse、Vitest、D3、UnoCSS、IconifyなどのWebサイトのドキュメント部分に使われているとのことです。 VitePressは、同じく静的サイトジェネレーターである「VuePress」のモダン
プログラミング支援AIサービスまとめ。GitHub Copilot、AWS CodeWhispererなど11種類（2024年3月版）
GitHub CopilotやAWS CodeWhispererをはじめとする、コードエディタに統合できる11種類のプログラミング支援AIをまとめた。 GitHub Copilotに代表されるコードエディタに統合されたプログラミング支援AIサービスは、まだ登場して間もないにも関わらず、多くのプログラマの生産性向上にとって欠かせない機能になりつつあります。 と同時に、プログラミング支援AIサービスはGitHub Copilot以外にもさまざまなクラウドベンダ、ツールベンダ、スタートアップなどが参入し、多様な製品が新たに投入され続けている変化の激しい分野でもあります。 ここではその中から、現時点での主要なサービスやソフトウェアを11種類取り上げ、まとめました。導入や選択の参考にしていただければと思います。 価格別の主な機能 （Copilot Individual ／ 月額10ドル／年間100ド
日本の漫画が世界で人気を集める中、外国語に翻訳された作品を無断で掲載した海賊版サイトの被害が深刻化しています。スマートフォンなどのアプリを配信する公式ストアでも海賊版に誘導する外国語の違法なアプリが複数確認されていて、業界団体は対策が必要だとしています。 出版社などでつくる一般社団法人「ABJ」がことし2月に調べたところ、漫画などの出版物を無断で掲載する海賊版サイトは1207サイトに上り、このうち7割以上を占める913サイトが英語やベトナム語などに翻訳された作品を集めた外国語のサイトだったことがわかりました。 ABJによりますと、日本語の海賊版サイトのアクセス数は出版社などの対策によって一時期の4分の1程度に減少していますが、外国語のサイトは近年、ベトナム語など東南アジア向けを中心に拡大していて、アクセス数は日本語版の少なくとも5倍以上、著作権侵害の被害額も大幅に上回るとみられます。 また
メルカリのクローンサイトを作りながら、React・Tailwind CSSが学べる本です。
inline-block を使う理由、それは 入れ子構造を作れることにより、改行位置の優先順位をつけられるから！ 詳しくは以降で説明します。 （前提）そもそも改行調整ってなんの話？ このタイトルを見て記事を開いた方であれば知っていると思いますが、一応説明です。 スペースで単語が区切られる欧文とは違い、日本語は単語の区切りがないので、改行すべき位置を機械的に判断できず、不自然な位置で改行されてしまうことがあります。そこで、見た目を整えるため、改行すべき位置を指定するための手法が必要になります。 他に詳しい記事がいくつもありますので、詳細はそちらを参照してください。 代表的な改行調整の手法 <wbr> 要素 <wbr>要素は、改行してよい位置を表す要素です。 親要素に対して word-break: keep-all; を指定して基本的には改行されないようにすることで、<wbr>要素がある位置で
GitHubは、脆弱性のあるコードをAIボットが自動的に発見、修正したコードとその解説をプルリクエストしてくれる「code scanning autofix」（コードスキャン自動修正機能）を発表しました。 Meet code scanning autofix, the new AI security expertise now built into GitHub Advanced Security! https://t.co/cTDuKZCWMv — GitHub (@github) March 20, 2024 下記がそのコードスキャン自動修正機能の説明です。「Found means fixed: Introducing code scanning autofix, powered by GitHub Copilot and CodeQL」から引用します。 Powered by GitH
30分でわかるシステム運用アンチパターン / Operations Anti Patterns in 30 minutes
知っておくと便利なCSSの単位: フォントに基づく相対単位（em, rem, cap, ch, ex, ic, lhなど）の便利な使い方を解説
CSSでよく使用する単位といえば、px, r(em)あたりでしょうか。 CSSはそれら以外にもたくさんの単位が使用できます。フォントに基づく相対単位（em, rem, cap, ch, ex, ic, lhなど）の便利な使い方を紹介します。 Relative length units based on font -Going beyond pixels and (r)ems in CSS by Brecht De Ruyte 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに CSSの単位: capとは CSSの単位: chとは CSSの単位: emとは CSSの単位: exとは CSSの単位: icとは CSSの単位: lhとは CSSの単位: remとrlhとは CSSの単位: rex, rch, ricとは はじめに
コンテナクエリがすべてのモダンブラウザの安定版でサポートされ、メディアクエリに代わり、コンテナクエリを使用する機会も増えてきたと思います。 コンテナクエリは親コンテナに基づいてスタイルを定義できるものですが、親のサイズによるクエリだけではありません。親のスタイル値によるクエリ（スタイルクエリ）も可能です。スタイルクエリを使えるようになると、どんな風に便利になるかを紹介します。 Add Superpowers to Your CSS Variables with Style Queries by Jared White 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 スタイルクエリを使えるようになると スタイルクエリは変数と組み合わせると、さらに強力 スタイルクエリを使えるようになると CSSはスタイルクエリの登場により、さらなる
横スクロールバーの発生源はデベロッパーツールのConsoleですぐに特定できる横スクロールバーの発生源の特定方法として有名なのは全称セレクタですべての要素にoutlineを付与して確認する方法だと思われますが、次のスクリプトをデベロッパーツールのConsoleに貼り付けて確認したほうが手っ取り早いです。
ここ1~2年くらいで 使えるようになった(主要ブラウザーの最新版 がすべて対応した ) ウェブの新機能について ランダムに喋る!
2024.03.15 福岡フロントエンド勉強会 #1
2026年までに検索エンジンは生成AIのチャットボットにシェアを奪われ、利用が25％減少する。ガートナーの予想
米ガートナーは、2026年までに従来の検索エンジンは生成AIによるチャットボットやそのほかのバーチャルエージェントにシェアを奪われ、利用されるボリュームが25％減少するという予想を明らかにしました。 ガートナー社によると、2026年までに従来の検索エンジンのボリュームは25％減少し、検索マーケティングはAIチャットボットやその他のバーチャルエージェントにシェアを奪われるという。 「生成AIによるソリューションは、従来の検索エンジンで行われていたユーザーのクエリを置き換え、回答を得るための代替エンジンになりつつある。生成AIが企業のあらゆる側面に組み込まれるにつれて、企業はマーケティングチャネル戦略を再考する必要に迫られるだろう」と、同社バイスプレジデントアナリストのAlan Antin氏は予想の中で説明しています。 Antin氏は、生成AIがコンテンツ制作のコストを下げるため、検索エンジン
Blueskyが「ユーザーがコンテンツを独自にモデレーションできる機能」を発表＆モデレーションツール「Ozone」をオープンソース化
Blueskyが「○○の画像は非表示にする」「○○の話題は非表示にする」といった独自の基準でコンテンツを非表示に設定できるモデレーション機能を発表しました。各ユーザーはBluesky運営チームのモデレーションに加えて、他人のモデレーションを自分のフィードに適用して見たくないコンテンツを非表示にできます。 Bluesky’s Stackable Approach to Moderation - Bluesky https://bsky.social/about/blog/03-12-2024-stackable-moderation GitHub - bluesky-social/ozone-ui: web interface for labeling content in atproto / Bluesky https://github.com/bluesky-social/ozone-u
新たなサーバサイドJavaScriptランタイム「WinterJS 1.0」正式リリース、WebAssemblyへのコンパイルも可能。Wasmerが開発
新たなサーバサイドJavaScriptランタイム「WinterJS 1.0」正式リリース、WebAssemblyへのコンパイルも可能。Wasmerが開発 WebAssemblyランタイム「Wasmer」の開発元として知られているWasmer社は、新しいサーバサイドのJavaScriptランタイム「WinterJS」の正式版となる「WinterJS 1.0」のリリースを発表しました。 ❄️ Introducing WinterJS 1.0 - the fastest WinterCG Javascript runtime in the world powered by Rust and SpiderMonkey ...and #WebAssembly compatible! Now supporting: React Server Components Cloudflare mode 150
CSSでif～else文が使えたら、と思ったことはありませんか？ もちろんifとかelseはCSSにはありませんが、CSSだけでif～else文と同じようにスタイルを設定できます。 CSSでif～else文を実現するには...記事の続きを読む
AIスタートアップの米Anthropicが、同社のチャットAI「Claude 3」向けに公式プロンプト集を公開している。3月11日までに64種類の使用例を公開中。専用のWebサイト「プロンプトライブラリ」で公開しており、英語と日本語表示に対応している。 例えば、入力した材料や好みに応じた料理レシピを提案する「料理クリエイター」などのプロンプトを公開している。プロンプトは「システム」と「ユーザー」の2つに分かれ、まず前者でAIに指示し、次に後者でユーザー個別の条件や要件を伝える仕組み。料理クリエイターの場合は以下のような具合だ（原文ママ）。 システム：あなたの仕事は、利用可能な材料や食事の好みに関するユーザーの入力に基づいて、パーソナライズされたレシピのアイデアを生成することです。この情報を使用して、ユーザーの食事のニーズに対応しながら、指定された材料を使用して作ることができるさまざまな創造
GitHubでマルウェアを仕込んだリポジトリを本物に見せかけて拡散させる手口が横行し、10万を超す感染リポジトリが見つかっているとしてサイバーセキュリティ企業が注意を呼びかけている。攻撃は今も続いており、何も知らない開発者がこうしたリポジトリを使えば、マルウェアに感染してパスワードなどの情報が流出する恐れがある。 サプライチェーンのセキュリティ対策を手掛ける米Apiiroによると、GitHubのリポジトリを狙う「リポコンフュージョン（取り違え）攻撃」は2023年11月ごろから激化したという。 攻撃者は、開発者をだまして悪質なコードやファイルをダウンロードさせる目的で、正規のリポジトリのクローンを作成。そこにマルウェアを呼び出すコードを仕込み、同一の名称でGitHubにアップロードする。次に自動化の仕組みを使ってそれぞれを何千回もフォークさせ、Web上のフォーラムなどで宣伝しているという。
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
知れば写真が上手くなる！基本・応用の構図15選と構図を使いこなすコツ | Adobe
より良い Git コミットメッセージを書こう - Qiita
表記揺れ検出ツール「テキストゆれないくん」 - inzkyk.xyz
EVERNOTEの日本法人、エバーノート株式会社が解散 サービス自体は継続 | RTB SQUARE
HTML・CSSで実装するかわいいフキダシのアイデア - ICS MEDIA
Gmailにメールが届かなくなる!? 5月中にやるべき対応策をマンガで教えてください！WACUL安藤健作さんに聞いてきた | Webのコト、教えてホシイの！
2024年版 HTMLで作るフォームバリデーション - ICS MEDIA
Tailwind CSSを本気でカスタマイズする方法
Webデザインで「紙っぽさ」を出す方法を考えてみる｜akane
ChatGPT以降の労働市場は本当にAIに置き換えられているのか？ 500万人分のフリーランスの仕事を分析したリサーチが公開される | Ledge.ai
動画作成アプリ「Google Vids」発表、AIで仕事用の動画を作れる
CSSでボタンを実装するときに記述しておくと便利なスタイルのまとめ
Cloudflareに移行したら99％コスト削減できた話
Googleが高品質なJPEG画像の圧縮率を35％向上させる新たなコーディングライブラリ「Jpegli」を発表
プログラミング言語をすぐに試せる「プレイグラウンド」まとめ。2024年版
超簡単にChromeの拡張機能を作ってみる【誰でもできるよ】 - Qiita
Canva、Affinityを買収 Adobe対抗のデザインツール大手
日本の漫画「タダ読み」被害深刻化 外国語の海賊版対策 急務に | NHK
【2024年】React, Tailwind CSSでメルカリクローンサイトを作ろう【入門】
それでも私が<wbr>でなくinline-blockで改行調整をする、たった1つの理由
GitHub、脆弱性のあるコードの自動修正機能発表。AIボットが修正済みコードと解説をプルリクエスト
GitHub Copilot Tips and Tricks
CSSでスタイルクエリ（@container style()）を使えるようになると、実装がいろいろ便利になる
横スクロールバーの発生源を素早く特定する方法と最新の防止策 ｜ TAKLOG
CSSだけでif～else文と同じことができる！ しかもすべてのブラウザでサポートされています
話題のチャットAI「Claude 3」のプロンプト集、公式が公開中 「Excelの数式作って」など64種
GitHubに大量の悪質リポジトリ、その数“10万超” 感染するとパスワード流出の恐れ