ブックマーク / zenn.dev/razokulover (11)

  • 個人的Rails開発環境構築2024

    新規でRailsプロジェクトを始める時の個人的な環境構築についてまとめる。前提とする条件等は下記。 規模: ~中規模 開発者数: 個人 利用シーン: PoC作成・スタートアップ立ち上げ・並の業務アプリ開発等 基戦略 利用シーン的に「思い立ったらすぐアプリの開発ができる」という感じの運用がしたい。極力セットアップで悩みたくないから必要なミドルウェアなどは全部Dockerでインストールできるようにして立ち上げれば終わり、の環境を作る。その環境の中で色々とコマンドを叩いたり、rails newやrails gなどでRailsアプリを作成していく。 この辺のRailsの初期セットアップの手間を出来るだけ省きたいのでtemplateとなるリポジトリを作成し、そこからcloneしてくるだけでOKにする。 フロントエンドReactなどを使わずをRails標準のerbとHotwireを軸に開発する。開

    個人的Rails開発環境構築2024
  • うるう日にしか発生しないバグ

    昨日うるう日にしか発生しないバグに遭遇した。Javascriptを書く人には有名な話だとは思うので大して面白くはないかもしれないが一応メモ。 詳しくは書けないがバグが発生した関数の仕様としてはざっくりと下記のような感じ。 対象の年月日が基準日の1年前から1年後の間に含まれる場合はtrueを返しそうでない場合はfalseを返す 引数として2020-12-24というフォーマットの文字列が渡される(判定対象の日) 引数として2021-01-01というフォーマットの文字列が渡される(+-1年の基準日) Javascriptで書く (例) 対象の日: 2024/10/10 基準日: 2024/01/28 この時、trueになる範囲は2023/01/28 ~ 2025/01/28。なので2024/10/10はtrue。2023/01/28も2025/01/28もtrueになる。閉区間。 とあるコードの

    うるう日にしか発生しないバグ
  • BlueskyでシンプルなBotを作る

    TwitterからBlueskyに軸足を移して1週間ほど経った。ようやくBlueskyの使い方にも慣れてきたのでここらでBotを作ってみることにした。 BlueskyのBotを作るには、 Blueskyのアカウント Botを動かすサーバー の2つがあれば良い。現状はアクセスキーやトークンなどはなく、アカウントのIDとパスワードを使って投稿したりするシンプルな仕組みになっている。 アカウントの作成に関しては招待コードが必要になる。これに関しては身の回りの誰かに貰うなどしてなんとかしてもらうしかない(ちなみに登録から2週間ほどたたないと招待コードが付与されないので自分もまだ持ってない...)。 以下アカウントを持っている前提で進める。 仕様 まずBotの仕様だがこれは下記の通り。 1時間おきに呟く 投稿時点での東京の気温を投稿する(ソースはtekin.jp 投稿内容はテキスト+リンク+OGP

    BlueskyでシンプルなBotを作る
  • Cloudflare Workers + HonoでChatGPT Pluginを作る

    ChatGPT PluginとはChatGPTとサードパーティのアプリケーションやリソースを接続するための機能。例えば通常ChatGPTに「池袋でランチにおすすめのイタリアンのお店を教えて」と聞くと大体存在しない店を平然と回答してくる。これはChatGPTGoogle検索で調べられるような事実やニュース、即時性のある事柄に対する回答が仕組み上苦手だからだ。 ChatGPT Pluginではこうした点を補うために、先の例で言えばべログPluginを使うとユーザーからの質問を元にべログのAPIを叩きおすすめのお店を取得、そのお店の情報を利用してユーザーへの回答を作る。そうすると実在する店の情報を自然な日語で回答できるようになる。 ChatGPT Pluginは現在ベータ版ではあるが課金してるユーザーはもちろんfreeユーザーでも利用できるようになってきていて、少しコードが読み書きできれ

    Cloudflare Workers + HonoでChatGPT Pluginを作る
  • Remix + Cloudflare Workers + D1 + KV + Queue + R2 + DOで簡単なアプリを作る

    Remix + Cloudflare Pages/WorkersをベースにD1とKVと組み合わせた構成で作るアプリの解説は巷に結構あるが、それらに加えてQueueやR2なども合わせた参照実装みたいなものが見当たらなかったので作った。 このアプリの機能は下記。 Googleアカウントを用いたOAuthログイン セッション管理にKV,ユーザー管理にD1を使う はてブのようなブックマーク機能(基的なCRUD) URLとコメントを入力してD1へデータ登録できる URLの先のページからOGPを取得して登録 QueueのProducerとConsumerを使って非同期にタイトルと画像を取得 取得した画像はR2にアップロードする URLごとにブックマーク数を管理する Durable Object(DO)を使う。 Cron Trigger ついでに追加。アプリ的には不要だがせっかくなので設定だけしておく

    Remix + Cloudflare Workers + D1 + KV + Queue + R2 + DOで簡単なアプリを作る
  • 個人ブログをNext.jsのSSGからHonoのSSGに移行した

    「Honoのv4が2月9日にリリースされます」という記事にてHono v4ではSSGモードがサポートされると発表があった。この機能を試す目的で今までNext.jsのSSGモードで構築していた個人ブログをHonoのSSG機能で書き換えた。 ブログ https://yuheinakasaka.github.io/gialog-diary/ リポジトリ https://github.com/YuheiNakasaka/gialog-diary 元の個人ブログではr7kamuraさんのr7kamura/gialog: Blog template to use GitHub Issues as article editor.というテンプレを使っている。これはGitHub IssuesをCMSとして用いて記事を書き、issueの作成などのイベントをフックにしてGitHub Actionsを起動させて記

    個人ブログをNext.jsのSSGからHonoのSSGに移行した
  • 雑にReactアプリを作りたい時に使ってるもの

    import "./App.css"; import { Link, Route, Switch } from "wouter"; function Nav() { return ( <nav> <Link to="/">Home</Link> <br /> <Link to="/about">About</Link> </nav> ); } function Home() { return ( <div className="App"> <h2>Home</h2> <Nav /> </div> ); } function About() { return ( <div className="App"> <h2>About</h2> <Nav /> </div> ); } function App() { return ( <> <Switch> <Route path="/" compo

    雑にReactアプリを作りたい時に使ってるもの
  • 未経験者がプログラミングを学びたいと思った時に最初に読む記事

    ここ数年プログラミングを学びたい人が増えている。そうした需要に応じて有象無象のプログラミングスクールや不適当な内容の学習サイトも増えている。中には粗悪なスクールやオンラインサロンも沢山ある。しかし未経験者にはどれがいいスクールなのか悪いスクールなのか等の審美眼はない。 この記事では未経験者がそういった情報弱者をい物にする偽物に騙されないように滑らかに学習を進めていくための道筋について書く。 この記事の対象読者は下記。 教養としてプログラミングを学びたい未経験者 とにかくWebサービスやアプリを作りたくてプログラミングを学びたい未経験者 プログラマとして職を得たい未経験者 以下、まずは全ての対象読者向けの下準備について書き、その後それぞれの対象読者向けに道筋を書く。 目次 準備 教養としてプログラミングを学びたい人の場合 とにかくwebサービスやアプリを作りたくてプログラミングを学びたい人

    未経験者がプログラミングを学びたいと思った時に最初に読む記事
  • NestJS + Prisma + Cloud Run + Cloud SQLを試す

    経緯 ここ6,7年くらいはバックエンドに関してはRails + EC2/ECSあたりのAWS環境を中心に過ごしてきたが、昨今はフロントエンドReact/Vue + TypeScriptを書く機会も増えている。なのでこの際NestJS等でバックエンドを書けるようになれば言語のコンテキストスイッチの切り替えが容易になりそうと思った(ちなみにモバイルアプリはFlutterで書くのでDartだが、ではDartでバックエンドを書くかと言われると一人でそんな勇気はないわ...となるのでひとまず置いておく) 最近はinputとoutputを型注釈によって守れたりすることの主に開発体験方面への恩恵が個人的に大きくて、Rails以外で安住の地を見つけたいとは予々思っていた。なので先に挙げたNestJSに全ベットするわけではないにしろ何かしらフレームワークは試していきたい。 AppEngineは大昔に少し触

    NestJS + Prisma + Cloud Run + Cloud SQLを試す
  • EthereumでTwitterっぽいものを作ってみる

    作ったもの dApp を作る練習がてら Twitter っぽいものを Ethereum で作ってみた。ツイートする・グローバルタイムライン・プロフィール・フォロー&アンフォロー・フォロー&フォロワ一覧表示など簡易な機能しかない。 ブロックチェーンにツイートが書き込まれるので削除できない点は注意してほしい。 -> [追記1] EVMのstateは削除できるので保存されたツイート自体は消せる -> [追記2] ツイートの削除はできるが過去のツイートを過去のnodeから結構力技で掘り起こすこともできる(完璧なツイ消しは出来ない)。 デモページは下記。 使い方 当然 Ethereum の mainnet にデプロイできるほどのお金は持ってないので、testnet(ropsten)にデプロイした。rinkby や kavan など他にも testnet はあるが自分がテスト用の ETH を持っている

    EthereumでTwitterっぽいものを作ってみる
  • 最近のモダンなWebサービス開発の構成について調べるメモ

    ここのところ雑にWebサービスをリリースする機会が減って最近はFlutterでネイティブアプリばかり書いてるのでWebの最新に追いつけてない。 最近の流行りのWebサービス開発について自分の必要そうな範囲でちょっと調べてみる。 自分の場合、フロントエンドTypeScript+(Vue or Nuxt)でやって、サーバーサイドはRailsで書いちゃうことがまだ多い。 これでもなんとかなるけど、もうどうせならJSで一気通貫でフロントエンドとサーバーサイドを書ければ楽なのにと思いつつある。 パッと思いつくのはTypeScriptフロントエンドをNext,Nuxtあたりでやって、バックエンドAPIをexpressとかサーバーレスAPIを適当に書くとかだけど、今だともっと良い方法ありそう。 当はDartでサーバーサイド、FlutterでwebまでいければDart統一時代になって願ったり叶ったり

    最近のモダンなWebサービス開発の構成について調べるメモ
  • 1