Table内の3点リーダーってどういう仕組み？max-width: 0ってﾄﾞﾕｺﾄ？ - Qiita
3点リーダーとは 3点リーダー（省略記号）とは、テキストが長くてボックスの領域を超えてしまう場合に「...」でテキストを省略表示する手法です。 3点リーダーを実装するために必要な4つの設定 1、ボックスのwidthの指定 テキストが表示される領域の幅を指定します。 2、white-space: nowrap; テキストの改行を禁止し、1行で表示します。 3、overflow: hidden; テキストが表示される領域の幅を超えた場合、その超えた部分を隠します。 4、text-overflow: ellipsis; 非表示の溢れた部分を3点リーダー（...）で表示します。 See the Pen Untitled by kidorina (@kidorina) on CodePen. 簡単に長いテキストを省略することができます。 Table内での3点リーダーの挙動 Table内で3点リーダー
DMARC「p=reject」 設定後の変化 - Qiita
はじめに DMARCポリシーをp=rejectに変更しました。DMARCに取り組もうとしたきっかけや、取組の経緯は、以下のブログに書いてます。 DMARCとは そもそもDMARCとはって話はいろいろな人がいろいろな記事をあげてくれているので割愛します。このへんの記事や、Youtubeがわかりやすいです。 DMARC「p=reject」設定後の変化 DMARCは認証されていないor認証が不十分なメールを受信側のメールサーバーで検疫or削除してもらうことができる設定です。ポリシーをquarantine （検疫）以上にしておけば、非正規なメールが送信先ユーザーのメールボックスに届きにくくなります。 弊テナントではDMARCポリシーを設定する前は、弊社ドメインになりすましたと思われるメールが 1日10,000通前後 送信されていることが観測されていました。 それが、DMARCポリシーをp=quar
display:contents;って何？どんな時に使うと便利なの？ - Qiita
先日、display:contents;というプロパティをはじめて知りました。 他のdisplayシリーズと比べるとあまり馴染みがなかったので、今回はdisplay:contents;とは何か、どんな場面で使えるのかについて紹介します。 1. 結論 display:contents;を指定した要素は、あたかも存在しないかのように扱うことができる これにより、グリッドレイアウトやレスポンシブデザインを作成する際に便利に活用できる ただし、アクセシビリティに課題が残るため、慎重に使用する必要がある 2. display:contents; とは？ 2-1. display:contents;の概要 display:contents;を指定した要素は、存在しないかのように扱われ、指定した要素の子要素が直接親要素内に挿入されます。 Mdn Web Docsでは以下のように説明されています。 これら
DMMのGo言語5daysインターンが最高すぎた！ - Qiita
初めて企業のインターンに参加しました。DMMさんのGo言語5daysのインターンです。今回はこのインターンの内容、またGo言語でのAPI開発で学んだTipsを中心に記事を書きます。 温かい目で見てくださると嬉しいです。記事の内容に誤りがあった場合は、いつでもご指摘ください 🙇♂️ インターン概要 今回のインターンは8月5日から8月9日の5日間にわたって行われました。最終日はオフィス開催で、4日間はオンラインでの開催でした。 初日と2日目は主にライブラリの使い方を学び、残りの3日間はハンズオン でAPIのエンドポイントを実装しました。このインターンの教材はDMMさんの新卒バックエンド研修の課題として使用されているため、難易度はとても高かったです。 私はGo言語を使用した経験がありますが、本で独学という勉強の仕方だったので、少し古い情報で学んでいたこともあり、 今回最近のバージョンに追加さ
ソースコード管理の進化：Excel管理からGitHubまで、エンジニアの戦いを振り返る！ - Qiita
ソースコード管理の進化：Excel管理からGitHubまで、エンジニアの戦いを振り返る！ プロローグ 先日、弊社のとある案件内での会話です。 熟練エンジニア（以降「熟練」と表記）：GitHubのプルリクが来てたからコードレビューしておいたよ。 若手エンジニア（以降「若手」と表記）：ありがとうございます。助かります。 熟練：他の人のコードにも指摘した内容がキミのコードにもあったので指摘しておいた。他の人のプルリクは見ていないの？ 若手：いや、他の人のプルリクは見てないですね。。 必要ですかね・・？ 熟練：必要だよ。昔はそういうのやりたくてもできなかったんだから！ 若手：（はじまった、熟練さんの昔語り・・。長いんだよなぁ。。）なるほど！そうなんですね。他の人のコード読んで勉強します！ はじめに 皆さん、こんにちは。エンジニア歴約20年目の立脇です。今日は、エンジニアにとって切っても切り離せない
Python理事会が古参開発者を追い出して開発者コミュニティが騒動に - Qiita
どういうわけか日本では一切話題に上がっていないのですが、Pythonの開発者コミュニティでなんか問題が起きているようです。 どうも話が様々なスレッドにとっ散らかっているうえに半分はDiscordや非公開のところで動いているみたいなので、読み取れていないところが色々あるかもしれません。 誰かが補足してくれるはず。 Proposed bylaws changes to improve our membership experience 最初のきっかけはこのスレッドです。 これは規約の一部を変更する提案であり、その中でも3番目の提案であるAdds provision to remove Members by vote of the Board of Directorsという変更が注目を浴びました。 Python財団にはフェローという制度があり、これはPythonエコシステムやコミュニティに優れた
3 台の Raspberry Pi で始める自宅 Kubernetes クラスタの構築 - Qiita
はじめに 最近 Raspberry Pi を3台購入し、自宅に Kubernetes クラスタを構築しました。 この記事ではその体験記を共有します。 また、自宅 k8s を構築する際に参考になる記事になる事も目指しています。 モチベーション 仕事で GCP 上で Kubernetes を使ったので、個人で Kubernetes クラスタを構築してさらに学習を深めたいと思いました。 実務ではクラウドサービスを使いますが、維持費が高額です。一日システムを立ち上げておくだけで数千円、一ヶ月では数万円かかってしまいます。 minikube などを用いてローカル環境で Kubernetes を動かすこともできますが、シミュレーター上の動作になってしまうので、どうせなら実際の環境に近いものを構築したいと思いました。 そこで、Raspberry Pi を用いることで、実際の環境に近い学習環境を構築してみ
Tomcat7は壊れていて、複数のレスポンスが混じる - Qiita
「これってもしかして・・・」 「私たちのレスポンス・・・」 「入れ替わってる〜！？」 Tomcat 7 の EOL は2021年3月31日までです。 2020年4月現在、あと1年を切りました。私のまわりでは Tomcat 7 つまり Servlet 3.0 向けに書かれたアプリケーションは未だ現役で、そろそろ本気を出してマイグレーションに取り組まなければいけません。 本気を出すためにも、Tomcat 7 でおきたセッション管理に関する怖い話を書いておきます。 レスポンスが混じる！ 結論からいいますと、Tomcat 7 は最新の 7.0.103 であっても、大量のトラフィックを捌く環境において、AJP Connectorを使用してほぼ同時に処理している複数のリクエストのレスポンスが混ざってクライアントに送信されることがあります。 これが何を意味するかというと、あるユーザーに対して送信した S
S3とGitHub Actionsを使った静的Webサイトのデプロイは思ったよりも簡単だった！ - Qiita
こんにちは！この記事は、私が初めてAWSのS3とGitHub Actionsを使って静的Webサイトをデプロイした時の備忘録です。今回はAstroを使ってWeb作成をしてみました。結論から言うと、S3を使ったCICDは想像以上に簡単でした。ここでは、私が行った手順を説明していきます。 前提条件 このガイドを進める前に、以下のツールとアカウントが必要です： コマンドラインインターフェース（CLI）の基本的な操作スキル Git（バージョン管理システム） AWS CLI（インストール済み） AWSアカウント GitHubアカウント Node.js（プロジェクトに応じたバージョン） 静的サイトジェネレーター（例：Astro）の基本知識 ※ フレームワークは使いたいのを使ってください。 上記の準備ができていることを確認してから、以下の手順に進んでください。 AWSとGitHubを使用した静的Webサ
SVGの色が変わらない？CSSで色を操作する方法 - Qiita
はじめに こんにちは。HRBrainでオウンドメディア・ランディングページの開発を担当している渡邉です。 先日、SVGの色をCSSで変更しようとした際に、なかなか色が変わらなくて困ってしまいました。 この記事では、SVGの色がCSSで変更できない場合の原因と、2つの解決策をわかりやすく解説します。 SVGの色を変更できない原因 fill属性に直接色が指定されていると、その色が固定されてしまい、CSSのcolorプロパティによる変更が適用されなくなります。 <div class="parent"> <svg> <rect width="100" height="100" fill="#000" /> </svg> </div> <style> .parent { color: red; // 効きません } </style> See the Pen svg_fill_bad by Tasuk
ExcelでCSVファイルを「0落ち」や「文字化け」なしで開く方法 - Qiita
はじめに CSVファイルをExcelで開こうとしたとき、電話番号や郵便番号の先頭のゼロ（0）が自動的に消えてしまったり、文字化けしてしまう...。そんな悩みをお持ちの方はいませんか？この記事では、データを正確に保持しながらCSVファイルを開く方法を簡潔にご紹介します。 1.CSVファイルとは そもそもCSVファイルって何？というところから説明します。 CSVはComma Separated Value（カンマで区切られた値）の略であり、CSVファイルはテキストデータの各項目を、カンマ（,）で区切って表現したファイルです。 言葉では理解しにくいので、画像で見てみましょう。 まず、こちらがExcelでCSVファイルを開いたときの画像です。 普段、Excelでデータを作成・編集しているときと同じように見えますよね？CSVといっても、特に変わったことはなさそうです。 では、Windowsの「メモ帳
可読性の高いコードを書くための実践ガイド - Qiita
はじめに ソフトウェア開発において、コードの可読性はプロジェクトの成功に直結する重要な要素です。読みやすいコードは、メンテナンスや拡張を容易にし、チーム全体の生産性を向上させます。 しかし、「読みやすいコード」 の定義は人によって異なります。個々のスタイルや好みによって解釈が分かれることもあるでしょう。それでも、できる限り多くの人にとって理解しやすいコードを書くことが、プロフェッショナルとしての責任です。このガイドでは、そんな読みやすさを意識した具体的なテクニックなどを紹介していきます。「もう知ってるよ！」と思った方も、今一度できているかを確認してみてください。 弊社Nucoでは、他にも様々なお役立ち記事を公開しています。よかったら、Organizationのページも覗いてみてください。 また、Nucoでは一緒に働く仲間も募集しています！興味をお持ちいただける方は、こちらまで。 注意点 こ
「スタンダップミーティングは役に立たない」 - Qiita
というタイトルの面白そうなポエムを見つけた。「デイリースタンドアップミーティング（デイリースクラムとして知られている）は、次のようなやり方で行われると無駄になる。」というもの。 全員がTrelloやAsana、JIRAのボードを見つめ、PjMやTechLeadが各チームメンバーに作業中のチケットに関する質問を投げかけ、以下のような会話が起こります。 (PjM) ジョン、チケットXYZの進捗状況はどうですか？ (John) いい感じですよ。あれもやったし、これもやったし、ほとんど終わったよ。あとは最後の仕上げで、コードを磨いて、いくつかテストを追加するだけだ。今日中に完成させなければなりません。 (PjM) 素晴らしい、次に進みましょう。マリアさん、あなたのチケットの状況はどうなっていますか？ (Maria) ボブが私のプルリクエストをレビューしているので、コメントがない限り、私はこれで終わ
Web系エンジニア最低限入れておくべき Chrome 拡張機能３選 - Qiita
概要 Web ブラウザではすっかりお馴染みの Google Chrome ですが、開発者ツール（DevTools）だけでなく、拡張機能にも導入すると非常に便利なものがたくさんあります。 その中でも、Web系の開発をするエンジニアなら、是非入れておきたいオススメの Google Chrome 拡張機能について紹介します。 尚、いずれも無料で利用可能です。 IT エンジニア界隈では、既にどれも有名なものばかりですが、これから Web 系の開発をする方は是非お試しください。 本当はもっとたくさんオススメしたい拡張機能がありますが、ひとまず今回は３つ紹介します。 Wappalyzer（ワッパライザー） 「Wappalyzer（ワッパライザー）」は、現在表示している Web ページで使われている技術（言語、フレームワーク、プラットフォーム、分析ツール、その他のサービス）を一覧表示してくれる拡張機能で
Slack社はSlackをどう使っているのか - Slack利用ガイドラインの話 - Qiita
GitLab社のGitLab Handbookと徹底した文書化、組織的なオープンネス（？）を先日調べたのだが、じゃあ同じように見える化、透明性をアピールしているツールが何か？と考えた際ににSlackがあると思っている。SlackといえばDM禁止！オープンな職場が良し！風通し良し！なやつである。 しかしそれを実際会社で根付かせようとした時に、Slackの使い方を説くだけでは足りなくて、むしろ皆の意識改革みたいなものが必要だな～とひしひし感じさせられる。オープンな会社が良いかクローズドが良いか、「チームの風通しは良いほうが良いのか？」 世の中ひねた人も居るもんで風通しだけ良くてもこんなデメリットが有るなんて言われる 意見は増えても、内容が浅い 意見の浅い深いを確認する手間がかかる 浅い意見でも対応しなければならない 多数派の浅い意見に流されがちになる https://factory-learn
5つの基本原則で実現する、ユーザビリティの高い画面設計 - Qiita
はじめに：なぜ今、ユーザビリティが重要なのか？ みなさん、こんにちは。日々Figmaと格闘しながら画面設計に励むイェンです。 「使いやすい」と言われるアプリやWebサイト。実は、その裏には綿密に計算された設計があるんです。今回は、私が実際のプロジェクトで学んだ、ユーザビリティを向上させるための5つの鉄則をご紹介します。 これらの鉄則を押さえておけば、ユーザーから「使いやすい！」と絶賛されるデザインが、きっと作れるはずです。さあ、一緒に探検してみましょう！ 【1】 シンプルイズベスト：余計なものは思い切って削ろう ユーザーが迷わず操作できる画面を作るには、シンプルさが鍵となります。 ・不要な要素を削除し、本当に必要な情報だけを表示する ・情報の優先順位を明確にし、重要な要素を目立たせる 具体例： ナビゲーションメニューは5-7項目に絞り、よく使う機能をトップレベルに配置します。 Figmaで
クレジットカード決済の実装方法 - Qiita
ブランドに合ったクレジットカードフィールドを追加することで、カスタマイズされたチェックアウト体験を提供します。 カスタマイズされたカードフォームが必要な場合は、高度なクレジットカードおよびデビットカード決済を統合してください。カスタマイズにこだわらず、より迅速な決済手段をお探しの場合は、ベーシックなクレジットカードおよびデビットカード決済の設定をご覧ください。 PayPalアカウント登録・API認証情報取得 PayPalアカウント登録・API認証情報取得 アドバンストクレジットカード決済実装方法 ご利用には審査があります。お問い合わせはこちら。 カスタマイズされたカードフォームが必要な場合は、高度なクレジットカードおよびデビットカード決済を統合してください。カスタマイズにこだわらず、より迅速な決済手段をお探しの場合は、ベーシックなクレジットカードおよびデビットカード決済の設定をご覧ください
Ubuntuインストールしたら行う初期設定チートシート - Qiita
UbuntuをPCにクリーンインストールするのはいいが、 最初は、ほぼ何もソフトが入っていない状態（それがいいのだが） だから、何かしらのセットアップは行いたい。 ただ、普段Macとかに慣れていると、 久しぶりにUbuntuとかを触ると、 何をすればいいか忘れる... なので、本記事ではUbuntuを入れたら 最低限設定したいことをまとめようと思う。 CapsLockの無効化してCtrlキーにする さて、毎度のことですが、宇宙一使いみちがわからないCapsLockを 無効化する作業をしようと思います。 あと、もともとMacのキー配列に慣れてしまった私は、 無変換キーと変換キーの存在意義もよくわからないので、 Ctrlあたりに変えたいと思います。 まずは、各キーのキーコードを調べたいので、
2024年最新版：Pythonデータ解析ライブラリ総まとめ - 実践的ガイド - Qiita
はじめに Pythonのデータ解析エコシステムは日々進化を続けています。2024年現在、効率的なデータ処理、直感的な可視化、高度な機械学習の自動化など、様々な新しいツールが登場しています。本記事では、最新のPythonデータ解析ライブラリを紹介し、それぞれの特徴や使用例、実際のユースケース、そして導入方法まで詳しく解説します。 1. データ操作ライブラリ 1.1 Polars: 高速データ処理の新標準 Polarsは、Rustで実装された高速なデータ操作ライブラリです。pandasに似たAPIを持ちながら、大規模データセットでより高速に動作します。 特徴: 高速な処理速度 メモリ効率が良い pandasに似たAPI 使用例: import pandas as pd # サンプルデータを作成 data = { "age": [25, 32, 28, 35, 40, 50], "categor
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript｜importの書き方が多いのでまとめてみた - Qiita
