ブックマーク / blog.ojisan.io (161)

  • DRF で association を持ったデータを serialize する

    yug1224
    yug1224 2022/10/03
  • Next.js にあるアレ、Astro でどうするか

    明日、トロ w 最近 Astro を触ったのでそのときに調べたこと。 Dynamic Routing Routing 自体は Next.js と同じようにできる。つまり pages/ に [id].astro のようなものを作れば良い。それが URL になる。 この id は const { id } = Astro.params; のようにして取れる。Next と違って context は無いが、Astro という名前空間から取ってこれる。 getStaticPaths Next にある getStaticPaths も Astro には getStaticPaths としてある。 export function getStaticPaths() { return [ // Generates: /dogs/clifford { params: { dog: "clifford" } }

    Next.js にあるアレ、Astro でどうするか
    yug1224
    yug1224 2022/10/03
  • Django 製 API 仕様書を Swagger で作る

    Django から Swagger で吐きたいというニーズは DjangoAPI を作っている時であろう。 そのときに使われるライブラリに Django REST framework があるが、このライブラリ自体に Swagger を生成する機能が含まれている。 それを使えばおしまいと思ったがそうではなかったので困ったことと対策をまとめていく。 前提 ライブラリはこのバージョンで検証している。

    Django 製 API 仕様書を Swagger で作る
    yug1224
    yug1224 2022/10/03
  • Django 製アプリを Cloud Run で動かすまで

    yug1224
    yug1224 2022/09/24
  • debian:stable-slim で作ったコンテナに MySQL を入れる

    yug1224
    yug1224 2022/09/23
  • React + Rust + Wasm でオンラインモザイクツールを作る

    このエントリは PWA Night vol.43 ~ Web 技術でここまで出来る〜 のスライド資料です。 テキストやリンクの都合上、試験的にブログで資料共有してみようと思います。 この回では umie を作った話をしました。成果物のレポジトリは こちら です。 「React + Rust + Wasm でオンラインモザイクツールを作る」という題で発表します。 こんにちは、sadnessOjisan です。おじさん、おじさんさんなどと呼ばれることが多いです。Web 系のエンジニアで、普段は React や NodeJS を書いています。blob.ojisan.io というブログも書いていて技術料理の話をしています。よければ読んでみてください。 Umie というモザイクツールを作りました。これはただのモザイクツールですが、ウェブ上で動きます。実はウェブ上でモザイクをかけられるツールは意外と

    React + Rust + Wasm でオンラインモザイクツールを作る
    yug1224
    yug1224 2022/09/23
  • Gatsby で React の import なしで利用する

    yug1224
    yug1224 2022/09/12
  • Gatsby は設定ファイルを TypeScript で書ける

    yug1224
    yug1224 2022/09/12
  • キャプチャーボードを買ってスプラトゥーンの反省をしている話

    スプラトゥーンをうまくなりたい スプラトゥーン 2 は 3 年ほど遊んでプレイ時間 1400 時間でウデマエが S+0 が限界でした。 ゲームをつけっぱなしにしていたので実際はそんなに遊んでいないとは思いますが、それでも 1000 時間は遊んでいたと思います。 ただそれだけ遊んでもウデマエは X になりませんでした。 これはとても悔しくて、3 では最高位までウデマエを上げたいなと思っていました。 キャプチャーボードを買った そんなときスプラトゥーン上達の方法としてキルされたときに switch の録画機能で録画して反省文を書く練習方法を教えてもらいました。これいいなと思ったので、あとから動画を見返すために無限のストレージである Youtube にあげるべく、switch のプレイを録画するためのキャプチャーボードを買いました。 Amazon で調べたところハイエンド品は 20,000 円ほ

    キャプチャーボードを買ってスプラトゥーンの反省をしている話
    yug1224
    yug1224 2022/09/12
  • 転職サイトはリファラを送るのをやめた方が良いと思う

    昨日ブログのアナリティクスを見ていると転職サイトからリファラが付いていることに気づき「ほほ〜〜ん」となったのでブログ書く。どこの転職サイトかは書かないし、少し前に 転職ドラフトに参加した なんてものも書いているからここに疑いの目が向けられるかもしれないが、ここかどうかという情報も全部含めて何も喋らない。GitHub 連携する系の転職サイトはどこも 3 年くらいアカウントを持っているので各媒体で日々レジュメが更新されている状況だ。 転職サイトからリファラが付くと何が怖いか もし所属企業のテックブログに寄稿している場合、そのページに対して "転職サイトからリファラが付いている、もしくはその数が急激に増えている" ことが検知できれば、その社員が転職しそうなのを会社側が察知できる。 なぜ転職サイトはリファラを付けてはいけないか 転職サイトは自分の所属企業に対しては自分が表示できないようにすることが

    転職サイトはリファラを送るのをやめた方が良いと思う
    yug1224
    yug1224 2022/09/08
  • Node.js の OAuth2.0 クライアントを自作する

    なぜ自作するか 自作したい動機は次の通りだ。 有名どころのライブラリは TS 実装されていない。 有名どころのライブラリは HTTP Client のためのライブラリを使っている。Node.js v18 を対象にするなら何も入れなくていい。 プロダクトの認証フローで複数のフローをサポートしないなら、その目的の機能を持った関数があればそれでいい。 フローによっては当にすごく単純な仕様なので手書きした方が早いし考えることが減って楽 主な動機を一言で言うと、既存実装は歴史が長いため古いコードであり、いま作り直すともっとスマートに作れるというところにある。それに (どのライブラリにも言える話ではあるが) accessToken が欲しいだけなのにライブラリを入れていると、その依存ライブラリのバージョニング次第ではセキュリティホールになったり、そもそも node_modules のインストール時間

    Node.js の OAuth2.0 クライアントを自作する
    yug1224
    yug1224 2022/09/07
  • Rust の 動的ディスパッチとか静的ディスパッチとか

    Rust for Rustcean を勧められて読んでいると、最初の型の話のところで動的ディスパッチ、静的ディスパッチ、といった言葉が出てくる。これが何か僕は知らなかったわけだが、どうやら JavaScript 以外のプログラミング言語をしたことある人にとってはお馴染みなものであるらしい。なのでそれをキャッチアップしたときの話。努力はしたものの合ってる確証は持てていないのでマサカリは @sadnessOjidan 宛てに送っていただけると助かる。 動的ディスパッチ 実行時にオブジェクトの型を調べ、対応するメソッドを呼び出す。実行時の処理なので、関数のインライン化(後述)ができない。実行時にvtable (メソッドのアドレスと実際の処理を保持した、クラスごとに持っているテーブル)を参照して決めるので、多少のオーバーヘッドがかかる。実行時に決めるメリットとして、メソッド名を実行時に組み立てて実

    Rust の 動的ディスパッチとか静的ディスパッチとか
    yug1224
    yug1224 2022/09/06
  • FCM で実現する Web push 通知 の解説

    なにを作ったか それは秘密です。とある何かを作ったのですが、公式から DM で怒られたので公開を停止しています。その供養も兼ねて、そのときの学びを書いていきます。 Web の Push 通知についての全体的な解説 通知と Push さて、Push 通知がされると、ブラウザがそれを受け取ってデスクトップだったり、アプリケーション内に通知を表示できます。 実はこれらは1つの仕様で定義されているのではなく、通知 API と Push API という 2 つの仕様で構成されています。 Notification API 通知を表示する仕組みがNotification APIです。 Push API 通知を受け取る仕組みがPush APIです。 これは、 アプリがプッシュ通知メッセージを受信するために、アプリでサービスワーカーが動作している必要があります。サービスワーカーが動作している時に、 Push

    FCM で実現する Web push 通知 の解説
    yug1224
    yug1224 2022/09/05
  • TSプロジェクトにコピペするだけの classname 連結関数

    yug1224
    yug1224 2022/09/04
  • 転職ドラフトに参加した

    AIOGP 作ったらマトリックスみたいになってしまった・・・ パーソナルな情報を全部消したので読みにくいかもです。自分語りすなって言われそうだったので・・・ この記事に書かれていないこと 私の指名額に関する情報 私に指名をしてくださった会社を特定できる情報 転職ドラフトとは 公式を見よう! https://job-draft.jp/ 一言で言うと、「先に自分に対するオファー額が分かった上で、企業からアプローチしてもらえるサービス」です。 ちなみにこのリンクから登録すると何かもらえるらしいので気になる人は是非。 レジュメを書いてプレゼントをもらいませんか? 審査が通れば ・オライリーAmazonギフト券 ・転職ドラフト オリジナルビール などがお互いに【かならず】もらえます。 会員登録後、マイページに紹介コード【RVSC】を入力してください。 #転職ドラフト https://jo

    転職ドラフトに参加した
    yug1224
    yug1224 2022/09/01
    “次は技術的なリードだったりマネージャーとしてのロールに挑戦したいなという気持ち” 弊社で挑戦しませんか?
  • 殺人マキネッタ

    OGP はお絵かき AI を使って "coffee beans kill human" で生成したものです。 マキネッタの角に殴られて死ぬ的な絵が生成されてほしかった。 今日はマキネッタで死にかけた話をします。 文章で書くことはないので、某エミュレータ事例集 Wiki のフォーマットで書きます。 Who(誰が) 筆者が When(いつ) コーヒーを飲みたくなったとき Where(どこで) 自宅のキッチンで Why(なぜ) たまたま豆を入れ忘れてお湯だけでコーヒーを作ってしまったら結果的にマキネッタの汚れが取れたので、もっと溜まった汚れを落ちるかもと思い What(何を) マキネッタを How(どのように) 豆を入れずに、蓋を閉めずにお湯だけで沸かした Then(どうなった) 熱湯が噴水のように換気扇くらいの高さまで吹き出た どうすればよかったか 蓋を閉める。普段、コーヒーがコポコポ吹き出る

    殺人マキネッタ
    yug1224
    yug1224 2022/08/29
  • OGP の生成をAIですれば楽な気がしてきた

    この OGP は "Draw open graph protocol by AI." っていう言葉で作った OGP だ。graph に引っ張られすぎだろ... ブログの OGP このブログの入稿は のようにフォルダに visual.png という名前でフォルダに保存して、 --- path: /draw-ogp-by-ai created: "2022-08-24" title: OGP の生成をAIですれば楽な気がしてきた visual: "./visual.png" tags: ["OGP"] userId: sadnessOjisan isFavorite: false isProtect: false --- の visual でパスを visual.png に指定すれば適用できるようになっている。 なので日頃は ユーモア ある画像を入稿するようにしている。 が、最近はそれがめんど

    OGP の生成をAIですれば楽な気がしてきた
    yug1224
    yug1224 2022/08/24
  • mp3 を fastify から返す

    yug1224
    yug1224 2022/08/24
  • はじめての胃カメラ、感想

    yug1224
    yug1224 2022/08/19
    次は大腸カメラも是非
  • netrw の設定

    で使えるようになる。 詳しくは https://vim-jp.org/vimdoc-ja/pi_netrw.html なぜ netrw を使っているのか 一言で言うと、公式や標準以外のものが嫌いだからです。とはいえ「特に Vim においてはプリセットなものをそのまま使うのは不便なのでは」という指摘はあるだろうし、事実そうです。なので今日はそれを使いやすくするための設定をしていきます。 使いやすい設定とは NERDTree が使いやすかった 自分が一番使いやすいファイラは VSCode のもので、ファイル操作、ペインの表出管理が気に入っています。 VSCode の体験を提供してくれたものがNERDTree でした。 ctrl + t でペイン表示を切り替えたり、ツリーの移動も直感的にしやすく、ファイル操作もできました。 netrw 標準だと何が使いにくいか 一方で素の netrw だとそうい

    netrw の設定
    yug1224
    yug1224 2022/08/19