はてなブックマーク

仕事での話ですが、とある画面からロードしたiframeと呼び出し元との間で、イベントをやり取りしたいケースがありました。 これがなかなかに上手く行かなかったので、最終的にどう解決したのか共有します。 イベントのやり取りが出来なかった理由 クロスドメインの制約に引っかかったからです。 原因はiframeの呼び出し元画面と、iframe側のドメインが異なることにありました。 サブドメイン（aa.example.comとbb.example.com）間だったのですが、それでもダメでした。 stackoverflow.com Window.postMessage() 最終的に行き着いたのが、window.postMessage() です。 MDNの解説を読むと、オリジン間通信を可能にすると記されています。 window.postMessage() は、 Window オブジェクト間で安全にオリジン

Windows11のWSL2(Ubuntu)で、rootユーザーのパスワードがわからなかったため、再設定しました。 基本的にはrootユーザーになって passwd するだけなのですが、付随する注意点や興味深いこともあったため、書き記します。 $ sudo su - # passwd New password: Retype new password: passwd: password updated successfully # 注意点： su - ではなく sudo su - である 普通に su - を実行すると、rootユーザーのパスワードを求められてしまいます。 $ su - Password: 一方で、sudo su - だとパスワードを求められません。 sudo によって、スーパーユーザー権限で su - が実行されるからです。 なぜ sudo が実行できるのか WSL2のU

Workspacesは、主に海外を中心としたデスク紹介サイトです。 私はまだリモートワーク歴が浅いので、リモートワーク環境を充実させるためのヒントを探したく、参考にしております。 www.workspaces.xyz 名だたる企業で活躍されている方のデスクを紹介 デスク紹介を眺めていると、私でも知っている企業の名前が、わりと出てきます。 FacebookやNetflixは、こういったクリエイティブ環境で開発やデザインがされていることを知れる、まさに舞台裏です。 裏側を知ると、何故かテンションが上ってきます。 Facebook 映えある1番目の投稿は、FacebookのエンジニアであるShivkanth Bagavathy氏。 PCはMacBook Proで、デスク周りが濃いグレーと黒系統で統一されております。 シックでかなり素敵です。 001 - Shivkanth Bagavathy T

PostgreSQLの勉強をしているのですが、XID周回問題について知りました。 どのような問題か気になり調査したので、その際の技術メモです。 ちなみに、『詳解PostgreSQL［10/11対応］―現場で役立つ新機能と実践知識』というgihyo.jpの特集記事が、わかりやすかったです。 gihyo.jp XIDとは XIDとは、トランザクションごとに自動で割り振られるトランザクション識別子です。 PostgreSQLはテーブルやレコードなどをオブジェクトとして扱い、それぞれにXIDを内部的に割り振ります。 詳解 PostgreSQL［10/11対応］―現場で役立つ新機能と実践知識 〜中略〜 XIDの回収についてですが，PostgreSQLはテーブルやレコードなどをそれぞれ一つ一つのオブジェクトとして扱っており，それぞれにIDを割り振っています。これがXIDです。 https://gihy

少し昔の話ですが、『YAPC::Asia Tokyo 2014』のイベントに参加したとき、『Where狙いのキー、order by狙いのキー』という発表を聞きました。 当時の私はデータベースのインデックスについての知識が皆無だったので、発表を聞いた際は衝撃を受けたことを覚えてます。 Where狙いのキー、order by狙いのキー from yoku0825 www.slideshare.net WHERE狙いのキー、ORDER BY狙いのキー キーと書いてありますが、主にインデックスのことです。 「WHEREとORDER BYの、どちらに向けた高速化インデックスなのか？」 これを意識する必要があります。 WHEREによるデータの絞り込みを高速化するためのインデックス ORDER BYによる並び替えの性能を向上するためのインデックス MySQLにおけるインデックスの場合、まったく同一のテー

