文章の折り返しはウェブ制作において意外と難しいものです。URLが文章に含まれている場合、URLがレイアウトを突き抜けてしまった、という経験をみなさんはお持ちではないでしょうか？　この記事では、国内のウェブ制作において「開発者が考えることが少なくてよくなる」安全なCSS指定を紹介します。 結論から説明すると、以下の指定を提案します。 body { overflow-wrap: anywhere; /* 収まらない場合に折り返す */ word-break: normal; /* 単語の分割はデフォルトに依存 */ line-break: strict; /* 禁則処理を厳格に適用 */ } この記事では上記の指定にいたった理由と、折り返しの理解について必要なoverflow-wrapとword-breakプロパティを中心に解説します。 overflow-wrap overflow-wrapは

2023/09/23に開催されたServerlessDays Tokyo 2023で登壇した資料です

はじめに こんにちは。株式会社Flatt Securityセキュリティエンジニアの梅内(@Sz4rny)です。 本稿では、弊社がこれまでに実施してきたFirebase診断の事例や筆者独自の調査をもとに、Firebaseを活用して開発されたサービスにおいて発生しやすい脆弱性の概要やそれにより引き起こされるリスクおよびその対策を深刻度や発生頻度の評価を踏まえつつお伝えします。本稿を通じて、Firebaseを活用したサービスにおいて発生しやすい脆弱性にはどのようなものがあるのか、また、そのような脆弱性を埋め込むことなくセキュアなサービス実装を実現するためにはどのような観点に気をつければよいのかについて理解を深めていただけますと幸いです。 なお、本稿では「Firebase活用時に限って発生しうる脆弱性(例:Firestoreのセキュリティルールにおけるバリデーション不備)」と「Firebaseを活

WebページのURLを入力するだけで、編集可能なFigmaデザインに変換できる無料プラグインを紹介します。 AppleなどのWebページを1クリックで変換するのはもちろん、日本語のWebページでも問題なく動作しました。Webデザインの勉強用に、既存サイトをリニュアールする用にも便利ですね。 html.to.design -Figma URLを入力するだけでFigmaに変換 html.to.designの利用方法 html.to.designの使い方 URLを入力するだけでFigmaに変換 html.to.designは、URLを入力するだけでFigmaに変換できる無料のプラグインです。さまざまなWebページを編集可能なFigmaデザインに変換します。 すべてをゼロから作成することなく、別のWebサイトを使用して独自のデザインのインスピレーションを得られます。 既存のWebサイトをリデザイン

ネイティブアプリと同様の機能をウェブアプリに追加できる技術、それがProgressive Web Apps (PWA)です。iOSでも近年、徐々にPWAの機能が追加されています。これらの流れは、ユーザービリティに重きを置く昨今の潮流に即しているように感じます。 この発表では、PWAの現状とその可能性についてお話しします。 - PWAとは？ - PWAの歴史 - PWAを特徴づける機能（オフライン、ホーム画面に追加、プッシュ通知 、Progressive Enhancement） - iOSにおける対応状況 - PWAの成果事例 - PWAのこれから - PWA活用のフローチャート 弊社のAmbient Weavingのサイトはこちら https://ambientweaving.lab.zozo.jp/

はじめに 今回はゲーム感覚でプログラミングを学べるサービスを紹介します。 ゲームを通して学んだ知識をアウトプットできるサービス集を厳選したので、ぜひ学んだ知識を「使える技術」として自分のものにしていただければと思います。 この記事の主な対象者 プログラミング初心者~中級者 基礎文法は学んだけどアウトプットができていない人 フロントエンジニアを目指してる人 楽しみながらプログラミングを学びたい人 ぷよぷよプログラミング まずはじめに紹介するのは、SNSでも話題になった、ぷよぷよを開発しながらプログラミングを学ぶことができる「ぷよぷよプログラミング」です。 ぷよぷよプログラミングでは、人気ゲームぷよぷよを開発しながらHTMLやCSSやJavaScriptといったプログラミングをしていく中で基礎となる技術を学ぶことができます。 実際にアプリ開発をしながら学べるので、インプットとアウトプットが同時

文章を書く前にやることよい文章を書くには、実際に文章を書く前に、読者は誰か、どういう悩みを解決するのかを企画することが大切です。また、それを元にアウトラインを書いておきます。 このふたつを元に文章を書くことで、読みやすい開発ドキュメントにつながります。これについては、次の記事をご覧ください。 開発ドキュメントを書く前に決めるべき3つのこと【企画編】開発ドキュメントにおけるアウトラインの書き方開発ドキュメントの書き方企画とアウトラインの作成が終わったら、実際に文章を書いていきます。文章を書くときは、次の9つを意識して書きます。これだけで、読みやすさ、分かりやすさが大きく向上します。 一文を短く切る結論を先に述べる指示語を使わない主語を明確にする、述語との距離を近づけるひらく・閉じるを統一する再現条件を示す前提を揃える見出しや箇条書き、表などを適切に用いる読者に伝わる用語を使うひとつずつ説明し

学生に「ゴールデンウィーク中に観るといいアニメを教えてほしい」と頼まれ、アニメ評論家・藤津亮太は考えた。20歳のアニメファン向け「入門書」を編むべきではないか。この本を読むことで「日本でメジャー流通するアニメが、現在のような形になっている背景を知ることができる」ことを目標に、まずはタイトル選びに着手した。 過去の作品・歴史上の創作者にアクセスするには 先日、非常勤講師をやっている大学で学生から声をかけられた。ゴールデンウィーク中に観るといいアニメを教えてほしい、というのだ。観終わったら個人的に短いレポートを提出したいが見てもらえるか、という話とセットだったので、単に「おもしろいアニメを知りたい」というわけではない。むしろ「アニメというのものにもうちょっと迫りたい」という積極性の表れという感じだった。 そこで僕は、ちょっと迷ったのだけれど、今 敏監督の映画を観ることを勧めた。学生は見たことが

