display:none と visibility:hidden の違い - Qiita
visibility:hiddenは名前の通り、要素はあるけど見えない状態。 display:noneは、要素も取得されず、完全にその場にない扱い。 検証準備 html <!doctype html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>difference between visibility hidden and display none</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="one" class="box"></div> <div id="two" class="box"> <h3>Visibility:hidden</h3> エレメント描画されず。けど、表示エリアは「残る」。背景色で塗りつぶした感
【実録】WordPressサイトをAWS+Laravel+Nuxtにフルリプレイスした話 - Qiita
概要 創業2期目のスタートアップ株式会社NoSchoolにて、WordPressで開発された自社サービスを、2ヶ月掛けてAWS+Laravel+Nuxt.jsにフルリプレイスした際の技術選定について書きます。 対象読者 Laravelを使ってみたい/使えるライブラリを一通り知りたい AWS構築の全体感を知りたい Nuxt.jsやVuetifyの使用感を知りたい WordPressを脱却したい 技術選定の背景 技術選定と言っても好きな技術を選べばいいというわけではありません。自社が持っている技術力、事業の状況によるところが大きいため、まずは背景としてそのあたりを説明していきます。 先に技術が気になる方はここは読み飛ばして、あとで戻ってきてください ①自社の技術力 CTO @mejileben NoSchoolは創業2期目で2019年6月現在、フルタイムメンバーが僕と社長しかいません。 そして
常時SSL化のする為の資料 - Qiita
Googleの「常時SSL」の推奨とか、Let'sEncryptの発足とか、 常時httpsページ化に対する波が来ているので、 提案する為の材料とか、メリットデメリットとか、対応方法とかまとめてみた。 常時SSLとは 常時SSLとはウェブサイトの全てのページをHTTPS化するセキュリティ手法。多くの大手サイトの対応が増えている（FacebookやTwitter、YouTube、Netflix等）。 httpsに対応していれば、そのサイトが偽物の場合は警告がでるし、通信が暗号化される。 参考サイト * 常時SSL * 「HTTP」前提が崩れる――早く「常時SSL」にすべき理由 * Webサイト全体HTTPS化（常時SSL）の流れはもう止まらない 世の中の状況、やった方がいいわけ https通信により通信が暗号化される SSL対応によりhttps通信で通信が暗号化される。従来は個人情報を含むペ
AWS サービスがどこにあるのかまとめ - Qiita
AWS 上のセキュリティや NW 構成を考えるにあたって、どのサービスがどこにあるのか、AZ サービスなのか、リージョンサービスなのか を考える機会が多く、自分の頭の整理のため簡単にまとめます。 まとめた図 サービスの「場所」を表現する為の図です、全エッセンスを入れるとゴチャゴチャするので、一部省略しています。 説明 代表的なもの以外（というか個人的に普段使わないもの）は入れてなかったりします。サービスと呼んでいいのかわからないものも混ぜ込みました。 AZ サービス Subnet サブネット単位で必要となる NAT Gateway / NACL も AZ サービス EC2 AZ単位で設定する EBS / Placement Group も AZ サービス RDS ELB 1 ElasticCache Redshift リージョンサービス VPC VPC毎に必要となる Security Gr
QAエンジニア - Qiita
概要 この数年 「QA(Quality Assurance)エンジニア職」 という職種が重要視されております。 所謂、品質保証です。 振り返ると2000年代は、求人自体も少なかった職種ですが、昨今はIndeedやスタンバイなどの求人情報専門の検索エンジンで 「QAエンジニア」 「テストエンジニア」 「品質管理エンジニア」 で検索すると大企業からスタートアップまで多くの掲載求人がヒット・掲載されています。 最近は、企画段階から 「QAエンジニア」 が参加し、プロダクトUI・UXの意見交換や、仕様書レビュー、テストフロー、プロダクトリリース判定基準、どのテストレベルを対象とするか策定する。 そのため、QA職種だからこの範囲（領域）だけという決まりはありません。 また、QA職種詳細については 「品質担当でも名称がいろいろ」 に記載しております。 「QAエンジニア」 って、そもそもどのような役割な
jQueryのパフォーマンスを下げるアンチパターンに関する超意訳 - Qiita
以下のスライドを意訳したものです。Compress周りについては触れていません。「いやいや、最新の書き方だともっと良い書き方があるんだよ！」という方のコメントをお待ちしております！ http://www.slideshare.net/paul.irish/perfcompression クエリをキャッシュする // 悪い例 var id = $("#content").data("id"); var itemId = $("#content").data("item-id"); // 良い例 var content = $("#content") var id = content.data("id"); var itemId = content.data("item-id"); // 悪い例 $.each(reallyLongArray, function(count, item) { v
set -u してるときに変数が未定義または空文字かチェックする for RHEL/CentOS 6 - Qiita
次のようにすると変数が定義されているかどうかチェックできます。 Bash - set -uしてるときに変数が定義されてるかチェックする - Qiita がしかし、この方法は RHEL/CentOS 6 では使えません、Bash のバージョン的な意味で。 RHEL/CentOS 6 では下記の記事のコメントにあるような方法で可能です。 ALL about Linux: bash でシェル変数が定義されているかを判定する方法は？ がしかし、大抵の場合「変数が未定義」よりも「変数が未定義または空文字」で条件分岐することの方が多いでしょう。 その場合は次のようにします。 ${VAL-} は変数 VAL が未定義なら、- 以降の文字を展開したものに置換されます。 - 以降になにもないので、要するに空文字に置換されます。 変数 VAL が空文字なら空文字のままなので、「変数が未定義、または、空文字」で
「設計なんて不要でしょ」について - Qiita
経緯 以前とある席で偶然シニアエンジニアの方と設計について議論することがありました。 その時に特に耳に残っていたのは以下の様な内容です。 クリーンアーキテクチャってテストしやすくする為のですよね？ 設計はコード書ける人が他のコードを書ける人に威張るための道具なのではないか？ 設計を学習するならブロックチェーンとかを勉強して技術力を高めるべきなのではないか？ リーダブルコードさえ読んでいれば設計は必要ないのではないか？ 設計なんて不要でしょ その方はかなり詳しく設計の歴史をしっていて尤もな事を言っていましたが、平成も終わる頃においてはその限りではないです。 なので平成最後の日にそれら全てに対して最終的に解答できる形で設計の有用性を説明し、気持ちよく令和を迎えます。 注意: 一応ここで説明する内容や要素も一面だけです。 よくある誤解 クリーンアーキテクチャといえばこの有名なリングですよね。 こ
HTML5ゲームエンジンの徹底評価[日本語訳] (1) 2D・3D対応とプログラミング言語の比較 - Qiita
李海彬@Golang Language Community(Golang语言社区)によるHTML5ゲームエンジンの徹底評価 @ cloud.tencent.com の日本語訳です。 李さんより許可をいたただいています。またこちらは昨年末の記事になるので今年誰か書かないかな？ 最近インターネット上で「イケてるHTML5ゲームエンジン15 2016年盤」という記事を読みました。HTML5ゲームを開発のソリューションはたくさんありますが、比較されていませんでした。みなさんのお役にたてるように数日かけて、先ほどの記事に登場した12の無料オープンソースエンジンの比較分析を徹底的に行いました。 技術的な製品を比較するためには、技術的な視点だけでなく、結果に影響を与える多くの非技術的な内容も含めて、一般的には複数の比較軸があります。この記事では次のような軸で比較しています。する複数の次元があります。この
![HTML5ゲームエンジンの徹底評価[日本語訳] (1) 2D・3D対応とプログラミング言語の比較 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/38c4d455ed41fb8a5b6623baee9f8cfc0b2a1b13/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9SFRNTDUlRTMlODIlQjIlRTMlODMlQkMlRTMlODMlQTAlRTMlODIlQTglRTMlODMlQjMlRTMlODIlQjglRTMlODMlQjMlRTMlODElQUUlRTUlQkUlQjklRTUlQkElOTUlRTglQTklOTUlRTQlQkUlQTElNUIlRTYlOTclQTUlRTYlOUMlQUMlRTglQUElOUUlRTglQTglQjMlNUQlMjAlMjgxJTI5JTIwMkQlRTMlODMlQkIzRCVFNSVBRiVCRSVFNSVCRiU5QyVFMyU4MSVBOCVFMyU4MyU5NyVFMyU4MyVBRCVFMyU4MiVCMCVFMyU4MyVBOSVFMyU4MyU5RiVFMyU4MyVCMyVFMyU4MiVCMCVFOCVBOCU4MCVFOCVBQSU5RSVFMyU4MSVBRSVFNiVBRiU5NCVFOCVCQyU4MyZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1jbGlwPWVsbGlwc2lzJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9YzU2ZTc4ZTRlYTBlMTE3YWQ3MzhkNWYwOTFhZDczYmQ%26mark-x%3D142%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTYxNiZ0eHQ9JTQwbW90b3lhc3UteWFtYWRhJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz0wMWQ2ZjI4ZThhN2VhOTgyMDM0MzFlZmM1N2NiM2U1NA%26blend-x%3D142%26blend-y%3D491%26blend-mode%3Dnormal%26s%3D41d0fefa3d8afa1c725de521ef4d44de)
2018年のフロントエンドエンジニアならこの程度は知ってて当然だよな？ - Qiita
可及的速やかにReactが絶滅しますように。 以下はFront-End Developer Handbook 2018の第三部、Front-end Developer Toolsからリンクされているツールと、その簡単な紹介です。 ドキュメントツール 開発者向けドキュメント、APIリファレンス Dash 200以上のAPIリファレンス、100以上のチートシートを一括ダウンロードできる。有料、Mac用。 DevDocs 200以上のライブラリをオンラインで検索できる。無料。 Velocity 中身はDashと同じ。有料、Windows用。 Zeal Windows、Linux、MacOS用各種揃っている無料のオフラインドキュメント。 チートシート devhints.io JavaScript、CSS、Go、vim等のショートカット、書式などチートシート。字が薄くて見辛い。 SEOツール Key
SeleniumのWeb Driverで要素が無いことを確認する方法 - Qiita
driver.findElementを使うと要素が無い場合NoSuchElementExceptionが発生してしまい、 テストに失敗する。 要素が無いことを確認するにはdriver.findElements(最後にsが付いている方)を使い、 サイズが0であることを確認する。 ただ、なぜか実行に時間がかかる、、、 @Test public void test_1030() throws Exception { driver.get("http://localhost:8080/test/"); // 開く // HTML上にtestCssというスタイルの要素が無いことを確認する assertEquals( 0, driver.findElements(By.className("testCss")).size()); }
Locust コトハジメ - Qiita
Locust とは何か Locust とは Python で書かれた分散負荷試験ツールです。 以下の特徴があります。 シナリオを Python で記述 分散&スケーラブル Web ベース管理画面 高いカスタマイズ性 インストール 現状 python3系には対応していないので python2.7系を使用します。 インストールは pip から行えます。 geventというライブラリを使う関係で libevent が必要です。 OSXであれば macports か homebrew でインストールしてください。 使い方 locustfile.py というファイルを作り、シナリオを書きます。 試しに、最初にログインURLを叩き、その後 /info を 5秒に一度叩くシナリオを書いてみます。 # -*- coding: utf-8 -*- from __future__ import absolut
Slimで動的なClass名やData属性、インラインCSSなどの書き方 - Qiita
<!- 動的なクラス名のみの場合 -> <div class="taro"></div> <!- 静的 + 動的なクラス名の組み合わせ -> <div class="user-thumb user-small user-taro"></div> Slimで ifでクラス名を条件分岐させる 上と同じく div class="classname" で記述。 下記のどの書き方でも通るので、可読性のよいものを選ぶ。 #{} は入れ子にしてもOK。 もし中身がfalseだったら、コンパイルされる際にちゃんとclass=という表記が消えるのだ
Swith Roleで複数のAWSアカウント間を切替える - Qiita
通常の複数のAWSアカウントの管理方法 課題 同一のシステムのランドスケープを複数のAWSアカウントに分けているような場合、IAMユーザーを別々に発行してログイン、ログアウトして環境を切り替えるのは面倒です。 Switch Role方式 「IAMユーザーは1つのアカウントだけで発行」し、スイッチ先では「信頼するAWSアカウントの特定のユーザーに付与してよいIAM Roleを発行」することで、一つの入り口から複数の環境に切り替えて操作が可能です。 やってみよう Let's do it! それでは上記の「Switch Role方式」の図にある構成を用いて、実際に設定してみましょう。 1. スイッチ先でロールを作成する まずはスイッチ先である本番アカウント側で、スイッチ元に権限移譲するロールを作成します。 IAM画面に移動し、左のロールのペインからロールの作成を押下して進めていきます。 1-1.
『Team Geek』を読んだメモ - Qiita
Team Geek――Googleのギークたちはいかにしてチームを作るのか 読んだメモまとめた。半分目次みたいなもの。 はじめに 人間は難しい 人間は断続的なバグの大きな塊だ 天才プログラマの神話 「早い段階で、高速に、何度も失敗せよ」 高速なフィードバックループ コードレベル プロジェクトループ 車輪の再発明 バス係数(チーム何人がバスに轢かれたらプロジェクトが破綻するか) 「アイデアを胸にしまい込む」問題 ソフトフェア開発はチームスポーツである。 3本柱(HRT) 謙虚(Humility) 尊敬(Respect) 信頼(Trust) あらゆる人間関係の衝突は、謙虚・尊敬・信頼の欠如によるものだ。 実践HRT エゴをなくす 建設的な批判と攻撃的な非難の違い 君は君の書いたコードでない 相手に対する疑問ではなく自分の疑問として謙虚に聞く google社是「失敗は選択肢の一つ」 失敗の文章化
Railsのコントローラーの仕事は何か？ - Qiita
誰も読んでいないブログからの転載 最近MVCがどうとかという内容が話題になっていますが、ちょっと乗っかった内容です。 Railsで初心者によく見られる良くないコードは、コントローラーでたくさんの処理を実装してコントローラーの一つのアクションが30行、40行になってしまうことです。それに対して、モデルに適切に処理を移すのが良いんだということを言うんですが、”適切に”って何？じゃー、コントローラーには何を書くのがいいの？っていう質問への僕なりの回答です。 良いメソッドとは？ 直接回答する前に、まずは前提の共有から、プログラムにおいて良いメソッドとはどのようなメソッドでしょうか？僕の解は、以下です。 "引数と返り値が最小限になっているメソッドです" （この部分については別途説明が必要な気がしますが、まぁなんとなくご理解いただけるかなと思います。） Railsのコントローラーの仕事？ では、Rai
curlで150ms損していた話 - Qiita
curlと127.0.0.1とlocalhost curlでレスポンスタイムを取得して、その値を監視していたのだけど ホストの指定を「127.0.0.1」にするか「localhost」にするかで結果がだいぶ違う。 どのくらい違うかというとこのくらい。 $ curl -skL -o /dev/null -w "%{time_total}\n" http://127.0.0.1/test.html 0.001 $ curl -skL -o /dev/null -w "%{time_total}\n" http://localhost/test.html 0.152 $ uname -a Linux web01 3.10.0-123.8.1.el7.x86_64 #1 SMP Mon Sep 22 19:06:58 UTC 2014 x86_64 x86_64 x86_64 GNU/Linux
GAS ビギナーが GAS を使いこなすために知るべきこと 10 選 - Qiita
はじめに Google Apps Script (GAS) は Web ブラウザ上の JavaScript とも Node.js とも環境が異なります。その違いや、 GAS 特有の機能を理解するとさらに開発が捗るので、それらをこの記事で紹介しようと思います。 Tokyo GAS で 5 分 LT した内容です。 スライドはこちら > GAS ビギナーが GAS を使いこな すために知るべきこと 10 選 ※より網羅的で最新の情報を得たい方は DevFest 2020 の登壇動画 Google Apps Script 入門 2020 をご覧ください。 1. ローカル環境で開発する GAS を好きなエディタで開発したり、ローカルで開発したものを github に上げたりしたくなる。 Google ブログの記事 Apps Script による高度な開発プロセス で紹介されているが、 node-g
ESLintのルールを全部手動で設定するのは大変だからやめておけ - Qiita
よく来たな。 お前がこの記事を見ているとゆうことは、やめておけとゆわれたことをあえてやろうとする真の男たらんとするものだろう。 軟弱な男たちがスマッホの予測変換に骨抜きにされている間にお前は反骨もあらわにここに来た。 おまえのそうゆう負けん気は実際大事だ。強くなければお前はメキシコで野垂れ死ぬだろう。 だが真の男と無謀は違う。 ときにお前は知の高速道路をもうダッシュするひつようがある。 つまり今がそのときとゆうことだ。 ESLintを入れろ お前のJavaScriptがぐちゃぐちゃなことをおれはしっている。 なぜならおまえはESLintを使っていないからだ。 お前はコードの荒野を踏破できるタフな男を気取っているが、それにも限界が来るだろう。 今のままではお前が倒れ目を伏せるのはベイブの隣ではなく混沌としたコードの掃き溜めだ。 まずはESLintを入れろ。 簡単だ。 お前のその目の前の板の黒
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
SlimでHTMLタグを動的に切り替えたい - Qiita
