フロントエンドカンファレンス北海道2024 で発表させていただきました。 スライド中のリンク一覧

An IDE built on top of a canvas, Haystack takes care of the tedious and confusing parts of coding for you

Node.js で型安全な環境変数を扱うスニペットを作りました。 next devのようなアプリケーションの起動、Playwright でのテストなどコマンドごとに渡したい環境変数のセットが異なるケースがあります。 この場合に環境変数をまとめたものを定義して、それをコマンドごとに読み込むセットを変えたいことがあります。 次のようにベタ書きしてもいいのですが、渡したい環境変数が増えると管理が大変になります。 NEXT_PUBLIC_LOCALHOST_URL=http://localhost:3000 NEXT_PUBLIC_API_URL=http://localhost:3001 NEXT_PUBLIC_IS_TEST_MODE=false FOO="bar" next dev そのため、.envのような環境変数をまとめたファイルを使いたくなります。 Node.js は--env-fil

社交の場面でドギマギした経験は誰にでもあるだろう。だが、なかにはそうした場面で不安になりすぎる人もいる。「社交不安」とは何か、どう緩和できるのか、米国の臨床心理学者が解説する。 「パーティに参加すると、全員から見られていると感じます。鼓動は速まり、顔は赤くなり、胃も痛くなる。みんなが私を批判しているに違いない。私の容姿から、歩き方、話し方、食べ方までも。 そのうちに、社交的な場をますます避けるようになりました。不安に耐えられないからです。この孤立感に心が折れそうです」 こういった話を、社交不安を抱える私の患者たちからよく聞く。心理学者の私は、社交不安が、最も多い受診理由のひとつになっていることに気づいた。パンデミックも相まって、ソーシャルメディアや人とのバーチャルな関わり方が増えてきてからはなおさらだ。 社交不安症は、米国では2番目に多い不安障害だ（特定の恐怖症に次ぐ）。米国では成人および

シルク・フロス・ボート ほそやゆきの 取り返しのつかない傷を負った3人の少女。ある者は身動きが取れず立ちすくみ、ある者は決着をつけ前へ進む。「ひいさま」との出会いは彼女らをどう変えるのか。

fOU45y5Ig15pgvogoGm3kdpSfPfRCpuh fOU45y5Ig15pgvogoGm3kdpSfPfRCpuh 7dc1db5e6f10a288fd426d6344b5a688

Webで新規サービスを立ち上げる際に、UIからインフラ周りまで一人で面倒を見られるエンジニアは、少人数のスタートアップでなくとも非常に頼れる存在です。どんな課題に直面しても技術力で乗り越える、そんなスキルフルなエンジニアに憧れる方も多いでしょう。 この記事では、フロントエンドのプログラミング（JavaScript周辺）からサーバーサイド、インフラ、さらに開発手法まで、Web開発で必要になるさまざまなレイヤーのフルスタックなスキルの現在地と、関連するUdemyの講座を紹介します。 株式会社ヘンリーでVPoEを務める松木雅幸（@songmu）さんの執筆です。 フルスタックエンジニアに必要なスキル さまざまな講座でまとめて学習してみよう Udemyでは夏のビッグセールを開催中！ ※この記事は、株式会社ベネッセコーポレーションによるタイアップ広告です。記事末に、はてなブックマークした方にAmazo

翻訳を担当した書籍『スタッフエンジニアの道ー優れた技術専門職になるためのガイド』（オライリー・ジャパン）が来週（2024年8月26日）発売となります（電子書籍はオライリー・ジャパンのサイトでの販売となります）。本書は、2022年にO'Reilly Mediaより刊行されたTanya Reilly著『The Staff Engineer's Path: A Guide for Individual Contributors Navigating Growth and Change』の全訳となります。 スタッフエンジニアの道 ―優れた技術専門職になるためのガイド 作者:Tanya Reillyオライリー・ジャパンAmazon 本書は、技術専門職としてのキャリア成長に必要な考え方やスキルを、20年を超えるキャリアを持ち、現在も現役で上級技術専門職を務めている著者が、自身の経験をもとに整理・解説し

「年収を上げる」と検索すると、ずらり転職サイトが並ぶ。ライフハック記事の体裁だが、最終的には転職サイトに誘導する広告記事だ。 しかも見事なまでに中身がない。転職しないなら、「副業を始める」とか「スキルアップする」といった誰でも思いつきそうなトピックを、薄ーく書きのばしている。 ここでは、もう少し有益な書籍を紹介する。想定読者はこんな感じ。 スキルアップはしてるけど、給料UPにつながらない 転職も考えたが、今の場所で評価されたい 自分をプレゼンして「良く見せる」のがヘタ そんな人に、2つのアプローチで給料を上げる方法を紹介する。 人事制度の脆弱性をハッキングする 上司のバイアスを逆に利用させてもらう この記事は1のアプローチから攻める。 紹介する本はこれだ、『この１冊ですべてわかる　人事制度の基本』（西尾太、日本実業出版社）。 著者は人材コンサルタント。400社、1万人以上をコンサルティング