はじめに こんにちは。株式会社Flatt Securityセキュリティエンジニアの村上 @0x003f です。 本稿では、Webアプリケーション上で実装される「ログイン機能」の実装パターンをいくつか示し、その「仕様の中で起きうる脆弱性」とその対策について解説していきます。 「ログイン機能」はToB、ToC問わず多くのWebアプリケーションで実装されている機能で、XSSやSQL Injection、Session Fixationといったような典型的な脆弱性の観点については、なんらかの解説を見たことのある方も多いと思います。 しかし、「仕様の脆弱性」というのはあまり多く語られていない印象です。今回はそのようなタイプの脆弱性についての解説を行います。なお、IDaaSを用いずに自前でログイン機能を実装しているケースを複数パターン想定しています。 はじめに ログイン機能の仕様パターンとセキュリティ

ITエンジニアが投票した「ITエンジニア本大賞2022」ベスト10発表。「シェル・ワンライナー160本ノック」「モノリスからマイクロサービスへ」「恐れのない組織」など 「ITエンジニア本大賞」は、仕事の役に立った本、初学者におすすめの本、ずっと手元に置いておきたい本など、おすすめの本をITエンジニアがWeb投票で選ぶイベントです。 主催は翔泳社ですが、対象となる書籍は出版社を問わず技術書、ビジネス書全般となっています。刊行年も関係なく、これまで大賞に選出された書籍を除き、この1年を振り返っておすすめしたい書籍が対象となります。 今回発表されたのは技術書部門とビジネス書部門それぞれのベスト10です。現時点では50音順に並んでいます。 このなかから特に投票の多かった技術書3冊、ビジネス書3冊について、同社が2月17日と18日に開催する「Developers Summit 2021（デブサミ20

はじめに 「株式会社じげん Advent Calendar 2021」17日目を担当します、きあ（Chia）です。 エンジニアとしてプロダクトの開発・運用保守をしつつ、SEO・CROといったマーケティング施策の立案・分析も担当しております。 今回は、エンジニアとマーケティングの両方を担当している私から、「Google Search Console」（以下サーチコンソール）で、エンジニアが見ておくとサイトの改善効率が上がる機能を5つご紹介します。 このような方に向けた記事です 自社でWebサービスを開発・運用しているエンジニアの方 サーチコンソールにどのような機能があるか知らない方 基本的な機能の紹介、見ていく上での簡単なポイントの紹介となります。 普段からサーチコンソールを見る習慣がある方、またWebサービスの運用に関わっていない方にはあまり役立てないかもしれません。 用語について 記事中

初めてFargateを触ったので、運用保守の観点で構築時に設定しておいた方が良いポイントをまとめました。 デプロイの自動化と書いているのにデプロイの話薄めになってしまいました…。 こちらはJAWS-UG朝会 #28で発表したものになります。

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session.

みなさんこんにちは。@ryuzeeです。 言いたいことはタイトルに書いたとおりなのですが、2021年12月1日に、新刊『チームトポロジー 価値あるソフトウェアをすばやく届ける適応型組織設計』が発売になります。 チームトポロジー 価値あるソフトウェアをすばやく届ける適応型組織設計著者／訳者：マシュー・スケルトン、 マニュエル・パイス、 原田 騎郎、 永瀬 美穂、 吉羽 龍太郎出版社：日本能率協会マネジメントセンター発売日：2021-12-01単行本：280ページISBN-13：9784820729631ASIN：4820729632 原著はMatthew Skelton、Manuel Pais氏の『Team Topologies: Organizing Business and Technology Teams for Fast Flow』で、翻訳は株式会社アトラクタのアジャイルコーチ（いつ

あまり宣伝できていなかったのですが、監修していた『AWSコンテナ設計・構築[本格]入門』が2021年10月21日に発売されることになりました。AWSのJapan APN Ambassadorsである新井雅也さん（@msy78）と、同じくAPN AWS Top Engineersである馬勝淳史さん（@HorseVictory）の力作です。 AWSコンテナ設計・構築[本格]入門 作者:株式会社野村総合研究所,新井雅也,馬勝淳史SBクリエイティブAmazon ※ただし、ちゃんとした書影はまだない。 2021/10/04現在 AWSコンテナ設計・構築[本格]入門は、どんな本？ まず『AWSコンテナ設計・構築[本格]入門』とは、どんな本なのでしょうか？入門と言いつつ本格とも入っています。このあたり、出版社の悩みと意気込みが込められていると思います。通常、初心者向けの本だと入門となります。そして、中級

Scrum Fest Mikawa 2021の登壇資料です。 以下は資料内で引用している参考リンクです DPA https://qiita.com/viva_tweet_x/items/97e819c626979b78947a KPT http://objectclub.jp/download/files/pf/KPT_TIPS.pdf TimeLine https://developers.freee.co.jp/entry/timeline-is-a-good-retrospective-method 象、死んだ魚、嘔吐 https://no-kill-switch.ghost.io/elephants-dead-fish-vomit/ Start Stop Continue https://www.retrium.com/retrospective-techniques/start-

高さいっぱいに表示したい時、古くはheight: 100%;、そしてmin-height: 100%;で実装していたと思います。現在ではビューポートの単位min-height: 100vh;が使用できるようになりました。 しかし、iOSでは100vhを使用してもアドレスバーが表示されていると下がその分隠れて表示されてしまい、高さいっぱいになりません。JavaScriptを使用するというやり方もありますが、CSSのみで対応できるので、そのCSSを紹介します。 Chromeにも対応しています。