なんとなくで書かないで！HTML5を書く時に気にしてみたいタグごとのお約束 - Qiita
はじめに この記事は クラウドワークスアドベントカレンダー2019 16日目の記事です。 こんにちは！本日25回目の誕生日を迎えたアクセシビリティ向上隊長 みーたです。 昨日は同じチームの@yamanokuさんによる「みんなに知ってもらいたいデザインシステムのこと」でした。 文中で紹介されていた「悲劇的なデザイン」は私もオススメします:) 私は今回、普段みなさんがHTMLを書く時に、よく使うタグごとでちょっと気をつけてみてもらいたい！と思う点をまとめてみました。 初学者ではありますが、正しくHTMLを理解してもらいたいって気持ちがあるので、マサカリは怖くない程度に投げていただいて、みんなで知識を共有していきたいです。 👻 真冬の怪談 突然ですがちょっと怖い話を... 先日、とある画面を改修しようと思って、今どんな感じにスタイル当たってるんだろうと本番環境を見てみたんですよ。 カードタイプ
実務で使うかもしれない、最近JavaScriptで実装した5つの機能 - Qiita
この記事はJavaScript Advent Calendar 2019の6日目の記事です！ 1日遅れてしまってすみません… 最近、クライアントワークで実装した機能を紹介します。 機能としては大きいものではないですが、何回か同じような機能を実装しているので、意外と使うことはあるかもしれないやつをまとめました。 ライブラリやFWは使わずにPure JavaScriptで書いてます ES2015の書き方なので、そのままではIE11で動かない部分などがあります ラジオボタンの選択で活性・非活性が切り替わるセレクトボックス 選択した項目によって、さらに入力したり選択できるようにしたいというケースが結構あります。 See the Pen ラジオボタンで活性・非活性が切り替わるセレクトボックス by daichi (@kandai) on CodePen. これはセレクトボックスを非活性にしていますが
ふりかえりを拡張する「ふりかえりチートシート」 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに あなたのふりかえりを拡張するふりかえりチートシートを公開いたします！ この記事では、技術書典7以降配布している「ふりかえりチートシート」の説明を行います。 ふりかえりチートシートは、ふりかえりの手法84個とその特徴を網羅した一覧表です。下記画像はイメージです。 pdfはBoothで無料DLできます。 DLはコチラ => （DL版）ふりかえりチートシート ふりかえりチートシートとは ふりかえりの様々なシチュエーション（ひとり、チーム、プロジェクト、組織）で利用可能なふりかえりの手法をまとめたチートシートです。 ふりかえりの各手法
ようこそdotfilesの世界へ - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 少し前から話題になっているが、日本の労働生産性はG7で最も低いらしい。 日本生産性本部資料より https://www.jpc-net.jp/intl_comparison/intl_comparison_2018_press.pdf 日本は人口減少に突入していることもあって、「作業の効率化」や「自動化・省力化」をいうフレーズをあらゆる業種で聞くようになった。 ITエンジニアは、あらゆる職業の中でも最も効率化、自動化をして生産性を高められるといっても過言ではないだろう。プログラマの三大美徳(「怠惰」「短気」「傲慢」)にもあるよ
ブラウザレンダリングの仕組み - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 概要 webサービスを公開するにあたって必ず使われることになるのがブラウザです。ブラウザがユーザーにwebページを表示する仕組みを理解することで、フロントエンド開発に役立てたり、ページ表示までのレスポンスの改善などに役立てていきたいと思い、今回ブラウザのレンダリングの仕組みの基本事項についてまとめました。 レンダリングの流れ ユーザーがwebブラウザにURLを入力すると、ブラウザはURLを元に指定のサーバーにTCP/IPプロトコルに基づいてリクエストを送ります。その後サーバはクライアントに対してレスポンスします。以降のレスポンスとして受
自称IT企業があまりにITを使わずに嫌になって野に下った俺が紹介するWindowsの自動化の方法 - Qiita
はじめに コンピュータを使用した多くの操作は自動化することができます。 この技術は運用や試験工程で大きな力を発揮します。 自動化の技術は一般的なソフトウェア技術者が、ちょっと努力すれば普通に身につく能力であって、特別なものではありません。 ただ残念なことにこれらの技術はあまり知られておらず、活用されているとは言い難い現場も多いです。 ユーザー企業さんができないのはしょうがないですが、ITで飯を食べているはずの自称IT企業においても、自動化を拒否して手動で心をこめて作業をしてリソースを無駄にするケースを稀によく見かけます。 自動化の拒否が「余剰人員のための経済対策だよ！」という身もふたもない理由でないと信じて今回は、Windowsでの作業の自動化についてお話しようと思います。 自動化のテクニックの話をする前に Windowsの自動化のテクニックの話をする前にちょっと重要なことを先に述べておき
VPSサーバの比較(Lightsail,ConoHa,Vultr,DigitalOcean,UpCloud,Linode,LunaNode) - Qiita
経緯 これまでDigitalOceanを使っていたのですが、 東京リージョンがないことなど微妙な不満が蓄積していたこともあり、 少し手を広げて調べなおしてみました。 選考基準は次のとおり。 時間単位での課金があること ストレージ領域がSSDであること 外部ストレージが別に作成可能なこと APIアクセスができること コマンドツールが存在すること 調査対象にしたVPSサービス ConoHa Amazon Lightsail Vultr DigitalOcean UpCloud Linode LunaNode 各VPSサービスの特徴と概要 ConoHa 国内サービスなので日本語でのサポートが受けられる :-) 学生・教職員向けにプリペイドカードの割引がある 適用サーバを付替可能な長期割引「VPS割引きっぷ」がある 誕生月に500円分のクーポンがもらえる 外部ストレージとしてオブジェクトストレージ
[あるある]「詰まったら、すぐに質問してください」の克服法 - Qiita
はじめに 「詰まったら、すぐに質問してください！」 こう上司やPM、先輩エンジニアの方から言われたことありませんか？ これを言われるのはおそらく初学者の方だと思いますが、以下のような経験はありませんか？ わからないことが発生した！ 「すぐに」質問してと言っていたので、文意のまま即座に質問した・・・ ( ﾟдﾟ) <「少しは自分で調べたのか！」1 と一蹴！！！チーン(´・ω・｀) （すぐ質問してって言ってたのに・・・(´；ω；｀)） 自分で調べれば良いのか、ふむふむ。。。 わからないことが発生した！ 自分で限界まで考えて調べてみても、まだわからない・・・ （数時間経過後）恐る恐る質問した・・・ ( ﾟдﾟ) <**「最初のうちは考えても仕方ないこともあるから、すぐに質問して！」**と一蹴！！！チーン(´・ω・｀) 「いったいどうしたらいいんだぁぁぁぁぁぁぁぁああああああああ！！！！！！！！」
![[あるある]「詰まったら、すぐに質問してください」の克服法 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/3ed1cd4e8ca5db099bb713e64f972962161b8717/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFwLW5vcnRoZWFzdC0xLmFtYXpvbmF3cy5jb20lMkYwJTJGMzA2MTYxJTJGcHJvZmlsZS1pbWFnZXMlMkYxNjQyMTQxNjE5P2l4bGliPXJiLTQuMC4wJmFyPTElM0ExJmZpdD1jcm9wJm1hc2s9ZWxsaXBzZSZiZz1GRkZGRkYmZm09cG5nMzImcz1mY2VkZjNjMDczMmI2MmM0NjZmZjllZDY2MmMzYmM1MA%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253Ddcb8b7bc073831c5f7569c51760e9ec3%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9JTVCJUUzJTgxJTgyJUUzJTgyJThCJUUzJTgxJTgyJUUzJTgyJThCJTVEJUUzJTgwJThDJUU4JUE5JUIwJUUzJTgxJUJFJUUzJTgxJUEzJUUzJTgxJTlGJUUzJTgyJTg5JUUzJTgwJTgxJUUzJTgxJTk5JUUzJTgxJTkwJUUzJTgxJUFCJUU4JUIzJUFBJUU1JTk1JThGJUUzJTgxJTk3JUUzJTgxJUE2JUUzJTgxJThGJUUzJTgxJUEwJUUzJTgxJTk1JUUzJTgxJTg0JUUzJTgwJThEJUUzJTgxJUFFJUU1JTg1JThCJUU2JTlDJThEJUU2JUIzJTk1JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LXBhZD0wJnM9ZmMyNjRiYmMwM2QxMjZjODRkZGM5NzE5OTQwMWMyM2M%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBkZXYtdGF0c3V5YSZ0eHQtY29sb3I9JTIzMUUyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1wYWQ9MCZzPWMzMjZjN2I5NzFiYzI3MzMyMWJmOWFkNjJiMDhjYzZh%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3Dbe5e9ba58b48246a17a5dc789ee3c747)
Node.js(TypeScript)を食わず嫌いしてる人にオススメするときに役立ちそうな知見まとめ - Qiita
もともとは動的なWebサイト開発のために仕方なく(※もちろん人による)書かされていた感のあるJavaScriptですが、ES6以降の進化はめざましく、表現力の高さは他の言語に全く引けを取らないようになりました。 V8エンジンによるパフォーマンスの恩恵も相まって、私はWeb用途以外にもちょっとしたスクリプトを書く時などにも積極的にNode.jsを活用しています。 一方でかつてのJavaScriptのイメージから食わず嫌い的に避けてしまったり、そもそもJSや周辺エコシステムの進化に関心がない人も多く見られます。 そこで今回は「どうすればNode.jsの敷居を低くして、便利さを知ってもらえるか」の観点から役立ちそうな知見をまとめてみました。 動的型付けなのにかなり早い 詳しくは各ベンチマークの結果を見ていただければ分かりますが、Node.jsは動的型付け言語としてはかなり実行速度が早い部類に入り
これで完璧！今さら振り返る CSRF 対策と同一オリジンポリシーの基礎 - Qiita
✎ 基礎知識編 CSRF とは何か？ CSRF (Cross-Site Request Forgeries) を意訳すると 「サイトを跨ぐ偽造リクエスト送信」 です。 簡単に言うと，罠サイトを踏んだ結果，自分が無関係な別のサイト上で勝手にアクションをさせられる攻撃です。具体的には，ネットサーフィンをしているうちに知らない間に自分のIPアドレスから掲示板に犯罪予告が書かれていた，といった被害を受けます。 この攻撃を防ぐ責任は「無関係な別のサイト（具体例では掲示板）」側にあります。Web サイト作成者には，利用者が意図しない操作を勝手に実行されないように，利用者を守る責任があります。 また上図からも分かる通り，この攻撃の最大の特徴はアカウントがハッキングされたというわけではないということです。ログイン状態の利用者のWebブラウザを利用して攻撃が行われている，というのが重要です。 オリジンとは何
Java のバージョンを上げるだけで、プログラムは速くなるのか - Qiita
（この記事は 地平線に行く とのマルチポストです） よく Java の実行バージョンを上げるだけで速くなるという話を聞きます。 でも、本当にそうなのでしょうか。また、本当だとしたらどれぐらい速くなるのでしょうか。 そこで、簡単なプログラムで実験してみました。 実験概要 実験用に、数独を解く Java のプログラムを作成しました。 このプログラムは単純な演算を繰り返し行ってるだけなので、Webアプリケーションのような複雑なプログラムとはおそらく傾向が違いますが、参考程度にはなるかなと思います。 これをJava 1.1 でコンパイルし、Java 1.1 ～ 12 の各 Oracle JDK (32bit/64bit) で**数独100万問のデータセットを読み込んで解き終わるまでの時間を測定しました。1** 細かい測定条件は以下の通り。 実行環境 Windwos 10 Home 1809 (64
127.0.0.1に名前解決するループバックドメインloopback.jpを作った - Qiita
osxでプロダクションに限りなく近い開発環境を準備するのコメントでlvh.meのことを知った。 lvh.meというループバックドメイン localhost以外のドメインやサブドメインでのテストをしたいとき、/etc/hostsに書いたりローカルにDNSサーバーを立てる方法があるが、普通のドメインを127.0.0.1に解決させてしまえば確かにお手軽だ。 仕組みも簡単なので自分用に作ることにした。 適当なドメインを用意し、トップレベルドメインloopback.jp.とワイルドカード*.loopback.jp.のAレコードに127.0.0.1を指定する。 以下のいずれも127.0.0.1に名前解決される。 loopback.jp www.loopback.jp sub.domain.loopback.jp 例えばサブドメインで言語を設定するサイトを作っているとする。 うんお手軽！ 仕様 loop
P++: 銀河に平和をもたらすための奇策と決着 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? PHP 8から、PHPは「PHP」と「P++」という2つの言語を提供するようになる というキャッチーな紹介をするP++: 静的型付けをめざすPHPという記事がそれなりに話題になり、このニュースは目覚しく革新的な内容で、多くのひとの目を引き付けました。 これは早まった理解であり、ほとんど誤報と言ってもいい内容でした。2019年8月15日には提案者本人も、少くとも「P++」の計画を短期的に実現するととは非現実的であり時期尚早であることを認めています。 この記事では、PHP開発の現状、なぜ野心的なP++計画が提案され、事実上撤回されたかの経緯
レンタルサーバとSSL/TLS - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? こんにちわ、TenForward こと加藤です。 この記事は ファーストサーバ Advent Calendar 2016 7 日目の記事となります。 レンタルサーバに限らず、各種サーバでセキュリティのために SSL/TLS を使用する場合は、安全に暗号通信が行われる必要があるので、安全な設定をする必要があります。 SSL/TLS には色々なバージョンがありますが、プロトコル自体に含まれる脆弱性のため、最近では SSLv2 や SSLv3 は無効にする必要があります。 しかし、脆弱なバージョンを使わないだけでは、SSL/TLS を使った通
sourceコマンドを誤って使ってしまいゾッとした話 - Qiita
「公開鍵を上書きするかどうか？」とか出てきて、 n として回避した後、今は無くなっているレポジトリから git clone しようとしたところで、アカウント確認のために処理が止まり、そこで、 Ctrl + c で強制終了できました。 解説 source コマンドは、ファイルに書かれたコマンドを現在のシェルで実行するコマンドです よって、私がミスして実行してしまった処理の内容は、 .zsh_history にファイルに書かれたコマンドが1行ずつ実行する。という内容になります。 .zsh_history には私が過去に打ったコマンドがすべて記録されているため、つまり、それらのコマンドが順に実行されていくということになってしまいます。 処理の途中で「公開鍵を上書きするかどうか？」を聞かれたのは、過去に公開鍵を作成するコマンドを実行し、それが .zsh_history に記載されていたためです。
UserAgentからOS/ブラウザなどの調べかたのまとめ - Qiita
WEBサイトにアクセスしてくる利用者の情報をUserAgentから調べることが出来るが、どんな情報がわかるか調べてみた。より詳しい情報は参考に使ったサイトを参照で。 はじめに GoogleがChromeにおいてユーザーエージェント文字列を段階的に廃止することを発表しています。 段階的にUserAgentが削除版UA文字列に置き換わっていきChrome 113で完全に削減版の UA 文字列となってしまいます。 削除版のUA文字列は以下の通りです。 User-Agent Reduction # Desktop (user on Windows 8.1, for example) # 旧 UA文字列 Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/93.0.1234.56
全部言えたらDOMマスター！ HTML+DOMでノードを挿入する方法大全 - Qiita
DOMはHTMLの木構造(あとXMLも）やイベント等をプログラムから操作するためのAPIです。DOMの実装者として有力なのがウェブブラウザであり、ブラウザが提供するDOMのAPIを用いてJavaScriptプログラムからウェブページを制御するというのがDOMの極めてメジャーな使い道です。 近年知名度を増してきたReactやVueなどのライブラリも、もちろんこのDOMを用いて実装されています（Reactだとreact-domというあからさまな名前のパッケージがDOMを扱う部分を担当しています）。 この記事では、DOMで提供されるAPIを用いて木構造にノードを挿入する方法全38種類を列挙します。 ノードの挿入とは DOMにおいて基本的な操作のひとつがノードの挿入です。ノードというのは木構造の最小構成単位であり、要素ノードやテキストノードなどの種類があります。例えば<u>は</u>というのはu要
Windowsではページング ファイルのことを「仮想メモリ」と呼ぶ？件 - Qiita
「仮想メモリ」はページング ファイルじゃない ずーっと昔から気になっていたんですが、世の中でどう思われているのか気になったので書いてみます。 Wikipedia の仮想記憶というエントリからちょっと引用。 「仮想記憶」という用語は「メモリスワッピング」と混同されることが多い。これはWindows系のオペレーティングシステム (OS) がメモリスワッピングの可 / 不可を設定する項目を "virtual memory" と称していることも一因と考えられる。実際、Windowsはその "virtual memory" を不可としても、ページング方式と仮想記憶を使用している[1][2][3]。Windows XP日本語版では、"システムのプロパティ"→"詳細設定"→"パフォーマンスオプション"→"仮想メモリ"のことである。 実際、Windows に関して話している中で「仮想メモリ」という単語が出
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ES6の構文じゃなくて、あえてそれ以前のJavaScriptの基礎を押さえる - Qiita
JavaScriptでゼロ埋め処理 - Qiita
