コミュニケーションチームのid:NozomuMiyamotoです。 Classiでは、2021年12月のAngularJSのEOLに向けて、Web Componentsを利用した段階的AngularJS脱出作戦を進めてきました。これはAngular Elementsと呼ばれるAngularで作成したコンポーネントをWebComponentsに変換する技術を用い、部分的にシステムリプレースを行う作戦です。 今回は、そこでぶつかった課題と解決に用いたWebComponentsの配信アーキテクチャについて紹介します。 背景 Classiにはplatformと呼ばれる最初期から存在する巨大なリポジトリがあります。このリポジトリには様々な言語で書かれた複数のサービスが共存しており、全体像を把握することが非常に困難です。これを管理可能なレベルまで解体するとともに、EOLを迎えるシステムの置き換えを行う

突然ですが... あなたは、あるゲームプロジェクトの本番リリース2日前にサーバエンジニアとしてJOINしました。いざリリースを迎えたとき、ElastiCacheのメモリが突然危険域を超え、さらにあと2時間で枯渇しそうな状況になりました。 さて、この状況におかれたあなたは何をしますか？ はじめに モバイルゲームのシステムは新しいイベントをopenするとトラフィックが2倍、3倍、時には普段の10倍以上来ることがあり、トラフィックの変動が非常に大きい特性があります。 新しいゲームのリリース時はより顕著で、想定以上のトラフィックが来ることもしばしばあります。 この記事は、あるゲームプロジェクトの本番リリース時に大規模トラフィックが来た際のサーバトラブルを題材に、 どのような観点で問題を切り分けていったのか、トラブルシュートのプロセス どのような準備(負荷テスト)をしていれば防げるのか という話をし

約1年前、BtoB企業における顧客獲得型サイトの勝ちパターンをまとめた『BtoBサイト・チェックリスト』を、ベイジ、才流さん、WACULさんの3社連名で発表し、大きな反響をいただきました。 このチェックリストはブログで公開しただけではなく、私たちのウェブ制作の現場でもフル活用されています。この1年間に手掛けた多くのBtoBサイトが、このチェックリストを満たすように設計され、多くのBtoBサイトでコンバージョン数/率やフォーム誘導数/率の向上など、ポジティブな変化が生まれました。 このような活動の中から、『BtoBサイト・チェックリスト』の内容を満たした『BtoBサイト・ワイヤーフレーム』なるものが誕生しました。これを今回、皆さんにご提供します。リード情報なども一切取らず、そのまま丸ごとお渡しします。 BtoBサイト標準ワイヤーフレームXD版（770KB） BtoBサイト標準ワイヤーフレーム

Docker Compose を使って複数コンテナを起動するときに，タイミングによっては接続エラーになってしまう場合がある．具体的な例としては「データベースコンテナ」の起動が遅いために「アプリケーションコンテナ」が接続エラーになってしまうことが挙げられる． depends_on とは Docker Compose には depends_on という設定項目があり，複数コンテナの「起動順序」を制御できるようになっている．しかし，あくまでこれは「起動順序」となり，必ずしも「準備完了」を保証するものではない．ドキュメントにも「開始 (start)」と「準備完了 (ready)」は異なると書いてあり，depends_on を使っても接続エラーは発生する可能性がある．機能不足と考えるのではなく，アプリケーション側でリトライ機構を用意するなど，レジリエンス（回復性）を考慮する必要がある． docs.d

note→Jimdoのブログ機能→はてなブログへの引っ越し 【はてなブログのカスタマイズで参考になった記事】 ・テーマは「SOHO」を選びました。 ・こちらのページでCSSを生成し、タイトル下にメニューを作りました。 ・画像を常に真ん中に配置するように変えました。 ・フォントをユニバーサルデザインWEBフォントに変えました。 ・文字サイズを少し大きくしました。 ・codocの投げ銭リンクが常に表示されるようにしました。 ・アクセス解析にgoogleアナリティクス・juicerを入れました はてなって、実はすごいのでは（いまさら） 【2021/3/29追記】記事のエクスポートについても詳しく書いてみました。 note→Jimdoのブログ機能→はてなブログへの引っ越し 私は、8月末でnoteをやめて、Jimdo+codocでブログを更新していました。 www.tomokooosuki.com

RAG構築のためのAzure OpenAI Serviceリファレンスアーキテクチャ詳解/wakarimiragarchitecture

以下はSimon Holdorf( dev.to/ Twitter / GitHub )による記事、9 Projects you can do to become a Frontend Master in 2020の日本語訳です。 9 Projects you can do to become a Frontend Master in 2020 Introduction あなたがプログラミングの初心者であるか、既に経験豊富な開発者であるかにかかわらず、この業界では、急速な変化に追いつくために新しい概念と言語・フレームワークを学び続けることが必要です。 たとえばFacebookが4年前にオープンソース化したReactは、既に世界中のJavaScript開発者にとって第一の選択肢になっています。 もちろんVueとAngularにも多くのフォロアーがついています。 さらにはSvelte、Next