この記事は何？ 最近、生成AIブームで「Pythonの簡単なチャットアプリを作ってみる」機会が増えたのではないでしょうか。 特に、Streamlitという便利なライブラリを使えば、Reactなどが書けなくても簡単にフロントエンドをPythonで作ることができます。 開発端末のローカルやCloud9などでこれを動かすのは簡単なのですが、いざ他の人にも使ってもらおうとするとクラウド上にデプロイする必要があります。 しかし、アプリをコンテナに固めてAWSにデプロイ！ といった王道の作業をGUIで分かりやすく解説する記事が意外と少なかったので、初心者向けハンズオンとしてまとめてみます。 ハンズオンの概要 作成するアーキテクチャ 作業環境 端末：Macbook（Appleシリコン） ブラウザ：Google Chrome コードエディター：VS Code Python：3.9以降のバージョン 注意事項

※統一された呼び方があるわけではありませんが、この記事では説明のためにこのように呼びます データ通信方式は、YouTubeやLINEなどと同じ通信方式です。緊急地震速報のように同じ速報をすべてのスマホに送る場合でも、一台一台のスマホに対して個別に通信を行なっています。 これに対して、ETWS (Earthquake and Tsunami Warning System) 方式は特殊で、携帯電話の基地局は、個々のスマホを特定することなく、「地震発生」という信号を一斉に送信します。この信号を受信できたスマホが、警報音を鳴らすという仕組みなのです。 実は、スマホは、通話やアプリを利用していない「待ち受け」状態の時でも、自分が現在使用している基地局の電波を受信しています。これは、通話の着信を受けたり、基地局の電波が弱くなったときに、隣の基地局に電波を切り替える動作(ハンドオーバー)を行なうためです

ソート順の選択プルダウンがある一覧系ページを実装するとき、選択肢たちの管理方法に頭を悩ませることが多いと思います。 商品一覧ページの概要 ソート順プルダウンの選択肢たち 上の画像に示したような場合だと、 《クエリパラメータ》と《選択肢》の間の相互変換 ?sort=price&order=desc <--> 「価格が高い順」 《select の状態に使うための文字列》と《選択肢》の間の相互変換 <option value={id}>{label}</option> クエリパラメータが sort order の2つあり、それらをそのまま流用できないので 最低限でも、これらの変換ロジックを用意しておく必要がありますね。 この記事では、このような「選択肢と、それにまつわる変換ロジック群」を整理する方法を、高凝集・SSoT (Single Source of Truth; 信頼できる唯一の情報源)

『手を動かしてわかるクリーンアーキテクチャ 』の第二章の冒頭に登場する話題に共感したので紹介。 従来の多層アーキテクチャでは、データベースを中心にアプリケーションの 開発が行なわれます。この場合、Web 層はドメイン層に依存し、ドメイン層は 永続化層、つまり、データベースに依存することになります。そうなると、す べてのものは永続化層上に構築されることになり、その結果、いくつかの要因 が絡まり合って、問題が起きやすくなります。 手を動かしてわかるクリーンアーキテクチャ　ヘキサゴナルアーキテクチャによるクリーンなアプリケーション開発 20p 手を動かしてわかるクリーンアーキテクチャ　ヘキサゴナルアーキテクチャによるクリーンなアプリケーション開発 作者:Tom Hombergs,須田 智之インプレスAmazon 著者によれば、機能開発をデータベース中心に設計すると、ドメイン層と永続化層の密結合が

by Daniel Oberhaus イーロン・マスク氏は2024年のアメリカ大統領選挙においてドナルド・トランプ前大統領の支持を表明しており、選挙に関連する意見をX(旧Twitter)に投稿しています。しかし、オンライン上の偽情報拡散やヘイトスピーチを阻止する目的の非営利団体であるデジタルヘイト対策センターの調査では、マスク氏の投稿の多くに虚偽が含まれているにもかかわらず、誤った投稿を訂正したり補足したりする「コミュニティノート」が機能していないと指摘しています。 Elon Musk's misleading election claims have accrued 1.2 billion views on X, new analysis says https://www.nbcnews.com/tech/misinformation/elon-musk-misleading-elect

イギリス各地の暴動の発端となった「偽情報」の投稿者が逮捕されました。イギリスで広がっている極右主義者らが主導する一連の暴動は、子どもが犠牲となった殺人事件の犯人に関する偽情報がきっかけでしたが、警察…

2024年度リクルート エンジニアコース新人研修の講義資料です

あゎ菜ちゃんは今日もしあわせ たばよう 何一つ上手くいかないコンビニバイト店員・あゎ菜ちゃん。 今日もたくさん失敗して、思い出せないくらい叱られた…。 この状況から、他人の力を一切借りず、果たして彼女はどうしあわせになるのか！？ しあわせ自家発電まんが、スタート！！

はじめに こんにちは。かる(@caru)です！ 大学生として勉強する傍ら、日々フロントエンドエンジニアを目指して活動しています。今回は、私がコミッターとして参加しているMagnitoというOSSプロジェクトについて紹介します。 皆さんは、AWSのCognitoというサービスを知っていますか？ スマホアプリからWebアプリまで、多くのアプリケーションで認証・認可の機能は不可欠です。その中でも、Amazon Cognitoは多くの開発者に利用されている認証・認可サービスの一つです。この記事では、Cognitoを使う際の課題と、Magnitoがそれにどう対応するかを紹介します。 Amazon Cognitoとは Amazon Cognitoは、Amazon Web Serviceが提供するユーザー認証、認可、およびユーザー管理を簡単にするためのサービスです。これにより、アプリケーションにユーザー