Next.js + Electron がとても簡単になっていた
Next.js + Electron を使えばめちゃくちゃ簡単にデスクトップアプリを作れるという記事です。 デスクトップアプリケーションをWeb技術で作成するElectronを、むちゃくちゃ久々にやってみたら、とても簡単になっていた React のフレームワークである Next.js もバージョン9.xになってから劇的に良くなり続けていて、どんどん触りやすくなっています ちなみに Next.js は非公式な日本語翻訳が進んでいるようです。 9割くらい翻訳が完了しているようですが、気になる方は、このサイトの「翻訳プロジェクトについて」をご覧ください。 セットアップする # npmの場合 $ npx create-next-app --example with-electron-typescript hoge $ cd hoge $ npm run build $ npm run start
Electron製アプリの起動速度を1,000ミリ秒速くする方法
めっちゃダッシュするイヌさん英語で先に書いてから日本語訳しています ⇒ English version is available here. こんにちは、TAKUYAと申します。InkdropというMarkdownノートアプリを開発しています。このアプリはElectronで作っています。Electronは、NodeJSとChromium(ブラウザ)ベースでクロスプラットフォームなデスクトップアプリが開発できるフレームワークです。このフレームワークは基本的に素晴らしいです。なぜならあなたはネイティブ用のフレームワークを学ぶ必要がなく、JavaScript、HTMLとCSSでアプリが作れるからです。もしあなたがウェブデベロッパーだったら、手軽にアプリが作れるでしょう。一方で、多くの人がElectronの弱い点についても言及しています。それはアプリの起動速度が遅い傾向にある、という点です。僕のア
minimalytm - Minimal YouTube Music Player built with Electron
What is this? minimalytm is minimal cross-platform YouTube Music Player for Desktop. On your macOS and Windows toolbar and you can easily and fastly access YouTube Music. Supported Features - Access to the YouTube Music in your machine's toolbar - Multi Display support - macOS Mojave Dark Mode Support - macOS Hotkey (F7, F8, F9) and Touch Bar control support Creator
Sudachi beta
What is Sudachi? Sudachi is a timetable editor to list up your tasks in a day and organises their priorities at the beginning of the day. Make a timetable with Markdown Sudachi allows you to write a timetable with Markdown. The tasks in the editor area are shown in the timetable area. Edit a timetable easily The start time and required time of tasks can be edited easily by drag and drop in the tim
Vue.js + ElectronでTwitterクライアントを作った - razokulover publog
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,
Webページをデスクトップアプリ化 - nativefierを使ってみる - Qiita
nativefierとは 1行でシングルページWebアプリケーションをデスクトップアプリ化してくれる優れもの WebアプリをElectronでWrapし、Electron-packagerを使ってネイティブ( .exe .app ... )を出力するみたいです Githubリポジトリ : jiahaog/nativefier - Github 主としてOSX向けに開発したそうですが、Linux・Windowsでも動くそうです インストール npmでパッケージとして公開されています もしnpm入ってない人はbrewなりapt-getなりでNode.js入れて、npmインスコすると幸せになれます 注)アプデが非常に激しいので、本記事も極力最新版の情報に更新しています 既に入っている人はnpm updateしてもらえると整合性が取れるかと思います... 使いかた 試しに とすると、カレントディレ
BdashというBIツールをリリースしました - hokaccha memo
BdashというアプリケーションをElectronで作りました。 bdash-app/bdash: A simple business intelligence application. 以下からダウンロードしてインストールできます（現状まだMac版だけ）。 https://github.com/bdash-app/bdash/releases ざっくりとこんな感じのことができる。 SQLを書いて保存＆実行できる 結果を元にグラフを書ける gistで共有できる 現状で対応しているデータソースはMySQL、PostgreSQL（Redshift含む）、BigQuery 仕事でRedshiftを使って分析SQLを書くことが増えて、手元ではJupyter Notebookを使ってたんだけど、SQL書いてグラフを書くだけの用途には若干オーバースペックでもうちょっと簡単にできるといいなと思ったのがき
GitHub用のIssue Reader「Jasper」の開発を振り返ってみる - maru source
この記事はElectron Advent Calendar 2016の11日目の記事です。 この記事では僕がプライベートで開発しているJasperというGitHub用のIssue Readerについて書きました。 JasperはElectronで作られており、どういうものかを一行で説明すると「任意の条件にマッチしたIssueが流れてくるIssue Reader」です。 https://jasperapp.io/ https://github.com/jasperapp/jasper 今回はそのJasperの開発初期、リリース期、運用期での出来事を時系列でまとめました。 なので、技術的な話はあまり多くありません。 どちらかというと僕自身の備忘録としてJasperの開発史をまとめたものになっており、すごく長い記事になっています。 ご注意ください。 目次 開発初期 コンセプト 初期実装 フィード
【Electron + react + flowtype】TweetDeckライクなpixivクライアントPixivDeckをつくった - Qiita
【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
本を書くためのアウトラインエディタを作ってる - mizchi's blog
少し前からアウトラインエディタを作ってる。 こんなの (画面は開発中のものです) ファイルツリー 複数シート同時編集 ファイルツリーUIというのをスクラッチで初めて作ってみたんだけど、「当然こう動いて欲しいよな」というヒューリスティックな挙動をたくさん作るハメになってて学びがある。 なぜ作ったか 技術書を書いて Kindle Direct Publishing で販売しようと思って、Macで売れてるアウトラインエディタを一通り試したんだけど、惜しい物が多くて、個人的にしっくり馴染むものがなかった。なので、技術書を書く前に、自分が本を書くために必要なツールを作るところから始めることにした。 作家・藤井太洋に聞く 「小説を書くためのツール、Scrivener」 - DOTPLACE を読んで、その辺のアプリに対する感覚を自分でも意識して作ってる。Scrivener は wysysig なんで自
Electronを勉強していただけなのに... @ Meguro.es #5
Presented in http://meguroes.connpass.com/event/35123/
electron-viz - GUIのGraphvizチャートエディタ&ビューワー
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました Graphvizを使うとノードを使ったフローチャート、クラス図をはじめ様々なチャートを画像にすることができます。ただし最初に環境を整えるのが手間であったり、dotファイルを書いた後にコマンドで変換しなければなりません。 そんな手間暇を軽減してくれるのがelectron-vizです。Electronで開発されており、GUIでGraphvizを編集できます。 electron-vizの使い方 electron-vizのメイン画面です。左側がエディタ、右側にチャートが描かれます。 例えばこのような図を描きました。オートプレビューが有効になっていれば編集した直後にチャートが描かれます。チャートの内容はGraphviz チュートリアルよりお借りしました。 二つに分かれるサンプル。 さらに複雑
GitHub、Electron APIのサンプルコードなどを収録した「Electron APIs」をMacAppStoreで公開。
GitHubがElectron APIのサンプルコードなどを収録した「Electron APIs」をMac App Storeで公開しています。詳細は以下から。 Electron APIsアプリはGitHubが今年5月に公開した「Electron API Demos」のMac App Store版で、JavaScript, HTML, CSS, Electronを用いてクロスプラットフォーム対応のデスクトップアプリを作成するためのチュートリアルなどが収録されています。 The new Electron API Demos app contains code snippets to help get your app started: https://t.co/Ow2xN2ponC pic.twitter.com/vt63MJ9wp7 — Electron (@electronjs) 201
ElectronアプリのXSSでrm -fr /を実行する - Qiita
Electronアプリでxssを発生させると任意のコードが実行できるらしいのでrm -fr /を試してみます。 想定 web版とelectron版のあるチャットアプリケーションという設定です。攻撃者が用意したリンクをクリックすると、PC内のすべてのファイルを消し去るというシチュエーションを考えてみます。 用意 環境はホストmac OSX、ゲストにubuntu14.04環境をvagrantを利用し用意しました。 expressでリストとフォームからなる脆弱性のあるチャットをつくります。エスケープ処理をしてないので、任意のコードが実行できる状況です。 'use strict'; const path = require('path'); const express = require('express'); const app = express(); const ejs = require(
Hain - Electron製のランチャー
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 最近のランチャーは事前にアプリケーションを登録するものではなく、アプリケーションが自動で情報を収集してくれるタイプのものが主流になっています。 今回紹介するHainも同じく自動収集型のランチャーです。特徴的なのはElectron製ということです。 Hainの使い方 メイン画面です。Alt+スペースで呼出せます。 パスに入っているものであれば問題なく表示できる模様。 文字を入力してプログラムを特定します。 ElectronということはWeb技術で作られているということです。Windows向けに作られていますが、Electronであれば他のプラットフォーム向けにも提供できそうですね。 HainはElectron/JavaScript製のオープンソース・ソフトウェア（MIT Licens
Nyaovim上で動く ニコ生のコメビュを作ってみた - Qiita
インストール方法はリポジトリのREADMEに 実装 Nyaovimとは clever-fやcommittia.vimの作者であるrhysdさんが作成した neovim クライアント． Neovim msgpack-rpc API を用いて作られたelectron製GUI neovimクライアントです 詳しくは作者のrhysdさんのページがわかりやすいです Web Components と Electron でつくる Neovim フロントエンドの未来 vim側 if get(g:, 'loaded_comment_viewer', 0) || !exists('g:nyaovim_version') finish end function! OpenComelonView(liveId) abort call rpcnotify(0, 'comelon-view:open', a:live
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - hackjutsu/Lepton: 💻 Democratizing Snippet Management (macOS/Win/Linux)
GitHub - ragingwind/devdogs: DevdoGs, Unofficial Devdocs app
GitHub - james-proxy/james: Web Debugging Proxy Application
軽量・高速な“Electron”製のコマンドランチャー「Hain」NOT SUPPORTED