こんにちは、フリッツ です。プロダクトマネージャー（以下 PM）になってから相当の年月が経ち、特に、現職の US メルカリにおいては「 UIUX 強化型 PM 」として認知されるようになりました（ありがたい）。 ただ、最近は自分があまりにもいま持っているスキル・経験に立脚しすぎているなぁ、と感じており、強みの分野を広げようとお勉強中。 ということで、旅の序盤として、本記事では「プロダクトの成功」を導くために必要とされる、問題定義・優先順位決定・実行 という 3 つのステージを PM 視点から 20 項目にわけてみました。できるかぎり、（自分の今までの）現場の動き方に沿うようにまとめました。割と基本的な内容ではありつつも、特に実行のパートにおいては、現場で役立つような個人的知見を多少含められたはず…。 プロダクトに関わる方、および・駆け出し～数年目の PM の方のお役に立てる記事になっていれ

どうも！LSSです！！ 最近、JavaScriptを使って色々やってみる事にハマり、記事もそればかりになってきていましたが、今回は 『JavaScriptを使わずに、はてなブログ記事内で使用可能な開閉メニュー』 の作り方を記事にしてみます！ ※はてなブログ以外でももちろん使えますよ^^ サンプルとそのコード ↓の「メニュー」をクリックすると、その下に文字が現れます！ コード 注意点！半角チルダについて とりあえず解説 「menu」と「tg01」は任意の名前です。 <input id="tg01" style="display: none;" type="checkbox" /> <label for="tg01">メニュー</label> <div id="menu">ああああああ</div> はてなブログ特有の注意点！<div>と</div>で囲んでいるのがミソ CSS部分の解説 #me

最終更新日時：2020年3月26日 Google AdSenseをうまい感じに記事一覧ページに表示させる方法知りたいな。 なんだか、広告を貼り付けるのって大変そう この記事は次のような方にオススメの記事です。 はてなブログProでブログ運営をしていて記事一覧（トップページ）にインフィード広告を入れたい人。 はてなブログでブログを運営して収益化を考えている人 アラサー、都内在住ダイエットサラリーマンの海野浩康（@uminoxhiro）が上記の読者様に向けて執筆しました。 アシスタントの空知瑞夏（@sorachimizuka）よ！こんな人はこの記事読んだほうがいいかもね！ ✓この記事で得ることのできる情報 ●はてなブログの記事一覧ページにGoogle広告をうまいこと入れれる方法が学べます。 目次 この記事は次のような方にオススメの記事です。 目次 Google AdSenseを開く ブログをス

2024年9月13日、「普通の人が資産運用で99点をとる方法とその考え方」が日経BPから出版されました。詳しくはこちら。 はじめに 資産運用で 99 点をとる方法とその考え方について説明します。この記事の対象はいわゆる「普通の人」です。 資産運用は趣味ではない。 資産運用を始めてみたいが何をしてよいのかわからない。 資産運用をすでに行っているが毎年ころころと方針を変えてしまっている。 資産運用に無駄に時間ばかり費やしている。 今のところ資産はすべて銀行の普通口座や定期預金にいれている。このまますべて現金でおいておくのも何か損しているみたいでモヤモヤする。だけど難しいことは勉強したくないし時間も使いたくない。 といった人たちです。 記事では最初に結論、すなわち「やるべきこと」を述べます。資産運用で 99 点の投資効率を達成するためにはこの結論部分だけを実行するだけでよいです。 次に、それだけ

マネージャーは非常に重要な役割であり、従業員の業績に大きな影響を与えます。優れたマネージャーの条件を共有し、能力開発の機会を提供し、優れたマネージャーを称賛するなどの方法で、従業員をサポートしましょう。 Google はこれまで、マネジメント業務の大切さを必ずしも正当に評価してきたわけではありません。2002 年、すべてのマネージャーを廃止して管理職のいない組織にするという「実験」を行いました。しかし、この実験は失敗に終わりました。2008 年には、調査チームが、マネージャーは重要な存在ではないという一部の意見を証明しようと試みますが、すぐにまったくの正反対であることがわかりました。つまり、マネージャーはきわめて重要な存在だったのです。 そこで、Google における優れたマネージャーの条件とは何かを正確に突き止めるため、「Project Oxygen」という調査プロジェクトが実施されまし

