Cloudflare Workers を活かしきるスタックを考えた(remix+d1 on pages-functions) + 残タスク
Cloudflare Workers を活かしきるスタックを考えた(remix+d1 on pages-functions) + 残タスク このスクラップ で試行錯誤していたまとめ。 最終形はここにアップロードした。 docs の下に、このリポジトリを生成した手順、セットアップ方法、リリース方法を書いてある。 (remix-validated-form や vitest のテストの追加でもうちょっといじるとは思う) なぜ cloudflare-workers + d1 のポテンシャルは最強で、近い未来、開発者|個人開発者の銀の弾丸になると思っているのだが、それを活かす開発スタックが知られていない(要出典)。この記事では GW の間に自分で周辺ライブラリを使い倒しながら選定していった。 2021年 は Fullstack Next.js 元年なので、有望な Next.js 系フレームワークを
Enterキーを押すとtextareaのスクロール位置がずれる問題 ふとZennのスクラップのエディターで、Enterキーを押すと、カーソルのあたっている部分のスクロール位置がガタっとずれる問題が発生することに気づきました。 Enterキーを押したタイミングでカーソルの位置がviewportの先頭もしくは末尾にジャンプするようなイメージです。 もう少し調べてみると、Chromeでは問題が発生するものの、FirefoxやSafariでは問題が再現できませんでした。 とりあえずautosize textareaを疑う スクラップのエディターではtextareaの高さがテキストの長さに応じて変わるreact-textarea-autosizeを使っています。最初はこのパッケージを疑ったのですが、HTMLの<textarea>タグに書き換えても問題は解消しませんでした。 Reactのcursor
Flutterでアプリ開発を始める前に個人的にやっていることをまとめてみる。個々の作業の具体的な手順や方法に関しては分量が膨大になってしまうので触れないが、より詳しく解説してくれている記事やドキュメントへのリンクなんかは載せておこうと思う。複数人で開発する場合は証明書周りなんかはもっと考慮すべきことはあると思うのだけど今回は省く。 環境設定 version 新規アプリならFlutterのversionは2系からでいいと思う。1系で書く理由として一部のパッケージで2系対応してないなどはあるが、主要なパッケージはほぼ全て問題なく対応してるはずなので2系を使えば良い。 null safety null safetyを後から入れる、もしくは移行でnull safety対応するのは結構骨の折れる作業なので最初から有効にしておくべき。上述したようにFlutterの2系を使っていればnull safet
Firebaseを卒業するに至った理由
株式会社パルケの悩めるCTO、みつるです。 この記事は先日ツイートしたものを加筆修正したものとなります。 株式会社パルケでは、最初のプロダクト開発でFirebaseを全面的に採用し、１年以上にわたって運用してきました。 一方でFirebaseの制限・制約がつらい、と思う理由も徐々に積み重なってきました。 結果、Firebaseから卒業するという大きな判断をしました。 今その判断は間違っていなかったと思います。 ここではFirebaseがつらかった理由をまとめておきたいと思います。 第10位：Firebaseでは実現できない要件があった。 パルケのプロダクトでは、エンタープライズ向けにセキュリティ対応を強化したい、という要件がありましたが、以下要件の実現が難しかったです。 IPアドレス制限をできるようにしたかったが、Firestoreへアクセス毎にIPアドレスで制限をかける方法が見つからなか
図解 DB インデックス
DB インデックスの基礎知識を、図をたくさん使って整理します。 この Book は、暗記をおしまいにしてこんな疑問を自力解決できるようになることを目指します。 「どんなインデックス作ればいいんだっけ？」 「なんで作りすぎちゃだめなんだっけ？」 「この場合インデックスって効くっけ？」 「インデックスでどれくらい速くなるの？」 この本は筆者の理解に連動して追記修正される可能性があります。
新技術の最速学習法
この記事では 新しい技術を 「完全に理解した」 状態まで、最短でたどり着く最速学習法を紹介します。 普通の学習方法 一般的な 「ちゃんとした学習方法」 は 参考書を1, 2冊買う サンプルを写経しながら全部こなす 公式ドキュメント読み込んで詳細把握する いざ実践 だと思うのですが、僕の場合②が終わった時には、 時間が掛かり過ぎて、大体忘れていて、もう飽きちゃってるか 終わらなくて②で挫折 するんですね...。 最速の学習方法 新しい技術の「実践」までいつもたどり着かないので、Flutterを始める時は、次の作戦を実行してみたところ、大当たりでした。 一番簡単そうな参考書を1冊買う サンプルは「見るだけ」、分からない所はヨーワカランと流しながら一気に読み終える いざ実践 分からない事はひたすらググる これが、僕史上学習効率最強、でした。 新しい技術は全体像が分からないと厳しいので、②で 「だ
Next.jsの対抗馬となりそうなReactのフレームワークでRemixのv1.0がリリースされました。 個人的にRemixでいちばん魅力を感じているのはCloudflare WorkersでSSRができるという点です（現状ではNext.jsをCloudflare Workers上でSSRするのは難しい）。これがなぜ嬉しいのかと言うと、パフォーマンスを出しつつ、低コストで運用でき、大量のアクセスに対しても低コストでスケールできそうだからです。 そもそもSSRをする必要ある？ ほとんどのWebサービスはSSRなしでSPAとしてビルドし、Cloudflare PagesやGitHub Pagesに静的ファイルをのせて動かせば十分だと思います。 例えば僕が先日作った個人開発のサービスもReact on Cloudflare Pagesの完全なSPAですが、SSRが必要な要素はまったくありません。
Zig で簡単な JSON パーサを書いてみた。
#include <stdio.h> int main(int argc, char* argv[]) { int i; for (i = 1; i <= 100; i++) { if (i % 15 == 0) puts("FizzBuzz"); else if (i % 15 == 0) puts("FizzBuzz"); else if (i % 3 == 0) puts("Fizz"); else if (i % 5 == 0) puts("Buzz"); else printf("%d\n", i); } return 0; } fn main() { let mut x = 1; while x <= 100 { if x % 15 == 0 { println!("FizzBuzz"); } else if x % 3 == 0 { println!("Fizz"); } e
DESCRIPTION Webサイトをアプリストアから配信することができます ステップ別にWebサイトをアプリ化していく方法をみていこう Webサイトをつくることができるなら、アプリも配信できます 本文 DESCRIPTIONで大上段に断言してますが、概ね事実です。アプリ化なのでコンテンツはメディアアプリといった「アプリ」でないとというのはありますが、まず入り口として、HTML/CSSとちょっとしたJavaScriptでつくられたWebサイトをアプリとして実機で動作確認する方法をみていきましょう。 アプリ化してみるWebサイトはこちらです: ミシュランガイドにも掲載されたフレンチレストランのWebサイトをリニューアルしたので、裏側から考え方、実装まで解説します。で経緯や裏側をご紹介しましたが、こちらのWebサイトを Capacitor というライブラリを利用してアプリ化して、iOS、And
Reactにおけるスタイリング手法まとめ
開発初期に「どのスタイリング手法でいくべきか」などとよく悩むと思います。 筆者ならそこで「悩むよりもとりあえず書き始めよう」と言いたいところですが、規模が大きいプロジェクトなどでは途中でスタイリング手法を変えようとすると大きな負担になったりと柔軟な変更ができないことがあります。 だがしかし！！ Google先生で調べようものなら 「CSS-in-JSをやめた理由」 「CSS Modulesをやめた話」 などなど... じゃあ何ならええねん！ そもそもReactにおけるスタイリング手法は多種多様で、時代によって流行が移り変わっていくものでもあり、Googleのトップに来るのは古い情報ばかりです。 そんな悩めるあなたにこの記事では筆者が利用したことのあるスタイリング手法を、CSS-in-JSやCSS Modulesに限らず、筆者の使用感もふまえて紹介していきます。 古い情報だけでなく、zero
最近のC言語と、次期C標準(C23)
C言語といえば古い言語なイメージですが、その重要性はまだまだ落ちていません（多分）。重要な言語だからこそ、今もひっそりと進化を続けています。この記事では、そんなC言語の最近の動向を紹介します。 まずはC言語の前世紀の標準であるC99、現行の標準であるC11/C17を振り返り、その後に未来の標準であるC23に触れます。 C99 C99では色々追加されました。ここでは一部のみの紹介とします。 _Bool _Complex C++の std::complex とメモリ上での互換性がある（C++11以降）。 可変長配列（VLA） 可変長引数マクロ 浮動小数点数の強化 十六進表記 筆者による関連記事：浮動小数点数の16進表記 fma 筆者による関連記事：FMA (fused multiply-add) の話 #pragma STDC FENV_ACCESS, #pragma STDC CX_LIMI
概要 本記事は、メタ社(旧 FaceBook) が開発した OSS であるメモリリーク検知ツールである [memlab] をさっそく試してみた記録になります。 公式ドキュメント以上の付加価値はあまりありませんが、ざっくりと雰囲気を掴んでもらって使用を検討して頂ければ幸いです。 memlabについて memlab は、 Puppeteer API を用いたシナリオを作成することで、そのシナリオ実行によって発生するメモリリークの検出及びヒープ領域の分析を補助してくれるツールです。 本記事は実際に動かすところに重きを置くので、ツールの背景などの詳細は以下記事を参照ください。 ざっくり言うと、 memlab では以下のことが行なえます。 Puppeteer ベースでの宣言的なシナリオの作成 ヒープ領域とメモリリークの可視化 シナリオ内でのヒープのスナップショットの自動取得 スナップショットの解析と
企業が雇用契約ではなく、あえて業務委託契約にしたい理由
どうも。株式会社プラハCEO兼エンジニアの松原です。 弊社はメンバー全員が業務委託なのですが、転職のお誘いをする際に「今は正社員に絞って探していて...」と言われることが結構多いので、業務委託契約をあえて選択している企業側の観点をどこかにまとめておいたら今後のエンジニアのキャリア選択に役立ててもらえるのではないか？ と考えつつ、もしかしたら読んでくれた人が興味を持って応募してくれるかも、という下心も込めてキーボードを叩いています。 ただ大前提として、人や会社によって最適な契約形態はそれぞれ異なるので、今回はあくまでプラハという会社にとってなぜ業務委託契約が適しているのか、という観点に絞って話していくので「そういう考え方の会社もあるんだ」ぐらいに留めていただけたら幸いです。決して業務委託契約が全ての状況で雇用契約を回るバラ色の契約形態だと言いたいわけではないよ！ 社風や理念との合致度 プラハ
UIパーツにメイリオを指定しないほうがいい理由
はじめに 前提として本記事は特定のフォントを貶める意図はなく役割として使い分けることを推奨する記事です。 フォントにあるのは役割であり、優劣ではないということを念頭にご一読いただけると幸いです。 注意事項 メイリオという特殊なフォント まず具体的な問題点を挙げる前にメイリオというフォントについて軽く紹介させていただきます。 といってもWeb開発者にとっては馴染み深いフォントでありご存じの方が大半だと思います。 Windows Vistaより搭載されたこのフォントは未だに根強い人気があります。 記事にもあるように、このフォントは和文と英文の調和を重視して作られ英文のベースラインという考え方を取り込んでいます。 そこでメイリオでは和文を縦方向に95％に圧縮した形にして下部にスペースを開けた。こうすることで和文・欧文が混じったときに、それぞれのベースラインを合わせつつ、文字が上下に踊って見えると
Next.js v13 への移行でやったことまとめ 準備 基礎となる記事に目を通した -> https://zenn.dev/link/comments/eefa4975aaedaf マイグレーションガイドを見て一つずつ対応しようかなと思ったけど、記事が長いのでnext devで動かして出てきたエラーを潰していく方法にした。とりあえずビルドできるようになったら、見落としやより良いやり方があるか確認するために読む。 ページコンポーネントに対して pages にあるファイルを app ディレクトリに移動させる 規約 通りに page と layout にコンポーネントを分割する getServerSideProps の処理をasync function getData() に変更する コンポーネントを async 関数にする props ではなくコンポーネントの中でgetData()の返り値を
rsyncによる大容量ファイルの転送やDBのバックアップ・リストアなど、たびたび非常に時間がかかるタスクをCLIで実行するシーンがあります。 通常そういった場合は末尾に&を付加(セッションが切れても中断されないようにnohupとセットで使うことも多い)してバックグラウンドで動作させるのが一般的かと思います。 ただ、そのまま使うとログや実行時間、リターンコードなどの採取が面倒であり、いささか一覧性に欠けます。 そんな中、そのようなユースケースに適したPueueという管理ツールが登場しました。 Pueueとは Pueueとは、長時間のCLIタスクに特化したOSSの管理ツールです。 最近はstarshipやnushellといったRust製のツールが勢いを増していますが、例によってPueueもRustによって記述されています。 Pueueの特徴としては、次の通りです。 リッチなUI: バックグラウ
読みやすく、再利用しやすいSQL分析クエリを書くコツ
こんにちは、Wantedlyでデータサイエンティストをしている樋口です! 自分は過去、分析のためにSQLを書いているとき、以下のようなミスをしていました。 メール開封率を集計したら何故か100%を超えてしまった。でもどこが原因かがわからない メール開封率を集計したのち、クリック率も追加で依頼を受けたが、再利用できるクエリになっておらず、一から書き直した クエリのレビューを依頼したら、複雑すぎると言われてしまった こういった経験がある方は自分以外にもいるのではないでしょうか...! SQLは非常に自由度が高く便利である反面、書き方が個人に委ねられ、複雑・難解になりやすいと感じています。 そこで本記事では、自分が実務で学んだ、読みやすく、再利用しやすいSQLクエリの書くコツを紹介したいと思います。個人の経験によるものなので、より良い書き方・考え方もあるかもしれないです。ご了承ください🙏 読み
VTeacher 所属の Satomi です。 ※各項目をできるだけ3行以内にまとめています。 （出来る限り短く説明するReactJS入門 に合わせて書いています） 昨年（2021年）くらいから Tailwind CSS の話題が増え出し、最近はReactと一緒に使われる場面が増えてきたと思います（私も昨年から使い始めました）。 Vercel Next.js as the React framework / NextAuth.js for authentication Vercel for deployment PlanetScale as the database (MySQL) Prisma as the ORM for database access Tailwind for CSS styling 👈 本投稿は、React + Tailwind CSS の基礎知識をさらっと確認で
sumirenです。 2023年5月5日、ついにNext.js App Routerがstableになりましたね！ おめでとうございます！！ありがとうございます！！！ 今から本番で使うのが楽しみで待ちきれません。 13.4のリリースではstableの宣言とともに、目玉機能としてServer Actionsが来ています。Data Fetch（というか、もはやData Handling的なもの）の機能の一部として、とても興味深いです。 さて、Server Actions自体の解説は他の方に任せるとして、リリースノートには以下のような一文があります。 Server Actions in Next.js have been designed for deep integration with the rest of the data lifecycle, including the Next.js
他の方の記事ですが、読んでいておもしろかったです。記事に出ている本はClean ArchitectureとTDD、LeanとDevOpsの科学くらいしか読んだことなかったです。 また自分も書くことで、他の方も記事を書くようになり、ついでに他の方の記事を読んでみるなどしたいなと思ったので書いてみます。 私はソフトウェアエンジニアとしてのキャリアはまだ7年くらい[1]なので短い方ですが、約7年間の中で読んで印象に残ったものを紹介します。 計算機プログラムの構造と解釈 Scala関数型デザイン&プログラミング Effective Java Programming Rust 実践ドメイン駆動設計 なお、この記事ならびに本のリストは誰かの役に立つことは想定しておらず、単に自分が読んで影響を受けているなあと感じる本をまとめています。つまり自己満足です。 加えてこの手の記事を書く際には、一応筆者のプロフ
ChatGPTのプロンプトをLispで書く
ChatGPTのプロンプトをLispで書けることに気づきました。プロンプトによって処理系としてふるまってもらうという話は聞いたことがありましたが、Lispの場合はそのようなプロンプトがなくても解釈されました。 モデルはGPT-4です。言語としてはClojureをベースにした擬似コードを書いています。 ※いくつか例を追加しました。思った以上にプログラミング的なことができるみたいです。 単純な生成と変換の例 子供っぽくする 静かなヤンデレっぽくする (しっぽりやんでれ？) 対偶を返す 小説を作ってそれを要約する 鶏の唐揚げのレシピのJSONを生成する Lispについて執事っぽく説明する クラムチャウダーのレシピを妹として箇条書きにする お兄ちゃんとツンデレの妹の誕生日ケーキについての会話を生成する Clojureの関数を使う例 3つの文を元気にする 犬の名前を5個生成してひらがなにする キリン
2021 年リリース予定の Go 1.17 に、多くの皆さんが待ち望んでいた Generics が導入される予定です。Go が Generics を採用したプロセス、C++ や Java の Generics とどの様に違うのか、また Go の Generics はどの様に使えるのかをご紹介します。
TL; DR Google Cloud 上で Rails をできるだけインフラ運用しなくて済むように構築するとしたら、こういう構成にするのはどうだろうか？ メインの Web アプリは Cloud Run メインのデータベースには Cloud Spanner 非同期ワーカーには GKE Autopilot 非同期メッセージングキューには Cloud Pub/Sub DB マイグレーションには GKE Autopilot rails console には GKE Autopilot はじめに 先日、Cloud Spanner の ActiveRecord アダプターのバージョン 1.0 がリリースされました。 Scale your Ruby applications with Active Record support for Cloud Spanner | Google Cloud Blog
こんにちは、クレスウェア株式会社の奥野賢太郎 (@okunokentaro) です。本記事では、GPT-4を使った開発体験について語りたいと思います。 2023年3月14日、GPT-4が発表されました。GPT-4とは、OpenAI社が開発した最新のAI技術で、自然言語処理の能力が従来のGPT-3.5と比較して、さらに向上しています。これにより、文章生成やコーディングの補助といった様々な分野での応用が期待されており、開発者にとっても非常に興味深いツールとなっています。現在は、GPT-4を利用するためにはChatGPT Plusという課金コンテンツに月額20ドルを支払う必要があります。驚くことに、この記事もChatGPTに大半を書いてもらいました。それでは、GPT-4を活用したコーディング体験について紹介します。 AIとのペアプロに近いコーディング体験 筆者はGPT-4公開初日である日本時間の
タスクばらし入門
担当タスクを管理しやすい小さな単位に分割していく「タスクばらし」。タスクばらしはセルフマネジメントの必須ツールです。そこで、タスクばらしの目的、効果、種類ごとの分割方法、見直し方法についてまとめました。 なお、チーム全体で共有しておこなうタスク管理についてはこの本の対象外とします。
Zennのトレンド記事をまとめてAIがラジオをつくります。毎朝7時に更新。 お便りも募集中。送っていただいたお便りはAIパーソナリティが読み上げます。
感想です。 何をしたか 現状でBlitz.jsで本番サービスを運用できるかの調査。 Railsで運用している本番サービスの一部機能を、3日間ほどかけて移行を試してみた。 結論 (Railsの主戦場でもある)新規事業開発の文脈でのクイックな立ち上げを想定するなら、本番運用するにはまだ厳しい。 特に、RailsユーザーとしてはActiveRecordがないのが厳しい。 開発効率そのものはRailsと比べて多少落としても、Railsよりもスケーラブルで型安全に開発したいなら、割と良い選択肢に思う。 もろもろ可能性は感じるので、引き続き応援していきたい。 良かった点（＝Blitz.jsに興味を持っている理由） 型安全な開発 サーバーもフロントも全てが型に守られた開発、そしてIDEの恩恵を受けられるのは、いうまでもなく心地がいい。 型は補助輪のようなものなので、ユーザースキルが高ければ必須ではないく
なんとなく自分の中で言語化しておきたかったので、整理も兼ねて記載しておきます🙆🏻♂️ 普段仕事で様々なAngular、またはReactのコンポーネントを作ったりメンバーから出るPRを読む中で、コンポーネントのスタイルはどういうふうに当てるのが破綻しにくいんだろうと考えていました🤔 Angularは良くも悪くも一つのComponentが結構おっきくなりがちだったのでそこまで意識しなかったですが、Reactは何なら分割しないと気持ち悪いとすら思えるくらいにコンポーネントを分割しやすいです。 コンポーネントを分割することは各ファイルごとに把握すべき事柄が減るので基本的にはいいことだと思っていますが、スタイリングについては意識しないと破綻してしまうなーと思っています。 （もちろん、スタイリングに限らず意識しないと破滅するんだけど、今回はスタイルについての話です） スタイルの破綻っていうのは
入門Cloudflare Workers
はじめに この記事はCloudflare Workersの入門記事です。 名前は聞いたことがあるけれどCloudflare Workersが何者か知らない方 「Cloudflare Workersはサーバーレス・エッジコンピューティングサービスだよ」と説明されて日本語でOKと感じた方 AWSのLambdaやGCPのCloud Runと似たコンセプトのサービスだろうと認識されている方 上記に当てはまる方のお役に立てるはずです。 開発環境の構築 まずは開発環境を構築しましょう。といっても、最新のnode.jsをインストールするだけです。 インストールできたらバージョンを確認しておきましょう。 補足 v16.13.0より新しいバージョンのnodeが必要になります。記事を読み進めて不具合が発生した場合はnodeのバージョンを確認してください。 Windowsの動作検証はしていません。ここから先の手
Native ESM時代とはなにか
最近の日本のフロントエンド界隈では「Native ESM時代」という言葉が聞こえてきます。Native ESM時代におけるビルドツールがどうなるかといったことが主な話題です。 個人的には面白い概念なので流行ってほしいと思い、Native ESM時代とは何かを解説する基礎的な資料を用意しました。 そもそもNative ESMとは Native ESMとは、ES Modulesのことです。つまり、ECMAScript仕様の一部として定義されたモジュールシステムを指します。現在、モダンな部類のフロントエンド開発において広く用いられている、import宣言でインポートしexport宣言でエクスポートするのがES Modulesです。 特に、ES Modulesはブラウザによって直接理解されるモジュールシステムです。Nativeという単語はこのことを強調しています。 Native ESM時代とは N
はじめに Gopher道場は、tenntennがメルペイ在職時に始まったGoを学ぶ人のための学習の場です。tenntennがメルペイを退職後、著作権周りの整理などが行われ、Go Conferenceなどを運営する一般社団法人Gophers Japanに運営が移管されました。メルペイのみなさまありがとうございました。 動画コンテンツを完全に公開しました 移管にあたり、Gopher道場のSlackに入った方にだけ公開していた動画コンテンツを一般公開することにしました。以下の再生リストからご覧いただけます。 なお、資料はこちらの古いスライドではなく、プログラミング言語Go完全入門をご覧ください。 古い資料はアップデートされませんが、プログラミング言語Go完全入門は今後もアップデートをしていきます。 動画は10時間以上あり、以下の内容を扱っています。 Goに触れる 基本構文 型と関数 パッケージ
最近Next.jsのISR（Incremental Static Regeneration）を耳にする機会が増えてきました。Zennでも2021/3/17時点で記事や本などの一部のページでISRを採用しています。 ISRとは何か ISRを使うことで、動的なコンテンツを含むページも静的ページとしてCDNにキャッシュすることが可能になります。Next.jsのISRはドキュメントに書かれているようにstale-while-revalidateという考え方でキャッシュが行われます。 具体的には、リクエスト時にページのキャッシュを作成し、次のアクセスではキャッシュされた古いデータを返します。その裏で次のアクセスに向けてキャッシュが再生成されるというイメージです。 これによりユーザー投稿コンテンツであってもCDNにキャッシュしやすくなるというわけです。 Next.jsでのISRの実装 デプロイ先がVe
はじめに 本記事は、JAWS DAYS 2021内で実施したセキュリティグループのハンズオン資料をZenn記事化したものとなります。 オリジナルのハンズオン資料は以下になります。 対象者 AWSに入門したばかりの初心者 セキュリティグループを知らない人 セキュリティグループを知ってはいるが、使ったことが無い人 必要なもの AdministratorAccess権限を持つ、マネジメントコンソールにログイン可能なIAMユーザー 注意事項 本ハンズオンでは以下のような有料のリソースを一部作成します。 NATゲートウェイ ＊ 1 ALB * 1 t2.microのEC2インスタンス * 2 ハンズオンを終了させたら、作成したリソースを忘れずに削除するようにしてください(削除方法は最後に記載しています)。 ハンズオンは20分〜40分程度で完了すると思うので、発生する料金は0.1USD以内で収まるかと
はじめに この記事は #EveOneZenn (Everyday One Zenn) vol.14 です。 Next.js などを手掛ける Vercel Inc.（旧 Zeit ）が運営しているサービス、Vercel（旧 Zeit Now）の料金形態とその内容についてまとめます。 なお、掲載内容は 2020/12/08 時点のものです。 （過去に別所で公開していた記事の加筆版です） Note: 2020/12/08 19:51 - Hobby プランは個人的かつ非営利目的な目的でのみ利用できる旨を追記 Note: 2021/02/06 - 禁止されている用途について追記 Note: 2021/02/11 - Hobby プランにおける広告を掲載した、個人ブログでの利用について追記 Note: 2022/02/26 - Hobby プランにおける広告掲載の利用不可について追記 前回： Ver
Rails7がもつフロントエンドへの「答え」
Rails7のアルファ版がリリースされました。 最近、Railsニューリリースの記事をみてもテンションがあがらなかったのですが（個人開発ではもっぱらNext.jsとかFlutterのお世話になってました）、下記のDHHによるデモが久々に 「Railsっていいかも」 って思える内容だったので、背景も含めて解説します。 Railsの存在意義 みなさんは、どうやってRails使い始めましたか？ 自分はRails3.1あたりで独学でウェブアプリ開発をはじめました。そのときに「簡単に始められて」「ビジネスロジックが増えても生産性が落ちない」 というあたりで、他に浮気する理由がなかった、というのが私の理由です。 それから数年が経ちますが、最近のRailsのアップデートは Basecamp(Railsの基となった製品)が必要としている機能がポートされているだけ という印象でした。 アプリケーションの複雑
はじめに 先日のIgniteでまたもやMicrosoftのセキュリティ製品の名称が代わりました。今年に入って、2回！！ ただ、今回の名称変更はAzureと言う名前をMicrosoftと変える事で 「Azureに限定した製品ではなくハイブリッドクラウド/マルチクラウド対応」 という点を強く押し出した意図も想像できます。最近のMSのセキュリティ製品は例えばEDRもMacやLinux, Android/iOSに対応していますし、マルチクラウドをサポートしているものも多いので、自分の整理を兼ねてまとめてみました。全体的にここ最近名称変更が入ってるので旧名称も入れています。 Microsoft Defender + αの一覧 Windowsの固有の機能から、独立したエンドポイントセキュリティ製品、サーバサイドの製品までMicrosoft Defender の名前が使われてるので知らないとちょっとやや
外部サービス提供のAPIを叩く時に気をつけていること
はじめに 外部サービスが提供しているWebAPIを利用して、自社サービスのシステム機能を作成する事も少なくないと思います。 サーバーサイドで外部APIを叩く経験が何回かあったので、 開発後に気づいたことなどを踏まえて設計・実装・運用上で気をつけていることを書いていきます。 自社で利用しているサービスのAPIを叩く話よりはエンドユーザの(OAuth2やOpenID Connectを利用)リソースに対して操作するケースの話を多めにします。 設計面 ドキュメントを読み込む 基本的な事だと思いますが、利用サービスが提供しているAPIのリファレンスを読み込むことは重要です。 各外部サービス毎に異なる制限事項が細かい所に記載されていたりするので、ドキュメントから探す癖をつけるのがお勧めです。 RateLimitが設定されているAPIは存在するか エンドユーザの利用プランに応じて挙動や制限が行われるAP
動機と目的 普段、Next.jsでアプリケーションを開発しています。当初は Next.js にも TypeScript にも慣れていなかったため、ページのパスを定数で定義し、Link コンポーネントで呼び出していました。 // constants/path.ts export const TOP_PATH = '/' export const USERS_PATH = '/users' // ...
はじめに 先日 Twitter の vim-jp コミュニティで、Vim で折り返し行を移動する方法についての質問がありました。 Vim に詳しくない方の為に説明すると、Vim は行指向のテキストエディタです。j/k で移動するのは行単位の為、折り返されている行であっても次の行へと移動します。 視覚的に移動したい しかし折り返されている行を視覚的な単位で移動したい事もあります。w や 80l の様に移動する方法もありますが、目的の場所に確実に移動できる訳ではありません。 その様な移動の方法として Vim には gj と gk があります。 gj or *gj* *g<Down>* g<Down> [count] 表示行下に移動。|exclusive|。行が折り返されて いる場合とオペレータコマンドとともに使われた場合は 'j' と違う動作になります(行単位ではありませんから)。 gk or
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【Chrome】textareaの改行時にカーソル位置がガタっとずれる問題の対処法
Flutterで本格的にアプリを書き始める前にやること
Cloudflare WorkersでSSRができると何が嬉しいか
あなたのWebサイトをたった5分でiOS/Androidアプリにする方法
memlab を使って Web サイトのメモリリークを検出しよう
個人ブログの Next.js v13 移行でやったことまとめ
時間がかかる複数のCLIタスクをRust製ツールのPueueで管理する
出来る限り短く説明する React + Tailwind CSS 入門（忙しい人向け）
Next.js Cacheのアツさをシェアしたい(App Router)
ソフトウェアエンジニアをしていて影響を受けた5冊（+α）
Go 言語にやってくる Generics は我々に何をもたらすのか
できるだけインフラ運用したくない Ruby on Rails on Google Cloud
GPT-4との新たな開発体験: AIとペアプロを極める
zenncast - 技術トレンドをAIがラジオに変換
Blitz.jsをRuby on Railsエンジニアが触ってみた感想
ReactやAngular、VueなどでComponentのスタイリング時に抑えておきたいこと
Gopher道場の動画コンテンツを完全に公開しました
Next.jsのISRで動的コンテンツをキャッシュするときの戦略
AWS セキュリティグループ ハンズオン
Vercel の料金形態と内容についてまとめた - 2020冬
Microsoft Defenderを眺めてると「もう全部あいつ一人でいいんじゃないかな」という気分になる
Next.jsのルーティングにTypeScriptで型をつけたい
React における XSS｜React と Vue に関する XSS アンチパターン
Vim で折り返し行を簡単に移動できるサブモード・テクニック