Rust製ブラウザエンジンの「Servo」、アプリに組み込み可能なクロスプラットフォーム対応WebView化を目指す。Electron代替を目指す「Tauri」への組み込み実現へ
Rust製ブラウザエンジンの「Servo」、アプリに組み込み可能なクロスプラットフォーム対応WebView化を目指す。Electron代替を目指す「Tauri」への組み込み実現へ Rust製のWebブラウザエンジンとして開発が進められている「Servo」は、Servoをアプリケーションに組み込み可能なクロスプラットフォーム対応WebVeiwとする方向で開発を進め、それをアプリケーションフレームワークのTauriと協力してTauriがサポートする予定であることを発表しました。 TauriはElectronの代替を目指す、Web技術を用いてアプリケーションを開発するためのフレームワークです。 参考：Electron代替を目指すRust製フレームワーク「Tauri」がバージョン1.0に到達、Windows/Mac/Linuxに対応 現在のTauriは、UIのレンダリングエンジンとして、Windo
iOS 16.4でSafariのPWAがPush通知に対応したのでWeb Pushの動作検証する
はじめに 2023年3月27日に iOS 16.4 が公開され、iPhoneのSafariでもPush通知が利用できるようになりました。 Web Push機能を実装したPWAが iOS 16.4 Safariでどのように動作するか検証したのでまとめます。（動作検証端末：iPhone 13 mini） 目次 Push通知の動作確認 バックグラウンドやスリープ時の動作確認 Push通知にURLを指定した場合の動作確認 まとめ プッシュ通知の動作確認 Web Push機能を持つPWAを用意して、次のようなパターンで動作を検証します。 Safari（ブラウザ上）でPush通知が動作するか ホーム画面に追加したPWAでPush通知が動作するか Push通知の動作確認用のWebページは次に示すような実装をしました。 ホーム画面にインストールする実装 manifest.jsonファイルを作成する Ser
情報セキュリティ企業が“脆弱性だらけのWebアプリ”無償公開 実習用の題材に
WAF開発を手掛けるEGセキュアソリューションズ（東京都港区）は2月28日、Webアプリケーションの脆弱性について学べる実習用アプリケーション「BadTodo」を無償公開した。同アプリは多くの脆弱性を含んでおり、実際に攻撃したりソースコードを確認したりして実践的に学習できるとしている。 BadTodoは脆弱性診断実習用のアプリ。情報セキュリティの専門家であり同社CTOの徳丸浩さんが制作した。Webブラウザ上で動くToDoリストアプリとして動作するが、情報処理推進機構（IPA）の「IPA ウェブ健康診断仕様」や国際Webセキュリティ標準機構の「OWASP Top 10」で紹介されている脆弱性を網羅的に含む、脆弱性だらけのアプリになっている。 EGセキュアソリューションズによると、BadTodoには各種脆弱性を自然な形で組み込んでおり、脆弱性スキャンで見つかりにくい項目も含んでいるという。 徳
Flutterが進化する方向とは？ WebAssemblyサポート、コンポーネントとしてWebアプリに組み込み可能に。Flutter Forward 2023
GoogleでFlutter & DartのプロダクトとUX担当ディレクターTim Sneath氏は、アフリカのケニア共和国ナイロビで開催された「Flutter Forward 2023」の基調講演で次のように話し、Flutterの進化の方向性を示しました。 「Flutter for Webは汎用目的でデザインされてはいないことを明確にしておきたい。すでにDOMの分野で上手く行っているAngularやVue、Reactのような、DOMベースの新たなフレームワークを作ろうとしているわけではない。 そうではなく、（CanvasやWebAssemblyのような）新しいWeb標準をベースとする最初のフレームワークを作ろうとしているのだ。」 その上で、Flutter for WebがWebAssemblyをサポートする予定であることを明らかにしました。 「FlutterからWebAssemblyへの
次世代のカメラパッケージreact-camera-proの紹介
経緯 今回、社内で開発中のWebアプリにカメラの機能を実装する必要があり、npmでもダウンロード数が最も多いreact-webcamを使うことを検討していたのですが、色々あって断念した話です。 （react-webcamの批判ではなく、自分たちに合わなかったという事だけ誤解しないでいただければ助かります） 断念した理由 当然ですが、この開発中のWebアプリでは画質が要求されていてreact-webcamでは、その画質を満たすことができませんでした。 react-webcamの問題点 もしかしたら自分の技量不足で対処する方法があったのかもしれませんが、 時間的制約などがあり2つ問題が浮上しました react-webcamはカメラのスクリーンショットをbase64に変換する過程で画質が下がってしまう （説明が難しいのですが、）スクリーンショットの出力サイズがカメラのアスペクト比に依存する 画質
筑駒文化祭入場管理システム "siesta" 開発・運営記 - Qiita
こんにちは、高校 1 年生の define です。競技プログラミングが趣味で、普段は AtCoder などのコンテストに参加しています。現在は黄色コーダーですが、中 2 の時から全く進歩していません...。 さて、今年は縁あって文化祭実行委員（文実）として筑駒文化祭 2021 "EVERGREEN" の運営に携わっていたのですが、その中でも特に面白かったプロジェクト「入場管理システムの開発・運営」について記事にしようと思います。 なお、この記事の許可は取っていますが、文化祭実行委員会の公式な見解ではありません。ご了承ください。 1. 入場管理システムとは 昨年度から導入された文化祭における感染症対策の一つです。各団体の受付時にスマホなどを用いて来場者の入場証にある QR コードをスキャンしてもらうシステムで、これにより以下のような効果が期待できます。 各団体の混雑状況を文実がリアルタイムに
フロントエンド開発する人が入れているもの(拡張、プラグイン、アプリ、設定など...)
タイトル通りです。 自分が入れてるものを記載していきますが、誰でも投稿できるのでオススメの提供もお待ちしてます！ 私はApple SiliconのMac miniに設定をします。 個人的な好みが入ってしまっている & ご存知のものも多そうですが、思いついたものを遠慮なく挙げてみます！ 開発系 Postman：Web APIのテストにときどき使いますね… Table Plus：最近人気が出てきてそうなSQLクライアント。このあたりは好みによって異なると思いますが、見やすくて個人的に気に入っています。MySQLとPostgreSQLの両方に対応。 その他 clipy：コピペの履歴を取っておいて⌘ + shift + Vで楽に呼び出せて捗ります。 Whimsical：ちょっとした図を書くときに便利です。ブラウザ上でも使えるのですが、デスクトップアプリとして入れておくと開きやすくていい感じ。 Be
特別な理由なしにgit-flowを新規採用するべきではない - Qiita
私がこれまでGitの研修講師やブランチ戦略のコンサルティングをおこなってきた経験に基づいて、この記事を書きます。 Gitのワークフローについては自転車置き場の議論になりがちであまり乗り気がしないのですが、最近少し発見があったのと、実際に多くの現場で明らかにフィットしないのに git-flow を検討したり採用したりしようとして苦労をしている様を目撃することが多いので書くことにしました。 この記事で主張する内容はタイトルの通りですが、まず前提として以下を宣言しておきます: 全てのケースに100%フィットするようなワークフローは存在しない git-flowがフィットするケースも探せばあるかもしれない 例えばすでに何年もgit-flowでうまく回せてるよ、など どのようなワークフローを採用するかは最終的にはあなた（のチーム）が判断すべき さて、 git-flow は 2010年1月「A succ
メルペイのクライアントエンジニアリングの話 | メルカリエンジニアリング
この記事は、Merpay Advent Calendar 2021 の 5 日目の記事です。 @1000ch です。最近はメルペイのエンジニアリング部門にて、Android・iOS・Web を含むクライアントエンジニアリング全般を担当しているので、その話をします。 メルペイクライアントサイドの責務 メルペイのクライアントサイドはどのような領域を担当しているのか、俯瞰してみます。メルカリグループには、C2C マーケットプレイスを担うメルカリ、金融決済事業を担うメルペイ、メルカリ Shops を担うソウゾウ、フットボールクラブを運営する鹿島アントラーズ、暗号資産事業を担うメルコイン、物流事業を担うメルロジがあります。 一口に金融決済事業のクライアントサイドと言っても非常に様々で、いわゆる「iOS と Android のメルカリアプリのうち決済に関わる機能実装」だけで完結するほど単純ではありませ
JavaScriptのバンドルとトランスパイルが不要なモダンWebアプリ | POSTD
筆者はES6以前のVanilla JSがあまり好きではありませんでした。 そこで、バニラJavaScriptをなるべく書かなくていいように、2000年代を通じてさまざまなアプローチを追求してきました。最初はRJS（Ruby-to-JavaScript）、次はCoffeeScriptでした。どちらのアプローチも、バニラJavaScriptより楽しく書けるソースコードを、ブラウザが実行できるバージョンのJavaScriptへトランスパイルするものです。ある程度は、うまくいっていました。 とはいえ、これは明らかにその場しのぎの手段に過ぎず、ブラウザがより洗練されたJavaScriptを理解できる日を待ちわびていたのです。ただ、そんな日が来ることはなく、永久にその場しのぎでやり過ごすのかと思われる時期がしばらく続きました。 しかし、幸いなことにJavaScriptは改善を続け、2015年にはES6
【SUGEEEE】 Retool でローコードに業務用アプリ作って簡単に業務改善｜ノースサンド
こんばんは、ノースサンドのキングです。 今日はバックオフィスで大活躍のモダンなツール「Retool」を紹介します。 最近とある仕事でヘビーユーズしてますね、はい。 このツールを実際に使った人からは... このツールを使って１週間かかっていた業務が1日でできるようになりました！(40代男性)いくつもの画面をタブで開いて、あっちで検索、こっちで検索して情報収集しなきゃいけなかったのがこの画面一つ開いておけばわかるようになってとても便利です！！(20代女性)みたいな声が聞こえてきます。もう絶賛ですね。 Google検索しても日本語の記事が全然Hitしないので、これは布教しなきゃいけない！！！という勝手な使命感から記事にしました。 ご一読あれ。 ちなみに↑の怪しい広告とか勧誘みたいな引用コメントは 年齢 性別 共に架空のもので、冗談です。 実際に言われたわけではありません。ホントはありがとうくらい
作りたいWebアプリのアイディアを迷走せずに作る方法。まず、エディターを閉じることから始めよう - Make組ブログ
何かを作りたいときは、エディターをいきなり起動してはいけません。 エディターを閉じて、まずはイメージをまとめることに集中しましょう。 なぜこの文章が必要か なぜ何かを作る前にイメージをまとめる必要があるのでしょうか？ 頭の中には完璧な作りたいもののイメージがあることでしょう。 であれば今すぐにでもプログラミングを始めるのが賢明なように思えます。 ですがそうしてはいけません。理由は「作りたいもののイメージは単なる幻想だから です」。 頭のなかにあるイメージはとても素晴らしいものですが、多くの場合は曖昧で、触れられない、価値を検証できないものです。 それを一旦書き出して、まとめていく方法を知っておきましょう。 まとめていく中で作るものがより明確になり、自分でも気づかない価値を発見できます。 作るものをまとめて検証することで、作り始めた後の手戻りを防ぎます 作るものをまとめて明確にすることで、作
メルカリShopsのためのWebViewの技術 | メルカリエンジニアリング
こんにちは、ソウゾウのSoftware Engineerの@gentleです。連載：「メルカリShops」プレオープンまでの開発の裏側の6日目を担当いたします。 メルカリShopsは既存のメルカリアプリの中に独立したWebアプリケーションを組み込む形で開発いたしました。本記事では、Webアプリケーションとして作成されたメルカリShopsを、既存のメルカリアプリでWebViewを使って表示する際のアプリとの連携について解説いたします。 メルカリアプリとの連携 メルカリShopsはメルカリアプリ内に組み込まれておりますが、独立したWebアプリケーションとして存在しており、WebViewにてShopsのWebページを表示する形になっています。しかし、単純にアプリ内でWebページを表示しただけでは、アプリとしてのUI/UXを満たせないため、WebViewとアプリとの連携が必要です。 アプリとの連携
婚活アプリ「Omiai」、運転免許証やパスポートの画像が171万件も流出した経緯
婚活マッチングアプリ「Omiai」で、171万件もの会員情報流出が判明した。流出したデータには運転免許証やパスポート画像などが含まれる。氏名や住所に加えユーザーの顔写真情報まで流出したのは深刻な問題だ。運営するネットマーケティングは再発防止策を講じたものの、流出したデータによる二次被害を防ぐ手立ては見つかっていない。 婚活マッチングアプリ「Omiai」を運営するネットマーケティングは2021年5月21日、不正アクセスによるデータ流出に関するおわびを公表した。Omiaiは2020年10月時点で累計会員数が600万人を超える大手のサービスだ。 この事件はすぐさま新聞各紙やテレビ、インターネットのニュースサイトなどで報じられ、大きな話題になった。その理由の一つは、流出したデータが氏名や住所、生年月日などアカウント数で171万1756件と大規模だったこと、さらには恋人探しや婚活など、利用者にとって
textlintをWeb Workerとして動かしてアプリに組み込む - Bouldering & Com.
Web Workers APIを使うのは初めてなので、この使い方で問題ないのかはよくわかっていない。これから学んでいきます。 動機 会社でtextlintを便利に使っており、ユーザーさんからのお問い合わせ窓口を自社開発しているので、返信内容を送信前にlintにかけたいというのも自然な流れ。などと思っていたら、azuさんがこういうのを用意してくれていた。 textlint 12リリース、ブラウザで動くtextlint editorをベータリリース | Web Scratch GitHub - textlint/editor: textlint editor project. 内部での利用だからtextlintをサーバーで動かして結果を受け取るのでもいいけど、これのためにWebサーバーにNode.js入れて動かすのもなんかやりすぎ。かといってJobサーバーで動かす構成にするのはもっとやりすぎ。
Svelte • サイバネティクスで強化されたwebアプリ
compiled Svelte は、可能な限り多くの作業をブラウザからビルドステップにシフトさせます。手作業による最適化はもう不要です — より高速で、より効率的なアプリを。 compact よく知られている言語(HTML、CSS、JavaScript)を使って、息を呑むほど簡潔にコンポーネントを書くことができます。 そして、あなたのアプリケーションバンドルはとても小さくなります。 complete scoped styling、state management、motion primitives、form bindings などはビルトインで用意されています — 必要なものを探し求めて npm をさまよう必要はありません。全てここにあります。
アクセシブルなWebモーダルを作る
多くのお客様から、Instacartを利用して貴重な時間を取り戻していると言われていますが、特に体が不自由なユーザーが私達の利用して、必要な食料品を入手するため大切な方法として私達に信頼を寄せています。 Instacartのカスタマーエンジニアリングチームは、すべてのお客様のためにシームレスなアプリ内購入体験を構築するために一生懸命努力しています。そして特に障害のあるお客様に対して、我々はアプリ内購入のアクセシビリティーを真剣に考えています。 私たちが直面している最大のアクセシビリティの課題の1つは、エレガントな（そして実用的）Webモーダルを構築することです。 スタンダードな状況では、私たちはReact-Modalを使います。 問題が解決しました。 残念ながら、それほど単純ではありません。 デザインや機能的な状況によっては、カスタムモーダルが必要です。 このカスタム作業では、アクセシビリ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
業務用食材の仕入れ、卸売なら八面六臂
touch:waves
ついに、Webアプリでの帳票印刷のベストプラクティスを編み出しました💡
