簡易 eshell-pop, cde, cdp - Shohei Yoshida's Diary
個人的に Emacsから shellを使うことは苦手で基本使わないんですが、 それでもわざわざ Emacsから shellに Alt-Tab等で切り替える必要も ないかってこともあるので、eshellをちょろっと使うようの関数を 書いてみました。 cdeは eshell-popを実行したバッファのディレクトリに移動するための コマンド、cdpはプロジェクトトップ(.gitがあるディレクトリ)に 移動するコマンドです。shell用バッファを簡単に閉じるために、 popwinを使って popupしています。 (require 'eshell) (require 'popwin) (defvar eshell-pop-buffer "*eshell-pop*") (defvar eshell-prev-buffer nil) (defun eshell-pop () (interactive)
Routing: API Routes | Next.js
API RoutesExamples Basic API Routes API Routes Request Helpers API Routes with GraphQL API Routes with REST API Routes with CORS Good to know: If you are using the App Router, you can use Server Components or Route Handlers instead of API Routes. API routes provide a solution to build a public API with Next.js. Any file inside the folder pages/api is mapped to /api/* and will be treated as an API
Reactを自作しよう
この記事は Build your own React を翻訳したものです。 Reactを1から書き直していきます。 実際のReactコードのアーキテクチャに従いますが、最適化機能と必須ではない機能は今回は実装しません。 Step 1: createElement関数 Step 2: render関数 Step 3: 並列モード Step 4: ファイバー Step 5: Render Phase と Commit Phase Step 6: 差分検出 Step 7: 関数コンポーネント Step 8: Hooks Step 0 復習 最初にいくつかの基本的な概念を確認しましょう。 React、JSX、およびDOM要素がどのように機能するかをすでに理解している場合は、この章はスキップしても構いません。 今回は、次のわずか3行のコードをReactアプリの例として使用します。 const ele
Atomic Design はなぜ難しいか？どうやって難しさを解消するか
Atomic Design は難しい Webフロントエンド開発をしている人で Atomic Design を用いた経験がある方に会った時は、必ず 『Atomic Designどうですか？』と聞くようにしています。 大体の方はちょっと苦笑いをしながら『やっぱり難しいですねぇ』とか『試行錯誤しながらで...』みたいなことを教えてくれます。 私もメインの開発をする際に Atomic Design という枠組みを用いています。そして、同様に色々と悩んだのですが、このあたりについて納得がいく解釈ができたと思っています。 そこで、私の思う Atomic Design の難しさや、そう思う原因、どうやってそれを解消するかという点について、https://atomicdesign.bradfrost.com/ を適宜参照しながら共有したいなと思います。 そもそも Atomic Design 何やねん。な方
AutoWebPerf で CoreWebVitals を計測する
はじめに AutoWebPerf をいろいろ触ってみたので紹介していこうと思います CoreWebVitals Core Web Vitals とは優れたユーザーエクスペリエンスを提供するための3つの指標のことです Largest Contentful Paint (LCP) First Input Delay (FID) Cumulative Layout Shift (CLS) AutoWebPerf AutoWebPerf とは Google が作った複数のソースからパフォーマンスのデータを自動的に収集できるツールです Chrome UX Report、PageSpeed Insights、WebPageTest など収集元のツールが増えてきて、それぞれ個別で設定をし計測を行うのは負荷が高まってきたので、1つの統合的なツールを利用して複数のソースからパフォーマンス監視をできるようにし
5年間 Laravel を使って辿り着いた，全然頑張らない「なんちゃってクリーンアーキテクチャ」という落としどころ
この記事は Laravel Advent Calendar 2020 - Qiita 最終日の記事です。 TL;DR DDD や "真の" クリーンアーキテクチャは， Web 業界における大抵の現場ではオーバースペックだし，導入しても全員がついてこれるとは限らない app/UseCases ディレクトリだけ切って，ドメインごとに単一責務なクラスを置くと使いやすいよ ActiveRecord 指向のフレームワークで Repository パターンを無理に導入すると死ぬので， UseCase で Eloquent Model の機能を使うことを恐れるな はじめに Zenn では初投稿です。日本の Laravel コミュニティではもうお馴染みのようで実はあまり顔を出していない（？） @mpyw と申します。オンラインサロンの火付け役となった Synapse が最初の仕事でしたが，就職後すぐ会社が
Next.jsに「できるだけ」依存しないReactアプリケーションの構成
TL;DR 本記事で紹介するのは、Redux や React Router を使った React アプリケーション構築時のベストプラクティスを Next.js に適用した考え方です。 Next.js を外部モジュールと考え、Container/Presentation の Container を Adapter 層と見なす考え方 next/router などの Next.js の組み込みモジュール、Store、SWR（React Query） は Container（Pages） 層で利用する Storybook でコンポーネントを表示する際、Next.js 等のモックをできるだけ作らない 但し、Template 層以下の next/link や next/image への依存は制御できない なお本記事では、Next.js の依存層、Pages 層とTemplate 層という言葉は以下のこ
Martin Fowler's Bliki (ja)
ここは、Martin Fowler's Blikiの日本語翻訳サイトです。Martin Fowler氏本人の許可を得て公開しています。データはGitHubで管理していますので、どなたでも翻訳に参加することが可能です。 ※現在、移行中につき、Markdown形式になっていないものが多々あります……。PRいただけると大変ありがたいです。 API design / agile / agile adoption / agile history / application architecture / application integration / bad things / build scripting / certification / clean code / collaboration / computer history / conferences / continuous deliv
Next.js公式examples集を分類（2020年7月版） - Qiita
更新履歴 Next.js公式examples集を分類（2023年7月版） Next.js公式examples集を分類（2022年7月版） Next.js公式examples集を分類（2021年7月版） Next.js公式examples集を分類（2021年1月版） Next.js公式examples集を分類（2020年7月版） はじめに Next.jsの公式サンプルは現在236本あります。（2020/07/22） しかし、このままではどれを見たらいいのかわからないので主観で分類してみました。 （基礎）Next.jsで基礎的な内容を扱っているサンプル。 （公式）公式ドキュメント で説明するのに使われているサンプル等。 degitを使ってソースのみを取得したい（npx create-next-appをつかってインストールまではしなくていい場合） Next.js公式examples集 Next.
【React】useSWRはAPIからデータ取得をする快適なReact Hooksだと伝えたい - パンダのプログラミングブログ
Vercel製のuseSWRはReactの非同期データ取得をラクにする SWRとは、Next.jsを作成しているVercel製のライブラリです。**SWRはuseSWRというReact Hooksを提供し、APIを通じたデータの取得をラクに記述する手助けをしてくれます。**このライブラリはなんとGitHubスター数を10,700も獲得しています。 SWRはライブラリ名で、stale-while-revalidateというRFC 5861で策定されたキャッシュ戦略の略称です。このSWRがデータ取得の扱いをラクにしてくれて最高なのです。 React開発者が嬉しいuseSWRの書き心地 useSWRは外部APIからのデータ取得、ローディング状態、エラーが発生した時をシンプルに記述できます。これがあらゆるReact開発者にとって（というか、ReactでAPIにリクエストを頻繁に送るアプリケーション
GYAO!トップページの表示パフォーマンス改善 〜 GraphQLアーキテクチャへの移行
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは、映像サービスプロダクト本部の浜田（@narirow）です。 GYAO!では最近トップページの大規模な変更が行われました。本記事では映像サービスのバックオフィスを含む大規模な構成変更と、その成果として得られたスケーラビリティ・ページの表示速度の向上についてをお話しします。 GYAO!のトップページの特徴 映像サービスであるGYAO!のトップページは、豊富なラインアップの中から作品を厳選して掲載しています。有名作品をただ並べるだけではなく、レコメンデーションやターゲティングの技術を使って、閲覧者の趣向にあった作品を一覧しています。大量の画像が表示されていることに加え、縦に長いページ構成となっています。 課題と解決のアプロー
touch, click, pointerの実装 | 前編 タッチイベントとマウスイベント
touch, click, pointerの実装 前編 タッチイベントとマウスイベント このシリーズでは、タッチ／マウスイベント系の実装を考えます。第1回目はタッチイベントとはなにか、また、タッチイベントとマウスイベントの判別について解説します。 はじめに iPhone、Androidが登場したのはもう何年も前ですが、さらにWindows8も登場し、いろいろと状況が変化してきました。Windows8を搭載したPCの多くはタブレットデバイスのように、画面に触れることができるようになっています。 しかしながら、これらのデバイスはマウスを使っても操作できるようにもなっています。今後、どのようにタッチ／マウスのイベントを扱っていけばよいのかは、これからのウェブ開発において、より重要になっていくはずです。 そこでこのシリーズでは、タッチ／マウスイベント系のブラウザへの実装を整理し、それらのブラウザに
Emacsモダン化計画 -かわEmacs編- - Qiita
EmacsJP Slackで話題に上がったEmacsモダン化計画という語感に触発され、Emacsひなまつりでそれっぽい話をすることにした。本記事では、見た目中心の変更方法について紹介する。 ちなみに現在82パッケージ導入しているが、use-packageでフル遅延ロード、なにか遅ければデフォルトのプロファイラで原因を解析して修正しているのでEmacsでも起動も動作も早い(現在の起動時間は0.4秒)。 コードが読みやすいテーマ -- doom-emacs-themes(doom-dracula) Doom Emacsという(Evilユーザ向け)Spacemacs系のプロジェクトがあり、このDoom Emacsのために開発されたテーマ。 目立たせるものと、そうでないもののバランスが良ため、非常に気に入っている。Dracula公式のEmacsThemeもあるが、Doomとは微妙に色味が異なる。
ターンテーブルシート RTS-30
定価：￥38,000（税別） 外径寸法：約Φ290mm×厚さ5mm 質量：355g RTS-30はアナログプレーヤーによってご使用出来ない場合がございますので御注意下さい。 使用出来ない、または使用できない可能性があるアナログプレーヤーは下記になります。 ※TechDAS、マイクロ精機などの吸着式ターンテーブルを使用したアナログプレーヤー （但し、吸着をしなければご使用可能です） ※ROKSAN XERXESシリーズ TMSシリーズ （ターンテーブルとキャビネット、モーターとの位置関係の状態によって使える場合がございます） ※その他、使用可能かどうかは送料のみの無料貸し出しを行っておりますので、実際にお試しの上ご判断下さいませ。 これまでのターンテーブルシートは金属製やガラス製、フェルトやゴム素材など様々な素材が採用されて来ましたが、それらは全て素材の音色的な癖が再生音に乗るだけのものでク
アンティーク・古道具・暮らしの雑貨店 京都 [ モンティーク ]
【 お ね が い 】 お問い合わせやご注文の際、すぐに返信されます「自動配信メール」が届いていない場合は、 大変お手数ですがアドレス変更や拒否設定等ご確認の上、再度連絡頂けますようお願い致します。 【 営 業 の お し ら せ 】 【年末年始の営業案内】 12/29(金) 通常営業 12/30(土) 11〜17:00頃営業 12/31(日) 11〜17:00頃営業 1/1(月) お休み 1/2(火) お休み 1/3(水) 11〜17:00頃営業 1/4(木) 定休日 1/5(金) 通常営業 ------------------ 急なお休みはSNS等で随時お知らせいたします。 勝手ではございますが、ご理解のほどよろしくお願いいたします。 (営業カレンダーはこのページの下(web版のみ)です) 新入荷 France ピッチャー 17,600円(税込) England オクトゴナル皿
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - yuutayamada/flycheck-tip: Show flycheck/flymake errors by tooltip