「ソフトウェアデザイン2020年1月号」を読んでいるのですが、その中に次の一節がありました。 GitLab のCI に関する部分は.gitlab-ci.yml に書き、単独でも実行できる内容はシェルにまとめて、scriptで呼び出すのがお勧めです。 そうすると、.gitlab-ci.ymlに必要な事項だけがまとまって見やすくなるはずです。 しかし、シェルスクリプトにまとめてしまうと実行経過が見えなくなったりするので、シェルスクリプト内で実行過程を標準出力に出力するか、シェルスクリプトのshebang注C に「set -x」または 「set -xe」を付けることをお勧めします。 ソフトウェアデザイン 2020年1月号 より GitLab特集の記事ですが、CI上で実行するシェルスクリプトには、「set -x」または「set -xe」を付けようという内容です。 なぜ「set -x」または「set

「セイチョウ・ジャーニー」「挫折論への招待」アドベントカレンダー Advent Calendar 2019の19日目の記事です。 「挫折論への招待」は、技術書典6でGrowthfactionが頒布した、挫折をテーマとした同人誌です。 私は本書に、スペシャリストを目指したけど挫折したという内容で、キャリアに関する挫折を寄稿しました。 booth.pm 本記事に書くのは、スペシャリストを目指して挫折したあとの、その後の物語です。 挫折してから立ち直るまで 詳細は割愛しますが、キャリアにおいて「スペシャリスト」か「マネージャー」を選択する局面になり、私はスペシャリストを選択しました。 スペシャリストを選択した主な理由は、コミュニケーションが得意でなくマネージャーは不向きである点と、プログラミングが好きでIT業界に入ったからです。 スペシャリストを目指して挫折する スペシャリストを目指すと宣言した

年末年始に購入した手帳はうまく馴染めなかったので、しばらくの間Slackで日記を書いてました。 www.konosumi.net ただ、Slackで日記を書くのもしっくりこず、長続きしませんでした。 そこでやり方を変え、GitHubを使ってみることにしました。 実際に試してみたところ、思いの外感触が良かったです。 せっかくなので、ブログで概要を共有することにしました。 ベースとなる考え方 じぶんリリースノート よしたくさんの「じぶんRelease Notes」 てぃーびーさんの「冒険記録」 GaaTS (GitHub as a Text Storage) 個人スクラム GitHubに書いていること やりたいことと実績を記録する日記ファイル（日付.md） 大きな変化と出来事を記録する（CHANGELOG.md) 読書記録（READING.md) やりたいことのメモ（TODO.md） 注意事項

最近は忙しく、テック系ポッドキャストをあまり聴けていない日々が続いていたのですが、また聴き始めることにしました。 ただ、以前書いた「2017年とテック系Podcast(ポッドキャスト)を、紹介しつつ振り返る」という記事から、すでに1年以上が経過しています。 www.konosumi.net 最近のポッドキャストはまったくわからない状況だったので、新たに購読するポッドキャストを再検討することにしました。 テック系ポッドキャストの探し方 Podcast Freaks テック系ポッドキャストの紹介 アジャイルラジオ テストラジオ Misreading Chat engineer meeting podcast dex.fm w2o.fm 人生fm Researchat.fm UIT_INSIDE Tech系フリーランスが選ぶ最近の気になるトピックス(テクフリ) mozaic.fm プログラム雑談

新人研修の内容を検討しているのですが、それにあたり各社の新人研修を調査しました。 なお本記事は、@gcchaan氏のGitHub Gistにある「研修資料まとめ」を参考に作成しております。 @gcchaan氏の「研修資料まとめ」はとても素晴らしいまとめで、これを見ると各社がどのように新人エンジニアを育成しているのか見てとれたり、新人エンジニアがどのような研修を経て成長していくのか垣間見えます。 DMM.com（2019） DMM.comの研修で紹介されている技術書 GMOペパボ（2019） LINE（2018） Spee（2016） Wantedly（2019） ウエディングパーク（2019） エムスリー（2018） 研修概要 KAYAC（2017） クックパッド（2016） GREE（2014） ぐるなび（2017） LEMPについて サイバーエージェント（2019） エンジニア研修がど

