masuidrive

masuidrive

  • masuidrive

    masuidriveの日常を書いてます。技術もそうじゃない事も。

  • Web Components楽しい！

    Web Components楽しいので色々書いてみる！

  • 「色の消しゴム」アプリの作り方

    iPadには色々なお絵かきアプリがあるけど、私が欲しい「色の消しゴム」を持ったものがない！っていうのでProof of Conceptを書いたら友人の沖ちゃんが興味を持ってくれたので、ガッツリ巻き込んでアプリを作ってもらおうと思っている記録。

  • CardDBっぽいのが欲しい

イオンモール柏にあるINDY KART(インディカート)への行き方

インディカート自体の詳しいことは、公式ページや https://twitter.com/indykart_ で。 来る前に持ち物は何もなくても大丈夫ですが、服装はズボン必須スニーカー推奨です。半袖/半ズボンはOK。 靴はサンダルやヒールがダメで、すこし汚れてもいいスニーカーや運動靴がおすすめです。用意できなければスニーカーやズボンは貸し出しもあります。 軍手もあるといいですが現地でも売ってます。 ヘルメットをかぶるので乱れてもいい髪型がおすすめ。 髪が長い場合、結ぶ際の

masuidrive

    • OpenCALM-7BをLoRAでFine tuningして対話ができるようにする

      ちょっと出遅れたけど、サイバーエージェントが出したGPT-NeoXベースのLLM、OpenCALM-7BをGoogle Colab上でLoRA使ってFine tuningをしてみました。 とりあえず対話を試したい人masuidrive/open-calm-instruct-lora-20230525-r4-alpha16-batch32-epoch1 に1 epoch回したLoRAを置いておきます。 Google Colabで試したい人はV100やA100のハイメモリで動

      masuidrive

      • 最近話題のVector Searchを実現するFaissって何？ #1

        Faissを使ったFAQ検索システムの構築Facebookが開発した効率的な近似最近傍検索ライブラリFaissを使用することで、FAQ検索システムを構築することができます。 まずは、SQLiteデータベースを準備し、FAQの本文とそのIDを保存します。次に、sentence-transformersを使用して各FAQの本文の埋め込みベクトルを計算し、そのベクトルをFaissインデックスに追加します。新しいクエリが入力されたときは、sentence-transformersを

        masuidrive

        • ChatGPTで1日分のSlackを要約してくれるスクリプトを作りました

          Slackって読むの大変ですよね。っていうかもうみんな追いかけるの無理でメンションしか読んでないですよね？ でも、全体感は把握しておきたい。そんな人のために昨日発表されたChatGPT APIを使って、SlackのチャンネルをGPTが読んで短くまとめてくれるスクリプトを作りました。 OpenAIへの登録(要課金)とGitHub Actions(要課金)だけで、朝早くに昨日のSlackのPublic channelの内容をチャンネルごとに要約して投稿してくれます。 かなりの

          masuidrive

        イオンモール柏にあるINDY KART(インディカート)への行き方

        masuidrive

        マガジン

        • masuidrive
          26本
        • Web Components楽しい！
          3本
        • 「色の消しゴム」アプリの作り方
          15本
        • CardDBっぽいのが欲しい
          1本

        記事

          よくある2ペインのレイアウト用コンポーネントを作りつつ、Web Componentsの仕組みを理解する

          Web Componentsを一言で説明すると「HTML/CSSが独立したカスタムタグを作れる仕組み」です。理解するには、まずは素のJavascriptだけでよくある部品を作ってみることが一番だと思います。 多くのサンプルではボタンやアイコンなどの部品を作りますが、今回はflexboxを使ったレイアウト定義のコンポーネントを作ってみます。この部分にはちょっとしたハマりどころがあるのでちょうど良い練習になります。 もう一つハマりやすいのはフォーム部品ですが、これはまた後日書

          masuidrive

          よくある2ペインのレイアウト用コンポーネントを作りつつ、Web Componentsの仕組みを理解する

          masuidrive

          とりあえずWeb Componentsでやりたいこと

          Storybookでいい感じにリファレンスを書ける環境作り (CSF v3かな？ Chromaticでreviewなどをできる設定 今作ってるRails 7のviewでコンポーネントを使う PurgeCSSを使って不要なCSSの削除を行う コンポーネントの配布 Litの使い方の記事を書く 仕事でも使ってみる tips formの処理 flexbox関係は:hostに設定しないとだめ

          masuidrive

          とりあえずWeb Componentsでやりたいこと

          masuidrive

          今なら使えるWebComponents

          Web Componentsは10年ほど前に提唱されたブラウザのコンポーネント技術の総称です。自分でタグを作ってHTMLを拡張していける技術なのですが、ブラウザの対応や仕様の確定などに時間がかかり、なかなか実用に至りませんでした。 私もずっと忘れていたのですが、React/Vueに疲れたなーと考えていたところ、ふと思い出し調べ直してみると、既に安定してProduction readyなのに情報が少なくすごくもったいなかったので、自分で調べつつ色々書き残すことにしてみました。

          masuidrive

          今なら使えるWebComponents

          masuidrive

          Github Codespacesを使ってブラウザだけでESP-IDF開発環境を作る

          IoT関係の開発で一番面倒なのは開発環境を構築することじゃないでしょうか？ 複数人数で開発する場合、コンパイラのバージョンを細かく合わせたり、M1 macの場合はそもそもtoolchainが対応していない場合もあります。 Web開発では最近GitHub Codespacesを使ってVSCodeとDocker環境をブラウザだけで作り、その上で開発できるのですが、IoTの場合はデバイスの書き込みの方法がありません。 ということで、私が主に使っているESP32の開発環境のES

          masuidrive

          Github Codespacesを使ってブラウザだけでESP-IDF開発環境を作る

          masuidrive

          CH340Kは最近のmacOSでは認識しない

          タイトルで全部なんですが、公式のドライバもMojavi以降インストールできないみたいで詰みましたw 安くていい感じだったのになぁ CH340GとかはOSに標準のドライバで認識するのですがプロダクトIDの違うCH340Kは認識しないようです。 Virtual machineにUbuntuを入れればその中では認識するんですけどね。 参考URL - ESP32の書き込み用にCH340Kを使った回路を作ってみました(失敗) | kohacraftのblog - CH340Kで

          masuidrive

          CH340Kは最近のmacOSでは認識しない

          masuidrive

          After EffectsでSRTファイルから一番簡単に字幕をつける方法

          After Effectsのエクスプレッション機能を使って、SRTファイルから字幕を入れます。After Effects 2020で動作確認をしています。 動画に字幕を入れるのはよくあることですが、決まったやり方もないみたいなので一番簡単と思われる文字ツールに対するエクスプレッションを使った方法を解説します。 エクスプレッションを使うメリット - ほぼリアルタイムで反映されるので別のエディタでSRTファイルを書き換えるとそのままプレビューに反映される - プラグインなどを

          masuidrive

          After EffectsでSRTファイルから一番簡単に字幕をつける方法

          masuidrive

          Docker on M1 macでRails/Nuxt開発環境を試す（だいたい動いた

          これでついにM1 MacbookAirを開発機として使えるようになります！多分。 先日、DockerのAppleSilicon対応版がDeveloper Preview Program(要ユーザ登録)で公開されたので早速試してみました。 インストールは特別なことなくD&Dするだけ。まずはターミナルからalpineを起動してみます。 $ docker run -it --rm alpine sh/ # uname -aLinux 1bf5d756f216 4.19.104

          masuidrive

          Docker on M1 macでRails/Nuxt開発環境を試す（だいたい動いた

          masuidrive

          PlatformIOでESP-IDF v4を使う方法

          なんか探しても分かりにくかったのでメモ platform.iniに`platform_packages`を追加 [env]platform = espressif32framework = espidfplatform_packages = framework-espidf @ https://github.com/espressif/esp-idf.git#release/v4.2 @ https://github.com/espressif/esp-idf.git#r

          masuidrive

          PlatformIOでESP-IDF v4を使う方法

          masuidrive

          cdr/code-serverで開発頑張る #1

          本格的にVSCodeのオンライン版である cdr/code-server を使って開発を続けています。気がついたこと、直したいところが出たのでメモ。 接続が切れても分からない回線が不安定なところで使って、接続が切れても気がつかない。そのまま保存を押しても実は保存されてないが気がつかない。そのあと接続が再開してもリロードしないと再接続されない。 これは結構致命的なので、パッチ作るのを検討。 iOSでVPNのオンデマンド接続の方法がわからないProfileの作り方がわからな

          masuidrive

          cdr/code-serverで開発頑張る #1

          masuidrive

          MyDNSでLet's Encryptを使う

          code-serverでコードを書き始めたのですが、terminalでコピーするにはhttpsで接続する必要があるそうで、VPNにしたんだけどhttpsも設定することにしました。 httpsといえばLet's Encrypt。core-serverは外部に公開してないから普通にHTTP経由ではLet's Encryptの設定ができないのでDNSを使う必要がある。そしてドメインは適当なDynamic DNSを使いたい・・・と思って検索したらMyDNS.jpがDNSを使ったLe

          masuidrive

          MyDNSでLet's Encryptを使う

          masuidrive

          code-serverを使ってブラウザ上だけでセキュアで快適に開発してみる

          前に紹介したCoderがPivotしエンタープライズ開発に注力するようで、個人開発者向けVSCodeブラウザ版はオープンソースで提供するようになりました。 VSCodeのブラウザ版はDockerでも提供されていて、Dockerさえインストールされていれば下記のコマンドを起動したあと`http://localhost:8080`をブラウザで開くだけでVSCodeと同じ環境で開発ができるようになります。 docker run -it -p 127.0.0.1:8080:808

          masuidrive

          code-serverを使ってブラウザ上だけでセキュアで快適に開発してみる

          masuidrive

          DJコントローラを自作してみる #1

          自分用に持ち歩きやすいコンパクトなDJコントローラ欲しかったので作ってみることにしました。 DJコントローラはMIDIデバイスとしてスイッチの信号を送ってるだけなので、多分ArduinoとかでUSB-MIDIを話すライブラリがあるだろうと思っていたら、やっぱりありました>MIDIUSB プロトコルは昔調べたことがあるので、それを思い出すためにWikipediaとかサンプルコードを読みながら、EQとかはコントロール・チェンジで送信して、PLAYボタンとかは普通にノートとして

          masuidrive

          DJコントローラを自作してみる #1

          masuidrive