Noto Emojiとは Google Fontsにて提供されている、Emojiが白黒で表現されたUnicode絵文字。 今回はこれでサービスのアイコンをすべてまかなうことができないかと考えました。 補足:Noto Emojiについての説明は以下の記事に詳しく記載されています https://forest.watch.impress.co.jp/docs/news/1408856.html Noto Emojiをアイコンとして使ったサービス このサービスをNuxt.js+Firebase+Algoliaで個人開発しました。 画面を制作するにあたり、アイコンをSNSのアイコンなどの一部を除きすべてNoto Emojiを使用しています。 使い方 emoji用のclassを作って 使用例 見出しに添えるアイコンにつかったり 空のサムネイル部分の絵の意匠、上矢印、バツボタン、追加の部分のプラスボタ
mutexの桝田です! Reactのデータフェッチに、Vercel社が提供する「SWR」やTanStackコミュニティが提供する「React Query(TanStack Query)」が使われることが多くなってきています。 これらのライブラリは単なるフェッチだけでなく、キャッシュやデータの更新を担ってくれます。また、Reactが志向する「宣言的」な記述を体現できることも大きなメリットです。 本稿では、(我々が採用する)React Queryにフォーカスし、React Queryを使って実現している状態管理について説明します。SWRを普段お使いの方に関してもかなり共通する部分が多いのではないかと思います。 1. 対象読者 Reactのデータフェッチライブラリの使用を検討している方 普段SWRやReact Queryを使用している方 普段Reactを使用するすべての方
developer.1password.com パスワード管理ソフトで有名な 1Password に SSH の鍵管理の機能が追加されていた。 新たにセットアップする機会がなかったのでスルーしていたが、セットアップ機会が訪れたので試してみたところ、思った以上に体験が良かった。 また GitHub に SSH 鍵でコミットの署名・検証を行える機能が追加された。 これらが組み合さって、これまでの鍵管理やコミット署名と比べて手間無くセキュアに出来ることに気づいてきたので紹介してみる。 1Password での SSH 鍵生成/管理 まず、1Password 8 から SSH の鍵を生成 / 管理できるようになった。 blog.1password.com 詳しいやり方は上記のブログやドキュメントを見てもらう方がわかりやすい。 この機能を使った GitHub への鍵の登録イメージはブログにもあるこの
「システム開発に関わるコストを減らしたい」「テストでバグが多すぎるので何とかしたい」「テスト工程まで来てから手戻りが発生し、現場がどんどん疲弊していく」。これらの悩みは開発に関わるPM・SEであれば誰もが直面することです。「PM/SEのための上流工程戦略会議」では、2事例を挙げ、上流工程において“少しの手間”を掛けることで、品質とコストに大きな効果を上げることができるポイントを共有しました。全4回。1回目は、上流工程で曖昧な仕様をつぶすための3つの方法について。 篠原新治氏の自己紹介 司会者:本日の登壇者はこちらの方々です。今回はテスト・アライアンス事業部の事業部長である石原さんと、エンタープライズ品質サービス事業部金融ソリューションサービスグループの副部長である畠山さんの2名にご登壇いただきます。Q&Aコーナーのファシリテーターは、グループ開発事業推進部長の篠原さんに務めていただきます。
OpenAIがSpeech-To-Text AIのWhisperを発表しました。Githubからpipでインストールすれば簡単に使えます。私のM1 Max MacBook Proでも動作しましたので、作業内容を書いておきます。 GitHub – openai/whisper: Robust Speech Recognition via Large-Scale Weak Supervision Robust Speech Recognition via Large-Scale Weak Supervision – GitHub – openai/whisper: Robust Speech Recognition via Large-Scale Weak Supervision Python仮想環境を作る Python自体のインストールは既に終わっているところから書くことにします。私の環境は
フルスタックエンジニアから「フルサイクルエンジニア」へ。和田卓人氏による「組織に自動テストを根付かせる戦略」(その3)。ソフトウェア品質シンポジウム2022 9月22日と23日の2日間、一般財団法人日本科学技術連盟主催のイベント「ソフトウェア品質シンポジウム2022」がオンラインで開催され、その企画セッションとして行われた和田卓人氏による講演「組織に自動テストを書く文化を根付かせる戦略(2022秋版)が行われました。 講演で、企業の業績はソフトウェアの開発能力に左右されるようになってきていること、その開発能力を高める上で重要なのがコードの「テスト容易性」や「デプロイ独立性」であると和田氏は指摘。その上で、それを実現させるような「自動テストを書く文化」をどうすれば組織に根付かせることができるのか、講演の後半ではこの本質的な議論へと踏み込みます。 本記事は、2時間におよぶこの講演をダイジェスト
本記事は、2022年5月に開催されたTechFeed Conference 2022のセッション書き起こし記事「コンテナビルド最新事情 2022版(inductor) — TechFeed Conference 2022講演より」を転載したものです。オリジナルはTechFeedをご覧ください。 それではこれから、私@_inductor_が「コンテナビルド最新事情」ということでお話をしていきます。 今日は主に4つの話をしていきます。ちょっと駆け足になってしまいますが、コンテナビルド高速化に向けた4つの機能およびポイントについてお話しします。 今回お話すること Dockerfileの新しい記法 まず最初に、Dockerfileに新しい記法がいくつか増えています。それを実装しているのは BuildKitと呼ばれるDocker発のオープンソースのソフトウェアがベースになっていて、Dockerf
はじめに サーバーサイドの八木です。 娘が生まれてからアゴヒゲを一回もそっていなかったようでモサモサになってしまいました。 娘は喜んで引っ張っているので一旦はヨシとします(怒られたら謝ります) 先日、なんとなく Zenn を眺めていると以下の記事が目に入りました。 そういえばAPIのシナリオテストしたいけど、丁度いいツールが見当たらず長らく手つかずになっていたプロジェクトがあり、導入する価値がありそうだなぁと思い試してみました。 結果から言うと現在使用しています。導入して良かったと感じています 🎉 良かった点 go test で完結出来ること API の呼び出し結果を取り回すことが出来る テストケースだけYAMLに逃がすことが出来るのでメンテすべきファイルが明確になる 機能がシンプルなので学習コストが低い データベースへのクエリ発行も対応している 上記がポイントかと思います。 特に 「g
As part of my continuous work to see how much I can do with just CSS (see other work such as the CSS only Minecraft Chicken), I decided to try and recreate Windows 98 using nothing else apart from CSS and HTML. Did anyone ask for this? Not really? Is it fun to try and see what you can accomplish with just CSS? Yes, sort of. Was it time consuming? Unfortunately yes. Here is the demo - and a quick n
PWA で作った台本ビューア を Svelte で作り直すことにしたので、やったことをメモしていきます。 使っている技術 Svelte (チュートリアル終えたくらい) PWA (簡単なアプリを作れるくらい) TypeScript (初心者) 記事リンク 次回 : <第2回> PWA にする シリーズ記事一覧 <第1回> 基本のコンポーネントを作る 今回の概要 今回はプロジェクトを作るところからです。 まだ PWA にはしていません。 基本的な UI としてヘッダとドロワーをコンポーネントにするところまでです。 今回使うソースコードは GitHub のこちらのコミット にあります。 元の台本ビューアについて 元になっている台本ビューアのソースコードは GitHub のこちらのコミット にあります。 実際に動くものは以下にあります。 satamame.github.io/pscv/ Svelt
import { BrowserRouter, ParamParseKey, Route, Routes, useParams } from "react-router-dom"; import User from "./pages/users/[id]"; import "./App.css"; import Top from "./pages/top"; export const PATHS = { TOP: "/", ABOUT: "/about", USERS_ID: "/users/:id", } as const; // これでクエリパラメータの id が取り出せる export const useParamsUsersId = useParams<ParamParseKey<typeof PATHS.USERS_ID>>; function App() { return (
Slackの「次世代プラットフォーム」がこの記事を書いてる2週間ほど前、しれっとパブリックベータになりました。 今回はこの公開したてのプラットフォームでアプリをつくってみたので、それを紹介しつつ、感想を書きます。 全く新しいプラットフォーム 「new Slack platform」と謳う新しいプラットフォームは現在の「Slack API」を使ったSlackアプリをつくるものとは別物です。 パブリックベータになったばかりでかつ、Workspaceが有料プランではないと今のところデプロイできません。 それもあってか公式以外に情報が皆無の状態で、手探りながら試してみました。 結果わかったのはとにかく「今までとは全く違う」ということでした。 特徴を紹介しましょう。 Slackのクラウドで動く まずこれが一番大きいです。 アプリケーションをSlackのクラウドへデプロイすることになります。 いわゆる
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く