技術書典7に向けて、「エンジニアアンチパターンNEXT」という技術系同人誌を書いてます。 自分の失敗談をアンチパターンに見立てた本で、そこから「どうすれば良かった？」を考える本です。 その中に「キャリア」をテーマとした章があるのですが、自分のエンジニアキャリアをふりかえってみて、いくつか気づいたことがありました。 ポッドキャスト駆動の技術学習 YAPCでRebuild.fmの存在を知る もともと私は積極的に技術を習得しようとするタイプでもなく、あくまで仕事だからプログラムを書いているくらいの人間でした。 ただPerlだけは好きだったので、試しにYAPCへ参加してみようと決意したのが、私に転機をもたらします。 YAPCはYet Another Perl Conferenceの略で、Perlを軸としたITに関わるすべての人のためのカンファレンスです。 YAPCに参加した私は、登壇者や参加者を含

ESLintはJavaScriptのソースコードを静的解析するツールです。 Lintツールはソースコードの書き方を統一したり、静的解析の段階で問題になりそうなコードや、明らかなバグを見つけるのに役立ちます。 .eslintrc.json ESLintの実行には設定ファイルが必要です。 これは「--init」で作成できます。 $ npm install --save-dev eslint $ npx eslint --init ? How would you like to use ESLint? To check syntax and find problems ? What type of modules does your project use? CommonJS (require/exports) ? Which framework does your project use? N

2019年09月22日（日）に開催される技術書典7で、「Node.js中級者を目指す」という技術系同人誌を頒布します。 本書は技術書典5の「PHP中級者を目指す（商業誌版はレベルアップPHP）」に続く、中級者を目指すシリーズの第二弾です。 techbookfest.org 本の概要 入門書の次に読むことを想定にした、中級者へのステップアップを目指すNode.js本です。 主にNode.jsに対する技術的な内容を扱います。 新しいJavaScriptでは何が変わったのか？ コールバック地獄の解消 非同期プログラミングにおける例外の捕捉 クラスター化によるWEBサーバー運用 ・・・をはじめ、Node.jsには学びのポイントがたくさんあります。 そういったポイントを私自身も勉強しながら、集大成としてまとめています。 私が主にNode.jsを使って開発していたのは数年前の話なのですが、最近になって

「技術書LT&懇親会【Caraquri Tech Night #1】」で、LTプレゼンをしました。 オススメの技術書を紹介し合って、気づきや知見を増やすイベントです。 caraquri.connpass.com 私は本が好きなので、定期的に書店に足を運んでいます。 今回のイベントでは、技術系同人誌についてプレゼンされる方が多かったです。 におうコードの問題集 私は「におうコードの問題集」について発表しました。 におうコードの問題集とは？ 「におうコードの問題集」は技術書典で頒布されているシリーズ作品で、過去に3作が頒布されています。 技術書典4： リファククタリング 〜バリエーションに立ち向かう編〜 技術書典5： セキュリティ 〜セキュリティホールに立ち向かう編〜 技術書典6： 設計 〜ソフトウェア設計に立ち向かう編〜 におうコードとはなにか？ 「におうコード」とは、脆弱性・バグ・保守性が

