組み込み端末のアプリケーションに Electron を採用し開発・運用を行っています。 継続的な機能追加やトラブルサポートを行いながら 3 年が経過したので、Electron を採用した経緯や結果を経験を交えながら共有したいと思います。 組み込み案件自体が初めてでしたのでその話も入っています。 約 700 台ほど導入されており、なかなか大きな案件での採用と思いますので参考になれば幸いです。 ※Electron の基本的な説明は割愛します。 システムについて 一般的に「受付精算機」などと呼ばれ、店頭に何台か並べて設置して自動で受付・精算を行うシステムです。 ホテルの受付端末のイメージです。ハード的にはセルフレジにも近いです。 筐体自体は他社が用意し、弊社はその上に載せるGUI アプリケーションのみを担当しました。 機能 主な機能として 来店受付・整理券発行 予約チェックイン チェックアウト

Next.js + Electron を使えばめちゃくちゃ簡単にデスクトップアプリを作れるという記事です。デスクトップアプリケーションをWeb技術で作成するElectronを、むちゃくちゃ久々にやってみたら、とても簡単になっていたReact のフレームワークであるNext.js もバージョン9.xになってから劇的に良くなり続けていて、どんどん触りやすくなっています ちなみにNext.js は非公式な日本語翻訳が進んでいるようです。 9割くらい翻訳が完了しているようですが、気になる方は、このサイトの「翻訳プロジェクトについて」をご覧ください。 セットアップする # npmの場合 $ npxcreate-next-app --example with-electron-typescript hoge $ cd hoge $ npm runbuild $ npm run start

Lightning fast appcreation. Quark is a general purpose software tool specifically designed to help youcreate projects written inHTML,CSS andJavaScript with native desktop app like capabilities. Quark apps run onMac,Windows, andLinux from a single codebase. Get Started → Power of Electron 💪 Built ontop of the electron framework. Behind the scenes, Quark uses electron's renderer process as
こんにちは。サービス開発部の丸山@h13i32maruです。 今日はGitHub/GHE(GitHub Enterprise)で快適なIssue生活をおくるために作ったJasperというツールと、それを実際にどうやって使っているかを紹介させていただきます。 ストレスGitHub/GHEを日々の業務の中心として使っていると、すごくたくさんのIssueやPull Request(以下PR)が流れてきます。 これらのIssueを処理する方法としては主に「メール」と「通知ページ(github.com/notifications)」の2つだと思います。 僕もこれらの方法を使っていたのですが、以下の点ですごく困っていました。 多すぎてメンションされたものやコメントしたものを見逃してしまう あとで見ようと思って、忘れる ブラウザのタブを大量に開いた状態になる 知らないところのIssueで議論が進んでい

115 EElm Ave Monroe, MI 48162 General: 734 243 0576 Sales: 800 826 2760 SecureSecurely and reliably communicate with your devices online using Secure Shell, or offline using direct cabled Serial connection or direct modem to modem. Award winningterminalemulation forWindowsConnect using Serial, Modem, or TCP/IPNetworksUpdated for compability withWindows 10, 8, 7, and moreSupports many termina

It's a time to migrate into Marp Next! The publication of classic Marp app has ended. Marp desktop app, asimpleMarkdown presentation writer, already had stopped maintenance since 2017. Today Marp team is focusing into Marp Next project, the brand-new presentation ecosystem for the future. See more details in ourblog post. Why? We had kept publishing app for stuck users that are thinking Marp Ne

