You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
GitHub (opens new window) Write Once, Run Everywhere If it works as an SPA, it will work in Electron. Because it extends your regular config, it works with all plugins and customized webpack options. Completely Customizable All the functions of VCP Electron Builder are entirely configurable and well documented.
組み込み端末のアプリケーションに Electron を採用し開発・運用を行っています。 継続的な機能追加やトラブルサポートを行いながら 3 年が経過したので、Electron を採用した経緯や結果を経験を交えながら共有したいと思います。 組み込み案件自体が初めてでしたのでその話も入っています。 約 700 台ほど導入されており、なかなか大きな案件での採用と思いますので参考になれば幸いです。 ※Electron の基本的な説明は割愛します。 システムについて 一般的に「受付精算機」などと呼ばれ、店頭に何台か並べて設置して自動で受付・精算を行うシステムです。 ホテルの受付端末のイメージです。ハード的にはセルフレジにも近いです。 筐体自体は他社が用意し、弊社はその上に載せる GUI アプリケーションのみを担当しました。 機能 主な機能として 来店受付・整理券発行 予約チェックイン チェックアウト
Electronとは Electronとは、GitHubが開発したオープンソースのフレームワークです。macOS、Windows、Linuxといったクロスプラットフォームに対応したデスクトップアプリを開発することができます。 ChromiumとNode.jsを使用しているため、HTML、CSS、JavaScriptなどのWeb技術を駆使してデスクトップアプリをつくれるのが大きな特徴のひとつです。 エンジニアにはお馴染みのVSCodeやSlackをはじめ、FigmaやTwich、Microsoft TeamsなどのデスクトップアプリにもElectronが採用されています。 そんなElectronを完全に理解するために、お約束のHello Worldから入門してみました。 WindowsでHello Worldしてみる 本記事ではWindowsでの環境構築とアプリのインストーラー作成までの流れ
josdejong氏作のJSONエディタを、Electronでデスクトップ用アプリに移植しました。 github.com 元のJSONエディタはこちら。めちゃ高機能で便利。 僕が書いたコードはたった200行くらいです。 github.com なぜ作った 仕事でイベント用のUnityアプリを作る事が多い 現場でパラメータを調整するために、パラメータをJSONやCSVファイルに出しておくことが多い SRDebuggerとかでアプリ内に設定画面を作る事も多いけど、その時間すらない事もある プログラマー的にはJSONを使いたい プログラマー以外の普通の人にとっては、JSONの編集は難しい CSVはエクセルで編集できて便利という世界観 普通の人が使えるJSONエディタがほしい オンラインJSONエディタは良い奴がたくさんある exeで欲しいんだが!!! Electronでラップしたら良いのでは? E
最近ScrapboxをデスクトップPWAとして使い始めました。 やはりデスクトップアプリとしてDockに表示されるだけで体験はすごく良くなるなー PWAもっといろんなサービスで使えるようになってほしいです(オフライン動作とかとりあえず要らないんでアプリとしてインストールだけでもさせてほしいなぁ) Webサービスのデスクトップアプリ化で感じる利点は、具体的にはショートカットやSpotlightで呼び出しやすいといったことくらいなのですが、OSのインタフェースから自然に使えるという体験はヘビーユースしているWebサービスを更にヘビーに使うきっかけになりえるなと。 自分自身、よく使うWebサービスは個別アプリにしたいと日頃から思っており、Electronを使ってよく使うWebサービスは個人利用用にアプリ化したりしてました。 ただElectronはアプリサイズが大きいのと、Gmail等一部のWeb
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Electronを使えばWindows/macOS/Linuxなどマルチプラットフォームで動作するソフトウェアがHTML/JavaScript/CSSで作成できます。作ってみたいと思いつつも、環境を整える手間で躊躇してしまっている人もいるのではないでしょうか。 そんな方に使ってみて欲しいのがFiddleです。ダウンロードしてすぐにElectronアプリ開発がはじめられるソフトウェアです。 Fiddleの使い方 Fiddleを起動したところです。 開発環境は3ペインになっています。左側にあるJavaScript、右にあるHTMLを編集するのが基本です。 開発したらElectronアプリとして実行できます。各バージョンのElectronがFiddle上で簡単にダウンロードできます。 実
はじめに こんにちは、@tsuwatchです。普段はRubyを書くのですが、仕事の幅も広がりつつあり、フロントエンドも本格的にやっていこうということで、 Kaizokuというニコニコ生放送のデスクトップアプリをリリースしました。 人生の大半の時間がニコ生に溶けているわけですが、かねてからコメントビューワを作ろうと思っていたので、この機会に作ってみました。 しかし、Mac版のコメントビューワにはHakumaiという大変素晴らしいコメントビューワが存在するので、少し違う方向を向いた生放送ビューワをかねたアプリにしました。 Hakumaiはコメントビューワとしては数少ないオープンソースなので、実装やコメントサーバの仕様など大変参考にさせて頂きました。この場をお借りして、お礼を申し上げます。 アプリの機能や今後についての紹介はまた別途ブログで書くと思います。 ご興味がありましたら、ぜひ使ってみてい
はじめに これはElectronを使ったアプリケーション開発の学習記録のためのものです。ゼロから初めて1週間たったので、記録します。 今回は、情報の洪水の整理と、参考サイトのまとめです。 Electronとは テキストエディタであるAtomエディタ(*1)の開発元(GitHubの創業者)が開発した、マルチプラットフォームで動作するディスクトップアプリケーションをWeb技術(with JavaScript, HTML, and CSS)で開発できるフレームワーク(*2)です。 *1 https://blog.codecamp.jp/atom_utility *2 http://www.buildinsider.net/enterprise/electron/01 ちなみに、Atom(原子)→Electron(電子)です。またElectronのテストツールの名前はSpectron(分光法)です
Electron + Vue2 + Vuex + Flow + BootStrap4 + AWS RekognitionのスタックでTwitterクライアント書きました。 本アプリは【Electron + react + flowtype】TweetDeckライクなpixivクライアントPixivDeckをつくった - Qiita に思想・設計共に大きく影響を受けて作りました。本当にありがとうございます。 Github - yuki-ycino/imecoletter: 最高の画像を集めるためのTwitterクライアント 諸事情(というか実装の都合上AWSの請求が大変なことになるため)バイナリの配布はできません。 簡単にビルドできるようにはしてあるのでもし興味がある方がいれば使ってみてください。 スクリーンショット TwitterのTLから画像ツイートのみを表示 Twitterから画像ツイ
Vue.jsとElectronでシンプルなTwitterクライアントを作った。 vue-twitter-client きっかけとしては一言で言うとフロントエンド周りの勉強。 2017年1~3月の振り返りにも書いた通り。 自分はモダンなフロントエンドの開発に疎かったので重い腰を上げてそろそろやるかという気持ちになって3月中頃くらいからはじめた。 Vue.jsについては2,3週間前くらいから触りはじめている。 Vue.jsはちゃんとしたSPAからフォームにちょいと味付けみたいな使い方もできたり小回りがきく。 個人的にはReactでの開発よりやりたいことが直感的に書ける気がしてるので使いやすいという印象。 とりあえず最初はTODOアプリやAPIを叩く小さなフィードを作って、次にNuxt.jsでSSRできるミニサイトを作ったりで大体使い方は覚えてきたというステータス。 ライブラリでいうとvuex,
チャットボット全盛時代。ElectronとMicrosoft Bot Frameworkを使って、スクラム開発のためのちょっとまじめなチャットボットを作ってみました。 チャットボットはますます存在感を増しています。FacebookはMessengerボットの開発フレームワークの提供を開始し、ビジネスオーナーがFacebookのメッセンジャーアプリ内だけで顧客に対応できるようにしました。ピザの注文、次回検診の予約、次の旅行のための最安値便の検索、なんでもできます。メッセンジャーアプリのコンタクトリストから、友人に連絡するように、知りたいことをボットに尋ねてください。 Facebookメッセージング部門副社長(VP)David Marcusは、11月に開かれたWebサミットでFacebookのチャットボットへの取り組みについて語りました。今後ユーザーとビジネスオーナーがメッセンジャーで顧客に対
今回は、EletronをVue.jsでどうやって使うか、セットアップをするかを記事に書いていきたいと思います。 このアドベントカレンダーの23日目の、@nakajmgさんと内容が少し被ってしまいそうで申し訳ない気持ちでこの記事を書かせていただきます! 最新のやり方 2017年度版の記事を、 @1ntegrale9 さんが書いてくださったので是非ご覧ください! 2017年度版 electron-vueで始めるVue.js 前提 Node.jsが入っていることを前提にかいています! インストール まずは、npmから vue-cli をインストールします。インストール後、 vue コマンドが使えれば成功です。 vue-cliは、Vue.jsの公式のCLIでいい感じのテンプレートを使用してプロジェクトを始めることができます。 プロジェクトの作成 今回は electron-vue(日本語ドキュメント
Webの技術でデスクトップアプリが作れるフレームワークといえばElectronが有名ですが、より手軽に使えるのがNW.jsです。デザイナーでもちょっとしたデスクトップアプリならすぐに作れちゃいますよ。 NW.jsは、HTML、JavaScript、CSSといったWeb技術を使ってネイティブアプリを作るフレームワークです。一番単純なケースだと、手慣れたワークフローでWebアプリを作り、最後にジェネレーターですべてをコンパイルして、ブラウザー同様にWebアプリを表示できるネイティブアプリを作ります。このようなアプリケーションは「ハイブリッドアプリ」と呼ばれます。 ハイブリッドアプリがすばらしいのは、単になじみのある言語(HTML、JavaScript、CSS)で書けるというだけでなく、本質的に次のような普通のWebアプリよりも優れた点があるからです。 ブラウザーの種類とバージョンをコントロール
A fully extensible and open source launcher for hackers, creators and dabblers. It comes with sane defaults to make it useful out of the box. But everything can be changed to fit your needs. Don't let others tell you the best way to be productive, configure it to be perfect for you. If you are just getting started, check out the Getting Started guide. Action Shots Introduction Video Package Manage
この記事は Electron アドベントカレンダー2016 の13日目の記事です. 本記事では,僕が Electron アプリをつくる上で便利だったり,ほしかったのでつくったりしたパッケージを7つほど紹介します. electron-about-window electron-dl electron-in-page-search electron-window-state menubar node-auto-launch electron-mocha electron-about-window electron-about-window は 'このアプリについて' ウィンドウを簡単にクロスプラットフォームにつくるためのパッケージです.下記のように関数を1つインポートして呼び出すだけで「このアプリについて」ウィンドウを生成することができます.(example) import openAbout
Electronとは? Electronは JavaScript、HTML、CSS を使ってデスクトップアプリケーションを作ることができる ライブラリ です。作ったアプリケーションはMac、Windows、Linuxで動かせます。 次は: なぜ重要? 定義: JavaScript、HTML、CSS はWeb用の言語で、Webサイトの基本的な構成要素です。Chromeなどのブラウザは、コードをふだん目にするグラフィックに変えて表示します。 Electronはライブラリです Electronはコードですが、再利用でき、自分で書き起こす必要がありません。ユーザはその上にプロジェクトを構成します。 参考資料 Apps built on Electron Electron API Demos (Electronで何ができるかをみてください) なぜ重要? 一般に、デスクトップアプリケーションは各オペレ
Electronプログラミング入門 — インストールからミニブラウザ構築まで 古川陽介 Electronとは、デスクトップクライアントを作るためのフレームワークです。クロスプラットフォームで動作することをサポートしているため、Electronで作ったアプリケーションはMac、Windows、Linuxの環境でも動作します。Atomと呼ばれる GitHub社製のエディタがあります。 ElectronはAtomを作る際にフレームワークとして作られました。以前はAtomShellと呼ばれていましたが、Electronとして名前を変更し、2016年にはversion 1.0がリリースされるまでに成長しました。 ElectronはJavaScript / HTML / CSSを使ってクライアントアプリケーションを作成します。中のアーキテクチャはChromiumとNode.jsで作られており、Web開
自己紹介 じゅんじゅんというニックネームで、関西を拠点に活動しているフロントエンドエンジニアです。 HAL大阪の2回生です👍 (2016.9.9現在) よくstart up系イベントに行くので、大阪らへんの方は会いましょう! 作ったもの 今回は ElectronとReactで作ること しか決まってないので、リアルタイムプレビューの機能だけしかつけていません。 できたもの。 今回作った経緯 今回は、いつもREADMEとかを書くときにsublime textのOmniMarkupPreviewerを使っていたんですが、全然動かない。。 なぜか分からないので、勉強を兼ねて作ることにしました。 今回使う技術は Electron React ぐらいです。 Editor部分はAceを使いました。 Markdownのpreviewには、markedを使いました。 Electronに関しては、ほぼサンプ
【Electron + react + flowtype】TweetDeckライクなpixivクライアントPixivDeckをつくったflowpixivReactElectronredux electron + react + flowtype + styled-components + webpackでpixivのデスクトップアプリを書いた。 前半にアプリについて、後半に技術的なことを書くので、どんな技術を使ったかのみ知りたい人は前半飛ばしてください。 GitHub - akameco/PixivDeck: TweetDeck like pixiv client for desktop ダウンロードページ スクリーンショット TweetDeckライクなpixivイラストビューア スクロール(IntersectionObserverで画像の遅延読み込み) カラムの移動(react-sort
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く