PWAでここまでできるスライド内の関連リンク * DiverseのPodcast https://podcast.diverse-inc.com/ * 採用ページ https://diverse-inc.co.jp/recruit/positions * 今回のサンプルGithub https://g…
リンクを作る時の target="_blank" の危険性 - 隙あらば寝る
html で リンクを新しいタブ(やウィンドウ)で開かせたい場合、target="_blank" を指定するが、 この使い方には落とし穴があるらしい。 www.jitbit.com リンクを開いた先の javascript から、開いた元のページを操作できてしまうとのこと。 気になったので確認してみた。 悪用のパターン insecure.html が最初に開くページで、ここに target="_blank" なリンクがある。 このリンクを押すと new_window.html を新しいタブで開く。 この new_window.html に javascript が仕込まれており、元ページを操作されるという話。 具体的には window.opener.location="./evil.html" と実行すると、元タブは evil.html に遷移する。 実際試してみたのが ここ。 リンクを開
マイクロサービスほどじゃないけどウェブサービスを分割開発したい人向けDocker設定を集めるスレ - Qiita
Futureアドベントカレンダー6日目です。昨日は @shun_shushu さんでした。 マイクロサービスまではいかなくても、gRPCなり、Swaggerなりを使って、リッチなSPAのフロントエンドと、いくつかのプロセスに分割されたバックエンドでサービスを開発したい、というニーズはあると思いますので、今までやってきた開発の反省・良かったところを踏まえて、次やるなら絶対にこうする・実際にこうし始めた！というDocker活用案です。 フロント、バックエンドのサービスを種類ごとに書いています。好きなフロントエンドと、好きなバックエンドのレシピを組み合わせて、オリジナルのdocker-compose.ymlを作る、という感じで読んでいただけるように書いています。対象言語とかも増やしたいので、この記事自体、検証結果を受けてどんどん変わっていく予定です。 ソースコードは次のリポジトリに置いておきます
Webアプリや拡張機能（アドオン）で、Web Crypto APIを使ってローカルに保存されるデータを暗号化する - 2019-01-30 - ククログ
株式会社クリアコード > ククログ > Webアプリや拡張機能（アドオン）で、Web Crypto APIを使ってローカルに保存されるデータを暗号化する ※注記：本文末尾の「公開鍵暗号ではなく共通鍵暗号を使う理由」の説明について、2019年1月30日午前0時から21時までの間の初出時に内容の誤りがありました。また、2019年1月30日午前0時から2月5日20時頃までの間において、本文中での AES-CTR による暗号化処理が、 nonce を適切に指定していないために脆弱な状態となっていました。お詫びして訂正致します。初出時の内容のみをご覧になっていた方は、お手数ですが訂正後の説明を改めてご参照下さい。 クリアコードで主にMozilla製品のサポート業務に従事している、結城です。 FirefoxやThunderbirdがSSL/TLSで通信する際は、通信内容は自動的に暗号化されます。その一
Callback を撲滅せよ
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。言語サポート（Node.js）チームの伊藤（@koh110）です。 Node.js v10 も10月にLTSとなり async/await によるフロー制御は当たり前のように利用されるようになってきました。JavaScriptの非同期処理は async/await から覚える人も今後増えていくでしょう。今回はそんな非同期処理について、社内での事例を交えて記事を書いていこうと思います。 index Promise 化がなぜ重要なのか ユーザーに promisify をさせる落とし穴 Road to Promise まとめ Promise 化がなぜ重要なのか ちょうど3年前のアドベントカレンダーで、今後はいろいろなモジュー
一休.comホテルページのスマホ版からjQuery依存を取り除くためにやったこと - 一休.com Developers Blog
一休.comでWebフロントエンドを開発している宇都宮です。 先日、一休.comホテルページのスマホ版から、jQueryを取り除きました。jQueryを取り除いた経緯、やったこと、結果について書きます。 ちなみに、ホテルページには以下のURLでアクセスできます（スマホで開くか、PCの場合はUAをスマホに偽装する必要があります） https://www.ikyu.com/sd/00001290/ なぜjQueryを取り除いたのか？ どうやったのか 何をやったのか jQuery.ajax() => fetch に置き換え fetchのpolyfillを採用した理由 DOM操作を標準APIに置き換え 要素の取得 show/hide addClass/removeClass html/text アニメーション $.ready() イベントフィルタリング jQueryの使用を防ぐ目印 jQuery削
Retire.js
There is a plethora of JavaScript libraries for use on the web and in node.js apps out there. This greatly simplifies, but we need to stay update on security fixes. "Using Components with Known Vulnerabilities" is now a part of the OWASP Top 10 and insecure libraries can pose a huge risk for your webapp. The goal of Retire.js is to help you detect use of version with known vulnerabilities. Retire.
JavaScript：500行のテトリスプログラム
JavaScriptを使ってテトリスを作った。 ちまたでは、多くのテトリスプログラムが公開されている。 わたしが作ったテトリスは、500行弱のプログラムだ。自分の中でのわかりやすさを重視したらこうなった。頭のいい人が200行でテトリスなどを公開しているが、頭の悪いわたしにはさっぱりわからない。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,user-scalable=yes"> <link rel="stylesheet" type="text/css" media="screen,print" href="style.css"> <title>Tetris v0.7.5</title> </head> <body> <div id
SPA(Nuxt.js)をSpring Bootからホストする方法 - Qiita
はじめに 今どきなWEBアプリを作ろうとすると、画面はSPA、データ入出力（CRUDな操作）や複雑なビジネスロジックはWEB APIという構成が選ばれがちだと思います。 現在開発中の弊社のサービスでもフロントエンドのSPAにNuxt.js、バックエンドにSpring Bootといった構成をとることになりそうな気配を察知したため、個人的に検証作業を行いました。 他社様でも有用な情報になるかと思うので公開します。 SPAをSpring Bootからホストする方法のみが知りたい方は、サンプルコードのここを参照していただければブログ全文読む必要はないです（たぶん）。 目的 画面はSPA(Nuxt.js)で作りたい バックエンドはSpring Bootで作りたい フロントエンドの開発はHMRを利用して開発したい バックエンドの開発はspring bootのdevtools使って開発したい 状況 フロ
Tabulator - これはすごい。HTMLテーブルを高機能に MOONGIFT
テーブル表示はWebシステムのデファクトとも言えます。業務システムはいうに及ばず、管理者画面などでも必ず求められる表示です。そしてただ表示すればいいという訳ではなく、ソートやフィルタリング、インラインでの編集など様々な機能が求められるものです。 そんな多機能なテーブル表示を実現してくれるのがTabulatorです。多くのニーズを満たしてくれることでしょう。 Tabulatorの使い方 てんこ盛りなデモテーブル。ざっと見てもフィルタ、ページネーション、グラフ表示、ソートなどの機能が確認できます。 インライン編集もサポートされています。 データに合わせて幅を自動調整。 行をクリックして展開する機能。 カラムをグループ化。 カラムを縦に。これはカラムが多い時に便利そうです。 ドリルダウン。 テーブルを入れ子にもできます。 スパークライン表示。 フッターで集計。 HTMLテーブルを変換する機能もあ
HTML5ゲームの種類とゲーム用エンジン・フレームワーク15選｜フリエン
HTML5といえば、Webサイトを作成するための言語と思いがちですが、HTML5でもゲームアプリの開発を行うことが出来ます。Webブラウザはもちろん、iPhone、Androidでも動作するゲームが作成可能です。今回のコラムでは、HTML5で作成できるゲームの種類と、ゲーム用エンジン、HTML5で使用出来るゲームフレームワークをご紹介していきます。 【目次】 ■HTML5でゲームを作れるのか ◆HTML5とは ◆従来のゲーム開発で使用する言語 ◆HTML5で開発出来るゲームの種類 ■HTML5でゲームを作るために必要なスキル ◆HTML5とJavaScript ◆ゲームエンジン・フレームワーク15選 ◆HTML5でゲームを作るためのおすすめ教材5選 ■HTML5で作成されたゲーム例5選 ■ゲーム業界でのHTML5の需要と案件・求人例 ◆ハイブリットアプリで注目されているHTML5 ◆ゲーム
enchant.js - A simple JavaScript framework for creating games and apps.
enchant.js is … カンタンにゲームやアプリを開発できる HTML5 + JavaScript フレームワークです。 2011年に公開され、すでに 1,000 本以上のゲーム/アプリが公開されています。 オープンソース (MITライセンス) で、無料で利用できます。 ドキュメント・書籍・チュートリアルサイトが充実しています。 たくさんのプラグインで機能を拡張できます。 UEI/ARC を中心としたメンバによって開発・メンテナンスされています。 プログラミング教育のためにも利用されています。 Features オブジェクト指向: 表示されているものはすべてオブジェクトです。 マルチプラットフォーム: iOS, Android, Mac, Windows のブラウザで動作します。 Windows 8: Windows 8 対応のHTML5アプリケーションを開発できます イベント駆動
ヤフー株式会社におけるWebフロントエンドの技術選定 - Yahoo! JAPAN Tech Blog
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog Yahoo! JAPAN Tech Advent Calendar 2018の6日目を担当します、Webフロントエンドエンジニアをやっている向井(@sakito)です！ 今回はヤフー株式会社でWebフロントエンドエンジニアがどのような取り組みを行なっているのかをお伝えします。 ヤフーの組織体制 Webフロントエンドエンジニアの取り組みを紹介する前に、ヤフーがどのような組織体制なのか紹介します。 冒頭画像のようにヤフーではカンパニー制度を取り入れており、それぞれのカンパニーにサービスを開発する事業本部があり、この事業本部単位でデザイナーやエンジニア、そのほかにもさまざまな職種の方が所属し、サービスごとで日々開発に取り組んでいます。
PHPEncode書いた - moriyoshiの日記
The JUI 2009 Returnsに参加してきました。発表者の皆様お疲れさまでした！！！！ JavaScript は柔軟な文法を持っていながら、ドメイン特化型言語として生まれた宿命か、何度もその寿命を宣告されてきた言語だと思いますが、今回の発表はそんなことを微塵も感じさせない、JavaScript の未来を予見させるような talk がいっぱいでとても触発されました！特に、JavaScript の未来型ユーザーインターフェイスについての知見を得ようとして参加したのですが、この期待を完全に、根本から、裏切る*12 つの presentation が印象的でありました。 Yoshinori Takesako - Polyglot Yosuke Hasegawa - jjencode まあそんなわけで発表中に適当に手を動かして作りました。 PHPEncode です。 何をするためのもの?
JavaScript Standard Styleのススメ - Qiita
みなさんは、JavaScriptのコードを書くときに文字列は何で囲みますか？シングルクォート？ダブルクォート？ インデントに使用する文字はスペース？それともタブ？ JavaScript Standard Styleは、そのように千差万別なコーディングスタイルを統一するためのスタイルガイドの一つです。1 JavaScript Standard Styleのルール JavaScript Standard Styleには、次のようなルールがあります。 インデントはスペース2個 文字列はシングルクォートで囲む 未使用の変数は禁止 文末のセミコロンは禁止 キーワードの後にスペースを入れる 関数名の後にスペースを入れる 値の比較に==ではなく===を使用 ただしobj == nullはnull || undefinedをチェックするために許容される 常にNode.jsのerr引数をハンドル ファイルの
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
The best Visual Studio Code extensions for JavaScript and Node | Pusher blog
GitHub - mbeaudru/modern-js-cheatsheet: Cheatsheet for the JavaScript knowledge you will frequently encounter in modern projects.
Vue.js 続・大規模アプリ開発 - Speaker Deck
さくらのフロントエンド さくらの Vue.js // vue.js in SAKURA - Speaker Deck
Node.js 2018 - Speaker Deck
