Rustで作るテトリス風ゲーム入門本書では落ち物パズルゲームとして有名なテトリス風ゲームの開発を通してRust言語を学ぶことを目的としています。 テトリスを知らない方でも問題なく読み進めることができます。 先ずは理解しやすいコードでシンプルな落ちものパズルゲームを実装し、後にリファクタリングや機能追加、自動化をしていく流れで構成されています。 テトリスにも様々な種類がありますが本書ではCUIでワールドルールを参考にして完成を目指します。
手が痺れるエンジニアを支える技術
こちらに触発されて「そういや俺も手が痺れて色々やってたしな、共有したろ！」と思い筆を取りました。 過去形っぽく書いていますが今でも油断して悪い姿勢で作業し続けると痺れが再現します。 ひどい時は無理せず休みましょう。 手の痺れの原因 手の痺れと一口に言っても原因は実に様々ですが、痺れている部位でどの神経が痛めつけられているかわかるので、それである程度特定することができます。 私の場合は主に手の外側、小指と薬指が痺れる範囲でした。 この範囲の場合、圧迫されているのは尺骨神経という神経のため、考えられる疾患としては肘部管症候群、胸郭出口症候群、頚椎ヘルニアのあたりでした。 引用: 尺骨神経とは？解剖・支配筋・感覚枝 https://www.doctor-1.com/archives/2110 色々MRIやらCT取っても確定診断は出なかったのですが、後述する分離型キーボードを導入してかなり楽になっ
腰痛エンジニアを支える技術
ぎっくり腰（椎間板ヘルニア）からの坐骨神経痛により、ほぼベッドから動けない状況になってしまったので、そのような中でも何とかコードを書くための技術をまとめました。 💻 道具編 最初にベッドの上で快適に PC を使えるようにするための道具を紹介します。 ごろ寝デスク 2 知る人ぞ知る腰痛エンジニアの必須アイテム。 これを使えば、腰を極力刺激せずベッドの上から PC を操作できるようになります。 しかし、一見完璧にみえるこの製品にも問題が。。 使うとわかるのですが、手を上げながらのタイピングは地味にきついです。モデルの方のようなフォームで使うと、腰の代わりに肩・手首・肘を壊すのも時間の問題です 🥲 そこで次のアイテムが必要になります。 ワイヤレスキーボード ごろ寝デスクを使いながら肩・手首・肘を守るためには、ワイヤレスキーボードが必須です。ワイヤレスキーボードがあれば、手をおろした状態でタイ
Linuxコンテナの「次」としてのWebAssembly、の解説
はじめに WASMをブラウザの外で動かすトレンドに関して「Linuxコンテナの「次」としてのWebAssemblyの解説」というタイトルで動画を投稿したのですが、動画では話しきれなかった内容をこちらの記事で補完したいと思います。 2022年もWebAssembly(WASM)の話題が多く発表されましたが、そのひとつにDocker for DesktopのWASM対応があります。FastlyやCloudflareもエッジ環境でWASMを動かすソリューションを持っていますし、MSのAKS(Azure Kubernetes Service)でもWASMにpreview対応しています。WASM Buildersでも2023年のWASMの予想としてWASMのアプリケーションランタイム利用に関して言及されました。 WASMといえば元々ブラウザ上で高速にC++のコードなどを実行するところから始まっている
正規表現でガチャを回せる投稿サイトを作った話
（映像もつくりました） 正規表現ガチャ（英語名：Regech）という、正規表現から生成されるランダムな文字列でガチャを引ける投稿サイトをNext.jsで個人開発した話です。 筆者について 今までPHPやjQueryで開発をしてきた19歳です。 制作期間は20日ほどです。 もしよければ、読んで・遊んでいってもらえたら嬉しいです！ つくったもの 正規表現にマッチするランダムな文字列を生成するアプリです。 例：(にゃん?)+→にゃにゃんにゃんにゃ おもしろいガチャができたら投稿することでみんなで遊べるようになります。 ぜひ、おもしろいガチャを作って投稿してください！ 正規表現の学習にもおすすめです。 英語対応もしてみたので英語環境からアクセスするか、/en/にアクセスすると英語でも見れます。 私のおすすめガチャ 私のおすすめです。他にもおもしろいガチャが投稿されているので遊んでみてください！ リ
（基礎編）jQuery使いのエンジニアがReactとNext.jsでWebサイト制作するために最低限押さえておきたいコード
なぜ書いたか 筆者もWebサイト制作をそこそこ長くやってきておりいまは業務でVueを書いたりちょっとReactを書いたりSvelteを書いたりしていますが、2年前くらいまではReactやES6の構文すら書いたことがありませんでした。 WordPressでのサイト制作が多く、機能が少ないサイト制作会社ではjQueryで充分なことも多く、恥ずかしながら業務時間外での学習や外部の情報を追うこともしていなかったため、開発系の技術スタックに慣れるのにかなり時間がかかりました。 まずはよく使うコードを見て解説しながら答えの一つを示し、よく出てくるコードをざっくり理解して書けるようにすることで、実務でReactを取り入れる取っ掛かりになればいいなぁという思いでこの記事を書いています。 続編は多分今月中に書きます。 こちらは基礎編です。 対象者 普段jQueryでWebサイトを制作している 生のJSはあん
console.log()だけのデバッグはやめよう
はじめに フロントエンドのWeb開発においてconsole.log()というのは非常によくお世話になります． しかしconsoleオブジェクトにはには他にもたくさんのインスタンスメソッドがあり，それらを使わずに開発を行うのは少しもったいないです． この記事では様々な機能を紹介していき明日から開発で使用していただければ嬉しいです． assert console.assert()は第一引数に論理式をとり，第二引数以降には任意のオブジェクトを取ります． 第一引数がfalseとなった場合，第二引数をコンソールに出力します． サンプル // assert const wishToSuccess = () => { return Math.random() < 0.5 } console.assert(wishToSuccess(), "失敗しました") 出力 log 一般的にログを出力するconso
oauth2とは何か？認証と認可の違い。
あぁ、しくじった。毎日書こうとしたら休みの日である事を完全に忘れてゲームばかりした結果 0時を回って書いてしまっている。 しかも今回の内容が多分長くなりそうだから既に明日やる口実を作って明日作成しようとしている。 あぁ、憂鬱だ。 そんな始まり方のoauth 最近でこそoauth認証って普及されてますけど、 最初見た時、？？？ってなりませんでしたか？ 僕は謎過ぎて良くわからなかったから、こんなのやらないと思ってました。 が、、、今になってみるとあまりにも便利が故に もはや、Googleサインインとかappleサインインが無いと嫌ですもんね。 おいおいおい、入れておけや。と。。。 それだけ楽にしてくれた認証機能ですが、 実は、認証機能以外にも認可という部分もあるので 今日はその辺を自分の備忘録的に書いていこうと思っています。 参考にしたもの まず先に参考にした動画を貼ります。 ざっくりと簡単に
TypeScriptでGPT-3.5を使ってChatGPTクローンを作る1 - GPTで検索エージェント
OpenAI が提供している ChatGPT は非常に面白いですね。今年以後、GPTやChatGPT周りがさらに流行ると思います。 この記事は、TypeScriptでChatGPTクローンを作る第一弾です。長くなりすぎるため、この記事では、GPTを使った検索エージェントを実行するまでを取り上げます。 検索エージェントは「ぼっち・ざ・ろっくの作者は？」と尋ねたら検索エンジンとGPTを使って「はまじあき」という結果を生成できる技術です。 またこの記事や、続く記事でLangChainのプロンプトをあれこれ読み解いていこうと考えています。 筆者は機械学習の初心者であるため、間違ったことが書かれている可能性があります。間違いがあった場合は、ぜひご指摘いただけると幸いです。 なお、この記事では添削にChatGPTおよびGPT-3.5を使っています[1]。 どうやってTypeScriptでChatGPT
私が愛するフロントエンドのツールたち2023
自分がチームでフロントエンドの開発をするときの技術選定について書きます。 ログインしてユーザーごとに個別の情報を扱うことがメインのサービスを前提に書きます。 考え方 メンテナンス性の優れたものを選ぶ 制限が少ないものを選ぶ 余計なことに気を使わない 一気にいろんなことに挑戦しすぎない フレームワーク 正直に書くと最近は問答無用でNext.jsを選択しています。 慎重な性格なので、自分が責任を持って開発、運用するプロダクトであれば自分の経験値が高く、多くの課題をクリアできるNext.jsを選びます。 一部インフラの制約があるものの、ページごとにSSGやSSR、On-demand ISRなどができること、Reactの大きなエコシステムの恩恵を受けられることは非常に大きいです。 採用面でも現状Reactを扱える人は他のフレームワークを扱える人より多く感じます。 次点でCloudflare Wor
コードレビューの生産性を上げるためのTips | Offers Tech Blog
はじめに こんにちは。 プロダクト開発人材の副業転職プラットフォーム Offers を運営する株式会社 overflow のエンジニアの藤井です。 エンジニアであれば誰しも日頃からコードレビューをしたり、されたりしていることと思います。 健全な開発組織を育む意味でもレビューの文化を根付かせることはとても大切ですが、小規模な組織の場合「レビューアが足りない」という問題が往々にして起こり得ます。 もちろん、特定のエンジニアにコードレビューが集中してしまうのを防ぐために、チーム全体で負荷分散を図るのが本質的かつ王道的なアプローチではあります。 しかしときには、とにかく個人の力で乗り越える、という状況も避けられないでしょう。 そこで今回はコードレビューの生産性を上げるための Tips をいくつかご紹介します。 自分でも開発をしなければならないが、その片手間で一日に何本ものプルリクエストを確認しなけ
企業に勝てる、個人開発流🔥カスタマーサポート 前編
こんにちは。 個人開発で食べている、あたかです。 企業よりマンパワーが圧倒的に弱い個人開発だと、色々とミニマルに進めざるを得ないかもしれませんが、特に手を抜きがちなのが、CS(カスタマーサポート)じゃないでしょうか？ DL数や、ストアランキング、SNSでのバズり具合が注目されがちですが、個人開発で食べていくには、そんなことより、 「どれだけユーザーが残ってくれるか」 の方がずっと重要です。 そんな重要な要素を支える大きな力がCS！ こんなレビューも有るように、デキルCSは収益にも繋がっていきます。 という訳で、僕が実践している、企業を超えるカスタマーサポート術 を共有します。 長くなりそうなので、前編、後編に分けてお送りします。 共感する所がありましたら、是非、今日から実践してみてください。 後編はコチラ 1. お問い合わせ機能を入れる まず入れないとね。 あと、手を抜いて、バグ報告という
React で作るゆっくり解説 feat. Remotion
export const FirstVideoConfig: VideoConfig = { sections: [ { title: 'イントロダクション', bgmSrc: '/audio/bgm/honobono-wartz.wav', backgroundVideo: '/video/cyber-bg.mp4', afterMovie: '/video/yukkuri-opening.mp4', talks: [ { text: 'ねえねえ魔理沙', speaker: 'reimu', id: '59f8c2cd81334be5ab5cdc7899fad286', audioDurationFrames: 25, }, { text: 'なんだ霊夢', speaker: 'marisa', id: '0ba332a465c3404a870de15cad021407', audioD
言語のスレッド実装の雑な話(Green threadからGoのgoroutineまで)
Twitterで "green thread" という単語をたまたま見かけたので、知っていることをつぶやいたよ。 Green thread 言語のスレッドとOSのスレッドの関係 N:1 mapping 言語のスレッドの全てがひとつのOSのスレッドの上で実行されるもの。その代表が上記のJavaのgreen thread。 OSのシステムコールを呼ぶときには必ずnonblockingモードを使い、EAGAIN または EWOULDBLOCKが返ってきたときには他のスレッドの実行権に譲るようにする必要がある。うっかりシステムコールでブロックされてしまうと、全部のスレッドが巻き添えになって動けなくなる。 スレッドの生成やコンテキストの切り替えは軽い。しかし、マルチコアを生かすことができないため、シングルコアの環境でのみ使用される。 1:1 mapping OSのスレッドと言語のスレッドが1対1対応
私が妄想している最強のデータ基盤2023
新年になったので今年のやりたいことをまとめようと思いたち筆をとっています。単にやりたいこと書いてもただのポエムになってしまうので、私が今時点で妄想している最強のデータ基盤を描いて、その中でまだ触ったことのない技術を今年触っていこうという意気込みを最後に書こうと思います（意気込みだけにならないように頑張りたいです！） まだ触ったことないものもあるので妄想しているレベルです。 アーキテクチャ図 まず最初に結論から書いていきます。 なぜこのアーキテクチャが最強と思うのか データ基盤として機能を分けると以下の6つの領域に分かれると思っています（もう少し細かく分けることもできたりします。例えばDMBOKとかではホイール図で11の領域に分けたりしています） データ基盤の領域 主に関連するDMBOKの知識領域 主担当
意外と手軽、家庭用 10 Gbps+ イーサネットまとめ
この他、50G、200G、400G、800G も規格としては存在しますが、メリットが少なかったり、一般家庭で買える値段ではないので割愛します。 200G 以上必要な場合は場合によっては link aggregation などを使うと良いでしょう。 モジュールの価格は参考で、 Cisco などの純正品ではなく、FS.com や 10Gtek などのいわゆるジェネリック品の価格です。当然ですが価格は変動しますので、目安程度にお願いします。調査したのは2023年1月8日です。 ツイストペアか、光ファイバーか LAN を構築するときに条件が全く変わってくるのがツイストペアケーブルを用いるか、光ファイバーケーブルを用いるかです。 ツイストペアケーブル(UTP)は入手性が良く、作りも頑丈なため取り扱いが気楽です。その半面、速度が限られ、10 Gbps 以上になると消費電力やレイテンシ、安定性という面で
フロントエンドとSPA職人の目指したものの歴史と概略
年末年始にフロントエンド論みたいな記事をいくつか見たが、僕ら古のSPA職人がやってきたフロントエンドという職域と目指していたものが失伝しかけている気がするので、ここに時代ごとに何を考えていたか、雑に書き殴る。 注意点として、 2004から始まるが、自分がプログラミングを始めたのが2010, 業務としてコードを書き始めたのが 2012 なので、解像度が高いのはそれ以降になる。 tl;dr 2004: 動き出す HTML 2011: 構造化のはじまり 2015: 贅沢品としてのSPAとコミュニティ分化 2017: 貧者のSPA 2019: 守破離としてのパフォーマンス 2004: 動きだす HTML AJAX の時代。要は XMLHTTPRequest で取得したコンテンツに応じて、動的書き換えをDOM書き換えを行うこと。今では名付けるほどでもない操作だが、HTMLが静的なものをやめたことは、
Gitのコミットメッセージの書き方（2023年ver.）
本記事のモチベーション 約8年前、Gitを使い始めたときに以下の記事を公開したところ、想像以上の反応をいただきました。 当時はSubversionからGitに移行し、試行錯誤をしている中だったこともあり、多くの反応をいただけたことはモチベーションのひとつでした。 ただ、時が経ち、当然かもしれませんが現在は当時と違う書き方をしており、思想として変わっていない部分はあるものの、今でもときどきLikeをいただく中で、アップデートを全くしないのは誠実じゃないなと感じていました。 というわけで、現在のフォーマットも数年後には変わっている可能性が高いですが、その時々のスナップショットを公開することにも何らか意味があるかなと思い、「今の僕はこうコミットメッセージを書いているよ」というのをまとめました。 Gitを使う環境 開発フローやホスティングサービスごとのUIのdiffによって、最適なフォーマットは変
データエンジニア道の俺のバイブル
先人の知恵に学ぶ データエンジニア道で、本当に良かった！読み物を、不定期に追記していく。 A Beginner’s Guide to Data Engineering — Part I データエンジニアをこれから始める人に、必ず薦める記事。データエンジニアの基本を学べるかつ、どういう世界に広がっていくのかまで、一気に学べるのでとても良い。 Functional Data Engineering — a modern paradigm for batch data processing 関数型パラダイムを使ったデータパイプラインの構築方法。これを初めて読んだ時の衝撃は今でも忘れないし、フルスクラッチからdbtを使ったデータパイプラインになっても健在な設計手法。 Engineers Shouldn’t Write ETL: A Guide to Building a High Function
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
2022年に見かけたモダンなCSSの書き方を振り返る