Electronアプリでxssを発生させると任意のコードが実行できるらしいのでrm -fr /を試してみます。 想定 web版とelectron版のあるチャットアプリケーションという設定です。攻撃者が用意したリンクをクリックすると、PC内のすべてのファイルを消し去るというシチュエーションを考えてみます。 用意 環境はホストmacOSX、ゲストにubuntu14.04環境をvagrantを利用し用意しました。 expressでリストとフォームからなる脆弱性のあるチャットをつくります。エスケープ処理をしてないので、任意のコードが実行できる状況です。 'use strict'; const path = require('path'); const express = require('express'); const app = express(); const ejs = require(

'use strict'; // nightmare const Nightmare = require('nightmare'); const path = require('path'); const TEST_HTML_PATH = "file://" + path.join(__dirname, "test.html"); //create global.browser = null; let startBrowser = function * (){ global.browser = Nightmare({ show: false, nodeIntegration: true }); yield browser .goto(TEST_HTML_PATH) .wait('body') .evaluate(() => { require("babel-register"); //

そのうちもう少しきちんと書きますが、とりあえず時間がないので結論だけ書くと、タイトルが全てでElectronでアプリを書く場合は気合いと根性でXSSを発生させないようにしなければならない。 これまでWebアプリケーション上でXSSが存在したとしても、影響範囲はそのWebアプリケーションの中に留まるので、Webアプリケーションの提供側がそれを許容するのであればXSSの存在に目をつむることもできた。しかし、ElectronアプリでDOM-based XSSが一か所でも発生すると、(おそらく)確実に任意コード実行へとつながり、利用者のPCの(そのユーザー権限での)全機能が攻撃者によって利用できる。 そのため、Electronでアプリケーションを作成する開発者は気合いと根性でXSSを完全につぶさなければならない。 nodeIntegration:falseやContent-Security-Pol
必要な要件Mac OS X 最新の XcodeApple Developer Program($100 per year) 有用なドキュメント ElectronMac App Store SubmissionGuideMac App Store (MAS) SubmissionGuideline · nwjs/nw.js Wiki Enabling App Sandbox Electron 公式の SubmissionGuideline はコードサイニングについてしか書いていないので、nw.js の wiki を参考にしてアプリを登録していきます。この2つのドキュメントを読むだけでもゴールには到達できますが、つまずきポイントもなかなかあるので手順を解説していきます。 Electron アプリをMac App Store に登録する手順 証明書を作成iTunes Conne

AI & MLLearn about artificial intelligence andmachine learning across theGitHub ecosystem and the wider industry. GenerativeAILearn how tobuild with generativeAI.GitHub CopilotChange how you work withGitHub Copilot. LLMsEverything developers need to know about LLMs.Machine learningMachine learning tips, tricks, and best practices. HowAI code generation worksExplore the capabilities and be

var app = require('app'); var BrowserWindow = require('browser-window'); require('crash-reporter').start(); var mainWindow = null; app.on('window-all-closed', function () { //if (process.platform != 'darwin') app.quit(); }); app.on('ready', function () { // ブラウザ(Chromium)の起動, 初期画面のロード mainWindow = new BrowserWindow({ width: 1000, height: 600 }); mainWindow.loadUrl('file://' + __dirname + '/index.h

元々GitHubのAtomエディタのために開発されたデスクトップアプリ作成用フレームワーク「Electron」。HTML/CSSといったWeb系技術を使って、クロスプラットフォームのデスクトップアプリを開発可能なため、多くの開発者の注目を集めています。本日紹介する「Photon」は、このElectron用の便利なコンポーネントを多数収録したUIツールキットです(GitHub、Hacker News)。 ツールバー、タブ、ナビゲーション、リスト、ボタン、フォーム、テーブルといった、GUIアプリ作成に必要なさまざまなコンポーネントを、アプリケーションに素早く組み込むことができます。コンポーネントの見た目もOS X風でクールです。 以下ご紹介。 バー ヘッダーとフッターを組み込むことができます。 バーとアクション バーにボタンを設置してアクションを定義することもできまうs. バーとタブ タブを

以前Nodeで作っていたものをElectronで作り直していて、同じ問題にまたハマったので書いておく。 所謂、UTF-8-MAC問題である。もう遥か昔にNodeでハマった時の記事がある。 node.jsでUTF-8-MACを扱う - joker1007の日記Macのファイルシステムはファイル名に対してNFDとかいう正規化を行っていて、ファイルシステムにアクセスする時に勝手に変換しやがる仕組みになっている。 このせいで、濁点が入ると急に死ぬとか、本当辛い問題が起きる。何の嫌がらせなんだと……。この世界は文字が8ビットで済む様な国ばっかじゃねえんだよ! とりあえずMac NFDでググると辛いのは俺だけじゃない気持ちになれる。 で、昔は上で貼ったブログに書いたような方法で解決していたのだが、正直、この解決策は2015年にもなって面倒過ぎるだろと思っていた。 (マジかよーってググって自分の記事が

全国5000人のエンジニアをやめて寿司職人になろうと思っているみなさんこんばんは。 前回までスライド共有用のアプリケーションを趣味(リハビリ)で作っていたのですが、折角なのでデスクトップクライアントも作ってみました。 構築にはElectronを使ったのですが、結構簡単にできたので記録としてまとめておきます。 Electronって何?GitHubが開発するクロスプラットフォームで動作するアプリケーションを開発するためのフレームワーク。コードの記述はHTML5とNode.js。その範囲であれば既存のWeb開発技術が使いまわせる。例えばjQueryとかAngularなんかを使うのも可能Chromeブラウザのオープンソース版のChroniumのエンジンを内蔵例えばAtom・Visual Studio Code・Slackクライアントや、日本だとKobitoあたりがメジャー作り方あちこちに記事があが
SASCHA WISE Electron for theMac App Store August 12, 2015 Before yougo any furtherit is important to know that thisblog post is out of date. Thetechnique used here has been integrated into the offical Electron project. Look here for more info. Electron and theMac App Store are 2 things that are difficult to pair, like fine wine and McDonalds.Chromium, the rendering engine for Electron, uses
最近は、Mithrilのお陰で、シングルページアプリケーションが大分作りやすくなりました。仕事でも使ってます。あ、ドキュメントの日本語訳もありますよ。本もあります! http://mithril-ja.js.org/ http://www.oreilly.co.jp/books/9784873117447/ 社内ツールを作るのにMithrilとElectronで作ってみたのですが、ふつうのデスクトップアプリを作るのにちょっと手間が多いので(これはMithrilを使わなくても)、ふつうを実現するためのフレームワークについて考えて実装してみました。特にまだ名前はありません。 Electronとは? Electronはウェブ的なスキルがあれば、それが簡単にデスクトップで動くようになるという仕組みです。元々はatom-shellと呼ばれていました。類似のものに、NW.js(元node-webkit

1リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く