AWSではELB(Elastic Load Balancing)を活用し、アクセスの振り分けや負荷分散を行なうのがメジャーです。 ロードバランサーを使った構成は、通常のWebシステムではごくごく一般的です。 ただしSocket.IOを使ったウェブソケット(websocket)接続では、問題となる場合があります。 これには理由がありまして、私も調査に苦労しました。 まずは前提となる知識を共有しつつ、備忘録を兼ねて解説します。 目次 目次 Socket.ioの仕組みをざっくりと理解する ロングポーリング(polling) ロングポーリングからウェブソケット(websocket)へ Connection: Upgrade ロードバランスされるとセッション(sid)が引き継げない問題 Redisによるセッションの共有 Application Load Balancer Stickiness(Sti

書店で購入したオライリーの「Node.jsデザインパターン」を読んでます。 本の内容はNode.js流のコードの書き方「The Node Way」を学ぶことに主眼が置かれており、さらにクラスタリングをはじめとするNode.jsのスケーラビリティや負荷分散についても書かれてます。 Node.jsデザインパターン 第2版 作者: Mario Casciaro,Luciano Mammino,武舎広幸,阿部和也出版社/メーカー: オライリージャパン発売日: 2019/05/18メディア: 単行本（ソフトカバー）この商品を含むブログを見る これらを体系的に学んだことがなかったため、おもしろそうと思い購入しました。 まだ4章ですが、時間を忘れて読み進めておりオススメです。 さて4章の「ES2015以降の機能を使った非同期パターン」にて、以下のコードが登場します。 const args = [].sl

AngularのSPA(Single Page Application)のプログラムを書いてたら、以下の問題に遭遇しました。 TypeScriptのコード内でのsetInterval()の返り値には罠がある https://blog.kubosho.com/entry/setinterval-trap-on-typescript/ 内容としては「Type 'Timer' is not assignable to type 'number'.」というエラーメッセージが表示されます。 VSCode(Visual Studio Code)で関数の戻り値を確認すると、戻り値の型はNodeJS.Timerになってます。 私の場合は、Angularで「setTimeout()」を記述しただけです。なぜそれが「NodeJS.Timer」となってしまうのか気になったので、調べてみました。 window.s

「レベルアップPHP」という本を書きました。 技術書典6の個人サークルでお披露目しまして、現在好評発売中です。 レベルアップPHP ?言語を理解して中級者へ? (技術の泉シリーズ（NextPublishing）) 作者: 佐々木勝広出版社/メーカー: インプレスR&D発売日: 2019/04/12メディア: オンデマンド (ペーパーバック)この商品を含むブログを見る この本なんですが、技術書典5の「PHP中級者を目指す」という同人誌を底本としまして、わりと苦労して書き上げた本です。 苦節の末に発売できたので、ご紹介したいと思います。 モチベーション どんな方に読んでもらいたいか？ 章構成 第1〜4章 変数と型と型宣言 第5〜7章 名前空間から外部ライブラリーへ 第8章 エラーと例外 第9章 アーキテクチャー 第10章　PSRコーディングガイドライン 第11章　正規表現を楽しもう 第12章　

技術書典6にサークル参加しました。 サークルは「このすみ堂」で、場所は「こ04」です。 熱の冷めないうちに振り返り記事を書きたかったので、さっそく書いてみました。 当日に頒布した本 レベルアップPHPの執筆について 技術書典シリーズ(現、技術の泉シリーズ) Kuin本の執筆について Kuin入門書としての執筆 A5の192ページで800円という価格設定 Re:VIEW Starterによるショートカット メジャーでないプログラミング言語の広報 Kuinとくいなちゃんについて発信する 当日について お隣のサークル「こ05」のてきめんさんもKuin！ 当日お越しいただいた皆様への感謝を込めて くいなちゃんの手元にkuinの本がある さいごに 当日に頒布した本 本は3冊を頒布しましたが、技術書典6のメインは「Kuinプログラミング入門」です。 「エンジニアアンチパターン」は既刊で、レベルアップP

くいなちゃんとは、プログラミング言語Kuinの開発者です。 くいなちゃんには、何かしらのきっかけでくいなちゃんが倒されると、次の世代のくいなちゃんに引き継がれる仕組みがあります。 代々引き継がれており、現在は第20期です。 「くいなちゃん」について - その他 「ところで、何代目のくいなちゃんが人気なのでしょうか？」 ふと気になりましたので、人気投票のフォームを作ってみました。投票のアンケートは以下のURLです。 投票URL： https://linkto.run/p/WU53Z3PN 会員登録は不要です。直感でお好みのくいなちゃんに投票していただければと思いますので、お気軽にご回答ください！ pollmakerによる投票フォームの無料作成 アンケートには「pollmaker」というサービスを使ってます。 https://www.poll-maker.com/ 画像付きの投票が作れるサービ

BOOTHで購入した「雅なPerl入門第3版」がおもしろかったので、一気読みしました。 booth.pm 本書が読みやすい理由は、プログラミング初心者の雅とPerlハッカーであるクロウの、会話形式で物語が進んでいくからです。個人的には、プログラミングの経験はあるけどPerlは未経験の人に、ちょうど良いレベル感だと感じました。 読み終えましたので、感想などつらつらと書いていきます。 目次 目次 Perlを知る TMTOWTDI CPAN コミュニティ 本書の感想 章の構成 なぜPerlが好きなのか？ unlessによる否定の肯定形判定 myによるレキシカルスコープがある 後置ifと後置unlessによる判定 正規表現に強くなる さいごに Perlを知る Perlは、プログラマの三大美徳でも有名なLarry Wallが作ったスクリプト言語です。RubyもPerlの影響を受けていて、「Perlよ

「Habitica - Gamify Your Life」は、RPGの主人公を育てるようなゲーム感覚で、TODO管理と習慣化の維持を目指すサービスです。 habitica.com さらにOSSなので、GitHubにソースコードも公開されてます。気になったので試してみました。 まず最初にキャラクターを作る Habiticaではじめにやることは、キャラクター制作です。RPGでいう主人公のキャラクターメイキングです。 なお、最初の段階ではパーツも少ないのですが、ゲームを進めていくと増えていくみたいです。そして、キャラクターに名前を付けたらゲームスタートです。 初期画面 Habiticaの初期画面です。大きく分けて「習慣」「日課」「To-Do」「ごほうび」があります。 習慣 習慣として定着させたいことを入力します。 良い行ないをしたら「+」をクリックします。ゴールドや経験を獲得します。 悪い行ない

年末年始に今年度の手帳を購入したのですが、うまく馴染めなかったのでSlackで手帳や日記をつけてみることにしました。 もともとは、「個人Slackのススメ」を読んだのがきっかけです。 qiita.com 記事を読んだ当時は、個人でひとりSlackを始めることはなかったのですが。 手帳をアナログからデジタルへと移行したいモチベーションで始めてみたところ、あまりに快適すぎるので、今後も病み付きになりそうです。 個人Slackについての感想や、私がどのように使っているかなど共有します。 3行日記としての活用 「#diary」というチャンネルで、3行日記を付けてます。日記は続かないことが多かったのですが、3行であれば就寝前や通勤中でも書けるので、日記を書く習慣ができました。 「3行日記」を書くと、なぜ健康になれるのか? 作者: 小林弘幸出版社/メーカー: アスコム発売日: 2014/05/24メデ

「Crieit Advent Calendar 2018」の記事です。2018年は、業務で「Firebase Realtime Database」を使った1年でした。 firebase.google.com Realtime Databaseは、数ミリ秒で各クライアントへデータを同期します。はじめて使ったときは、とても感動しました。開発したシステムでは、リアルタイムのデータ表示が必要な、特定機能に限定してRealtime Databaseを投入しています。 色々と工夫した点がありますので、今回はその辺りの知見を共有します。 RDB(Relational Database)との併用 「Firebase Realtime Database」は、データベースとして単体で使うわけではなく、PostgreSQLと併用して運用しています。 それには、いくつかの理由があります。 はじめて使うので、ミニマ

「仮想DOMで探る、React.jsがヒットした理由」で、登壇しました。勉強会は、初心者向けのJSフレームワーク勉強会です。 sakeganaito.connpass.com 会場の風景を撮り忘れていたのですが、すごくシックで雰囲気が良かったです。写真は「好きだけじゃ辛いScala.js」の発表です。発表者は@omiendさん。 Vue.js、Scala.js、Riot.js・・・さまざまなフロントエンドJSの発表がある中、私はReact.jsについて発表しました。 自分なりにまとめながら、発表の補足を書いていきます。 目次 目次 仮想DOMで探る、Reactがヒットした理由のスライド スライドの解説 DOMとは何か？ DOMのイメージ図 実DOM(リアルDOM)と仮想DOMの違い jQueryとReact.jsの違いで考えてみる Reactは差分検知のアルゴリズムだから他の分野に応用でき