1. コンテナの作り方 「Dockerは裏方で何をしているのか？」を理解する入門テキスト Sakura internet, Inc. Masahito Zembutsu @zembutsu CloudNative Days Kansai 2019 #CNDK2019 2019, Nov 28 2. 2 この資料は、「Dockerコンテナ」の初学者を対象とした発表資料を、公開用として 再編集し、解説を加えたものです。 オリジナルは2019年11月28日開催の「CloudNative Days KANSAI2019」です。 ご来場の皆さま、登壇者の皆さま、スタッフの皆さん、大変ありがとうございました。 本資料以外にも、SlideShare で関連するスライドを公開していますので、ご興味 ありましたらご覧ください → https://www.slideshare.net/zembutsu/ ちな

JavaScript: Past, Present, and Future - NDC Porto 2020

「即戦力レベルのwebデザイナーが最低限持っている知識を1カ月で身に付ける」ということを目的としたドリルを作りましたので、皆様に公開します。 ダウンロード[PDF/PSD/XD]（92MB） 本ドリルは、約140ページの参考書兼問題集になっています。まずは出題される問題を解き、その上で解説を読んで理解し、再度問題を解きなおすのが基本的な流れです。 内容は、私たちが未経験デザイナーの採用を進める中で、「こういう知識は早い段階で身に付けておいてほしいよね」という知識をまとめました。また演習用のPSD/XDファイルもドリルに含まれています。 身に付くのはあくまで「即戦力クラスの知識」であって、「即戦力」になれるわけではありません。デザインには、非言語・非定型なスキル領域も多々あるため、座学だけで即戦力にはなりません。しかしそれでも、ベースとなる知識は絶対に必要ですし、それを指南する参考書は、的を

この記事では、はてなブログでグーグルアドセンスのインフィード広告を設置する方法について解説しています。 アドセンスの収益アップをしたい方はぜひ試してみてください。 アドセンスには様々な機能があり、 それらを上手に活用することで収益を最大化することができるようになります。 アドセンスを利用している人は、広告ユニットの中に「インフィード広告」なるものがあることはご存じだと思います。 しかし、このインフィード広告は通常の手順でははてはブログで利用することができません。 www.ksakae1216.com こちらの記事にて、はてなブログのインフィード広告の設定方法を解説してくれています。 この情報をもとにインフィード広告を設置してみましたので、 今日はそのやり方について解説していきたいと思います。 アドセンスの収益アップをしたい方はこちらの記事もご覧ください。 www.specializedbl

こんばんは 働きたくないマン。 元派遣会社のうさぎたんです。 今回は、３年くらい前にに働いていたマンパワーグループの業務委託の業務を３年位働いていて思ったことを記事にした行きたいと思います。 働いていたのは、受託業務の業務です。 受託業務とは、マンパワーグループに委託されている仕事をマンパワーグループで雇われた人たちだけでやる仕事です。 委託先の会社は、同じビルの中にあって、マンパワーグループの管理者がその委託先の社員と相談していました。 もし、マンパワーグループで働こうとしている人の参考になれば幸いです。 時給が低すぎる！ シフト制 どんどん人が辞めていく。 仕事の内容は、結構難しい。 個人情報の扱いに疑問が残る。 仕事辞めたあと、求人のことで電話するも門前払いされる。 マンパワーグループはあまり良い評判聞かないのでやめたほうがいいかも。 時給が低すぎる！ マンパワーグループで一番、不満

この記事では、CSS FlexboxとGridをつかってお好みのレイアウトを作成するコツやポイントをまとめた使い方ガイドやチートシート、ゲームなどをまとめて紹介しています。 ゲーム感覚で新しいCSSプロパティを学習することができたり、記述方法をど忘れしてしまったときなどにも便利で、お好みのレイアウトをオンラインで作成できるツールもあります。覚えようと思ってなかなか手がつかなかったひとも、これならすぐにはじめることができますよ。 CSS Gridの使い方ガイド、チートシート、ゲームまとめ Grid Garden CSS Gridレイアウトプロパティを使うことで、人参に水を与えながら自分の農園を育てていく、ゲーム感覚でGridプロパティを学ぶことができます。ゲームの各レベルでは、ゲーム達成に利用できる他のプロパティについてもサンプル例と一緒に解説されています。 Bonus – CSS Dine

グーグルアドセンス申請 事前準備 1回目申請 2回目申請 3回目申請（合格） アドセンス広告貼った場所 最初の見出し（h2）上にレスポンシブ 記事下にレスポンシブ スマホインフィード広告 できなかった広告 広告の成果 「はてなブログ」を開始して、大体1ヵ月ちょっとくらいの時期に、3回目の申請にてグーグルアドセンス合格しました！！！ アドセンス合格 このお姉さんに会いたくて、2度振られましたが3度目の正直でようやく笑顔を見せてくれました。ということで、合格してから少し時間がたってしまいましたが、それまでにやってきたことを記録しがてら、紹介したいと思います。 グーグルアドセンス申請 事前準備 アドセンス申請するには、はてな有料版のProにして独自ドメインでないと利用できないという話もあるようですので両方行いました。（ただし無料版でも合格したという話はあります） といっても、当ブログの場合は、以