TOP カテ一覧 スレ一覧 100〜終まで 2ch元 削除依頼
ねねっちと一緒にプログラムを勉強するスレ第3話
【PHP】下らねぇ質問はここに書き込みやがれ 10
インデントを強制しても綺麗なコードにはなりません
vbs初心者なんですが
表計算ソフトは人類の生産性を大きく下げている
Windows 10 UWPアプリ開発 Part 2
【独学】一人で勉強する奴らのスレ【自習】
C#,C#の宿題片付けます。
.netグレープシティコンポーネント
【知識】俺のためのプログラム覚え書き【共有】
【Electron】ハイブリッドアプリ開発総合【Cordova】
- 1 :2017/07/02 〜 最終レス :2020/04/14
- HTML5,CSS3,JavaScriptなどWeb標準技術を活用したアプリ開発についてのスレです。
各種フレームワークの他、webviewの利用、PWA(AMP)、ブラウザ拡張機能など板選びに迷ったらこのスレに書き込んで下さい。
副次的な話題としてビルドツールなど開発環境に関する話も可。
主なフレームワーク
Electron
https://electron.atom.io/
NW.js
https://nwjs.io/
Apache Cordova
https://cordova.apache.org/
PhoneGap
https://phonegap.com/
ReactNative
https://facebook.github.io/react-native/
NativeScript
https://www.nativescript.org/
VIPQ2_EXTDAT: checked:vvvvv:1000:512:----: EXT was configured
- 2 :
- 関連事項
UWP(JS)
https://docs.microsoft.com/ja-jp/windows/uwp/get-started/create-a-hello-world-app-js-universal
Progressive Web Apps
https://developers.google.com/web/progressive-web-apps/
WebExtensions
https://developer.mozilla.org/ja/Add-ons/WebExtensions
- 3 :
- さんげと
- 4 :
- 何でこんな危険なもの使うの
- 5 :
- どう危険なの?
- 6 :
- windows7以降しかサポートしてない!!!!!!!!!!!
- 7 :
- 人少なっw
ところで、Web技術を流用したUIを総称する言葉って何かある?
- 8 :
- パフォーマンスの問題とかはwasm使っていく流れになるのかな
web界隈は予測がつけづらいね
- 9 :
- electronいいよね・・・って人いなーいw
いまどきのJSプログラマーのための Node.jsとReactアプリケーション開発テクニック
2017/7/26<<もうそろそろ発売するよ。
- 10 :
- electronは若干動作不安定と感じる
かといって他のはあまりやる気にならない
- 11 :
- パッケージの容量がでかいのはなんとかしたいよね
自前のChrome使わせるとかできんのか
- 12 :
- 今更だけどElectronで2chブラウザ的なもの作ってるよ
- 13 :
- 初のcordovaアプリ作った
https://hasemonmon.net/df5/
トランプの大富豪です
ビルド済みはandroid用しかないけどWebで同じ内容がプレイ可能です
- 14 :
- クオリティ高いな
どうせandroid限定ならPWA化したらどう?
- 15 :
- >>14
見てくださってありがとうございます
こっち方面は最近始めたばかりでいろいろ事情がわからないことだらけでぐぐりながら試行錯誤の毎日です
PWAについて簡単にぐぐってみましたが今まで全く知らない事でした
最近はこんなものがあるんですね
色々勉強させてもらいます
ありがとうございました
- 16 :
- Mac持ってないiPhone利用者です
monacaとかXamarin live player使う以外にMac(XCODE)なしでiPhoneアプリ作るのってムリ?
- 17 :
- 実機かサービスかどっちかは必須
- 18 :
- CordovaとXamarinはどちらがおススメ?
- 19 :
- 得意な言語、好きな言語で選びなさいとしか
個人的な期待値は同程度
- 20 :
- iconvのインストールでいろいろとモヤるな…
iconv-liteでたいていのことはクリアできるから、まあ良いか…
- 21 :
- ところでオレのグローバルインストール一覧をみてくれ
$ npm ls -g | grep '^[+`].*'
+-- asar@0.13.0
+-- eslint@4.10.0
+-- npm@5.5.1
+-- tslint@5.8.0
`-- typescript@2.5.3
- 22 :
- ハイブリッドアプリはじめて触るんだけどhtml,css,Javascriptだけで出来ることはcordovaで出来るっていう認識で大丈夫?
- 23 :
- はい
- 24 :
- PWA来たね
https://www.sbbit.jp/article/cont1/34605
- 25 :
- chromeだとフォーム部品がフォーカスされた時のoutlineの色は水色ですが
electronだとオレンジ色になります
何故違うんですか?
- 26 :
- cssで消すか好きな色にすればいい
- 27 :
- それはそうなのですが
同じChromeから出来ているはずなのに何で色が違うのでしょうか
- 28 :
- Electronで、
CSSで作ったセレクトボックスを
トラックパッドでクリックして閉じると、hoverした部分の色が残ってしまう
(マウスでクリックした場合は正常)
という奇妙な現象が出ていたので、
Electronをアップデートしたら直りました
開発中のモジュールアップデートには抵抗がありましたが
Chrome同様こまめにアップデートしていった方がいいのでしょうね
ただ、それでもoutlineのデフォルト色がオレンジ色なのは変わりませんでした
- 29 :
- Electronについてですが
トラックパッドで画面をクリックするとCSSのhover状態がキャンセルされると気づきました
hoverで変化するようにしている箇所が、クリックすると非hoverの表示になってしまう
マウスカーソルを動かすとまたhover時表示に戻る
という挙動です
このトラックパッドというのはmacbook proのもので、
bootcampでwindows10を使っています
Chromeではこのような挙動はありません。
>>28の挙動とも関連してそうです
- 30 :
- おそらくクリック時にマウスカーソルがそこにないものと判断されてしまうのではないか
と予想しています
ハード的な問題かと考えましたが、それだとChromeで症状が出ないのがおかしい。
ChromeとElecronの間の微妙な差異の中でバグが生まれてしまっている感じです
- 31 :
- ためしにmousemoveをconsoleに出力してみましたが、
クリックしてもmousemoveイベントは発生しませんでした
おそらく原因はCSS処理の層にあるのでしょう
- 32 :
- ビルドしたら現象消えるんじゃね?
と思ったのですが、逆に>>28で消えたと思っていた症状が
ビルドしたらまた出るようになりました・・
- 33 :
- >>28の件ですが
マウスアウトが表示に反映されるまで待てばいいのでは?と考えて
setTimeoutを使ってセレクトボックスを閉じるのを後回しにしたところ、解決しました
- 34 :
- ・CSSはどの定義が優先されてるのか
・各イベントは発火しているのか
・Electronじゃないと起こらないのか
浅い連投する前にデベロッパーツールともっと向き合って
- 35 :
- electronで
BrowserWindowを上や下や左や右に揃えて表示するにはどうしたらいいのでしょうか?
中央揃えのためにはcenterというオプションがありますが
- 36 :
- >>35の件ですが
https://github.com/electron/electron/blob/master/docs/api/screen.md
このscreenモジュールを使えばディスプレイのサイズを取得できると分かりましたが
electronの座標系はディスプレイの座標系よりも少し小さいようです
ウインドウを左揃えにするために
ウインドウのxを0にすると、左側に8ピクセルくらいの隙間が空きます
ウインドウを右揃えにするために
ウインドウのxを、画面幅 - ウインドウ幅にすると、同様に右側に8ピクセルくらいの隙間が空きます
またディスプレイの実際のピクセル数は1280×800ですが、
screen.getPrimaryDisplay()で取得できるディスプレイサイズは、1024×640です
この数字の差異は、electron内部で独自の座標系を持っているからのようで、
そのこと自体は別にいいですが、余計なマージンが入るのは困ります
たとえばxを0ではなく-8とかにすれば、左揃えには出来るのですが、
マージンが何に由来するのか分からないので、ハードコーディングするのは抵抗があります
どうなのでしょうか?
- 37 :
- https://gist.github.com/hisasann/a99b7e4aa5f2c9cfc7eb
electronの座標系のpaddingに言及しているページがありました
ただleftやtopを0、widthやあheightを画面サイズにすればウインドウが全画面になる
と書かれているので、この時点と今では挙動が変わっていそうです
ともかくこの座標系レベルのpaddingは意図的に作られたもののようです
- 38 :
- Electronではじめるアプリ開発
~JavaScript/HTML/CSSでデスクトップアプリを作ろう
野口 将人・倉見 洋輔、2017
この本では、1280×800(735), scaleFactor: 2 とか
screen.getAllDisplay()[0] を見てみれば?
- 39 :
- >>38
ありがとうございます
getAllDisplayとgetPrimaryDisplayが返す値は同じでした
ただ、その本とは異なり、scaleFactorは1.25でした
多分、このscaleFactorが、
Electron座標系とディスプレイ座標系の対応関係を決めているのだと思いますが。
その本は、Retinaなどの画素数が多い環境に基づいているのでしょうね
- 40 :
- <meta name="viewport" content="width=device-width,
initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
HTML のviewport の、initial-scale みたいなもん
- 41 :
- ありがとうございます
ということは、設定可能な項目なのでしょうか
何か色々知識が足りてない気がするので「Electronではじめるアプリ開発」をぽちってみました
- 42 :
- 漏れも、よくわからない
screen モジュールの機能を見て
- 43 :
- ElectronではipcMainとipcRendererを使って
レンダラープロセス→メインプロセスへのIPCのsendと
それに応対してのメインプロセス→レンダラープロセスのsendは出来ますが
メインプロセスを起点にしたレンダラープロセスへのIPCは出来ないようです
メインプロセス側のタイミングでレンダラープロセスを呼びたい時はどうすればいいのでしょうか?
- 44 :
- >>43
BrowserWindowオブジェクトのwebContentsプロパティに対してsendメソッドを発行することで出来ました
- 45 :
- ElectronがAndroid対応になるのはいつぐらい?
ロードマップはある?
誰がやってる?
- 46 :
- ないよ
- 47 :
- ウインドウのalwaysOnTopをトグルする処理をしようと思います
レンダラプロセス中のwindowがBrowserWindowオブジェクトなのかと思って
レンダラプロセスの中で
window.setAlwaysOnTop(true);
とやってみたのですが、エラーになりまりした
windowはBrowserWindowオブジェクトではなかったようです
レンダラプロセスの中で自分自身のBrowserWindowオブジェクトにアクセスするにはどうしたらいいのでしょうか?
- 48 :
- APIドキュメントを見ても、レンダラプロセスから自身の外観を変えることはできないようなので
IPCでメインプロセスを呼ぼうと思ったのですが
メインプロセス側でレンダラプロセスのBrowserWindowオブジェクトを確定するには
どうするのかという問題が出てきました
マルチウインドウのアプリなのでレンダラプロセスが複数あります
メインプロセスが受信するeventのsenderには、webContentsが入っているとドキュメントにあります
このwebContentsは、BrowserWindowのプロパティの一つだそうです
ですがwebContentsには、自身を所有しているBrowserWindowを取得するメソッドがないっぽいです
idプロパティを持っているので、
BrowserWindowオブジェクトのリストをループさせて比較するという方法で見つけることは出来そうですが
こういう方法しかないのでしょうか?
- 49 :
- >>48
もっといい方法があるのかないのか分かりませんが
idを使って同定するようにしました
- 50 :
- electronで新しいBrowserWindowを作る時
若干待たされる感があるのが気になっていたのですが
前もって非表示のスペアウインドウを作っておいて必要なタイミングでshowするようにしたら、
気持ちいい動作になりました
これはelectronに限らず複数ウインドウを使うアプリを作る時には定石なのかもしれませんね
- 51 :
- electronについてです
ipcMain/ipcRendererにはsendSyncがありますが
webContentsにはsendのみでsendSyncがないようです
何故でしょうか?
- 52 :
- >>47の件ですが
「Electronではじめるアプリ開発」を読んでいたら
remoteモジュールのgetCurrentWindow()を使えば
レンダラプロセスから自身のBrowserWindowオブジェクトを取得出来ると出てきました
remoteモジュールはgetGlobalでメインプロセスのグローバル変数も取得できるという
なかなかすごいモジュールです
- 53 :
- remoteを使うようにしたら
泥臭いIPCのコードをほとんどなくせますね
remoteを使うためにはIPCを理解することが重要なので、無駄だとは言いませんが・・
- 54 :
- >>52の件ですが
メインプロセスの配列をレンダラプロセスからremote.getGlobalして
メインプロセス側でその配列を破壊的に変更すれば
レンダラプロセス側でもその変更が反映するのだろうと思っていたのですが、
どうも反映しないようです
remote.getGlobalで配列は参照渡しできないのでしょうか?
- 55 :
- electronで、オブジェクトが(remoteで取得した)リモートオブジェクトかどうかを
コード上から調べる方法はあるのでしょうか?
consoleに出力しても普通のオブジェクトと全く同じに見えます
- 56 :
- https://github.com/electron/electron/blob/v0.35.0/atom%2Frenderer%2Fapi%2Flib%2Fremote.coffee
remoteのソースコードがありました
配列とオブジェクトの処理は異なっていて
オブジェクトの場合、メソッド呼び出しやプロパティの読み書きでIPCが呼び出されるが
配列の場合は値渡しになる、という挙動のようです
- 57 :
- グローバルショートカットキーの修飾キーとしてWindowsキーを使いたいです
https://github.com/electron/electron/blob/master/docs/api/accelerator.md
ここにWindowsキーはSuperと書くとありますが、
Super+R
みたいに書いても動作しません
Alt+Ctrl+R
のようにSuper以外の書き方ではちゃんと動作しています
なぜでしょうか?
- 58 :
- 開発フレームワークElectronのエクスプロイトでWebとモバイルの人気アプリが危険
https://jp.techcrunch.com/2018/05/15/2018-05-14-exploit-puts-popular-web-and-mobile-apps-at-risk/
これを見て、バージョンアップしておいた方がいいのだろうと思って、
electronのバージョンアップをして
使ってるパッケージもついでにバージョンアップしました
leveldbのパッケージはネイティブモジュールなので、electron-rebuildでリビルドしようとしたのですが
An unhandled error occurred inside electron-rebuild
Could not detect abi for version 2.0.0 and runtime electron.
Updating "node-abi" might help solve this issue if it is a new release of electron
と言われました
ABIとか言われても、何を言っているのか分かりません
どうしたらいいのでしょうか?
- 59 :
- >>58の件ですが
検証するためにプレーンなelectronプロジェクトを作ってみて、leveldbをリビルドしたら無問題。
エラーの出るプロジェクトでモジュールの再インストールなどを繰り返しながら原因を探したところ
なんとelectron-rebuildのコマンドヒストリーからいつの間にか引数が一つ消えていたことが原因でした
electronのバージョンアップはまったく関係なかったです
失礼しました
- 60 :
- 僕の知り合いの知り合いができたパソコン一台でお金持ちになれるやり方
役に立つかもしれません
グーグルで検索するといいかも『ネットで稼ぐ方法 モニアレフヌノ』
2BIZV
- 61 :
- 7UF
- 62 :
- Electron Fiddle
https://github.com/electron/fiddle
こんなのあった
electronアプリが動かせるプレイグラウンド
なかなか良さそう
- 63 :
- user32.dllとか winapi呼び出せますか
- 64 :
- 特定のサイトを便利に使うための専用ブラウザを作ろうとしたけど、セキュリティーの扱いが難しくて断念した
- 65 :
- >特定のサイトを便利に使うための専用ブラウザ
2ちゃんの専ブラみたいので他サイトの奴?
発想は良さそうな気がするけど
セキュリティで引っかかるのも分かる
- 66 :
- Android NDKとObjective-C使うと
AndroidとiOSアプリってほぼワンソースでできたりする?
- 67 :
- Objective-Cはネイティブコードじゃないよな。
iOSに特化したコーディング言語何で無理に100ペリカ。
- 68 :
- だれかquasar frameworkという奴を使ってみて
- 69 :
- Chroniumは、普通のJavaScriptでは使えない「同期wait処理」が行える
ようになっていることも特徴の1つかも知れない。
この機能により、「Modal」なDialogが作れる。
よく知らないが、ライバルのCordovaはそれが出来ないかもしれない。
ここで言ってる「同期wait処理」とは、sleep(1000);とすると、
単純に、1000(ms)待って戻ってこないという普通の言語では昔から
当たり前にあったような機能のこと。
JavaScriptではこのような単純な「待機処理」が出来ないらしく、。
待機したい場合は、大体、以下の2種類の方法しか使えないらいい:
1. 以後の処理を関数に分けて、タイマーイベントのコールバック関数として指定する。
しかしこれだと、for 文の中で sleep したい場合などは、難しい気がする。
2. async, await を使う。しかし、これだと、async 修飾された関数を呼び出した側には
にはすぐに帰ってくるので、ちゃんと wait したことにはならない。
- 70 :
- electronを最近始めたんだけど
コレ読んどけ的ないい本ないかしら?
- 71 :
- >>70
プログラム初心者じゃないんでしょ?
そこらのブログと公式ページのリファレンス見れば事足りるよ。
バージョンアップが早いから書籍だと情報が古いと思う。
- 72 :
- >>71
macでやってる人が多いんだけど
macじゃなきゃ安定しないの?
ubuntuでwinのインストーラー作ってみたけど起動しない(´・ω・`)
- 73 :
- >>72
windowsでいい
electron-packagerとelectron-builderどっち使ってる?
- 74 :
- electron-builderでやった
おすすめだって聞いたので
- 75 :
- >>72
Electronを使いたがるMacユーザーが多そうに見える原因として考えられるもの:
1. Macは、東大が、学生に「標準パソコン」として指定してる。
東大の学生は優秀なのでQiitaなどに沢山の技術的な記事が書かれる。
2. Macユーザーにとっては、マルチプラットフォーム開発が重要となる。
- 76 :
- 東大生はあんな頭悪いqiita書かないよ多分。。。
- 77 :
- Windowsはどんなバカでも使えるようにレガシーな機能もずっと保守し続けてる
そのせいで最新の機能が制約されてたり、MACに比べたらいろいろと劣ってる
消費者ならWin、働くためのツールならMacだよ
- 78 :
- つまり
electron開発ならmacを買え、と
- 79 :
- 関係ありません
- 80 :
- >>79
どの環境でやってるの?
- 81 :
- 以前はmacで開発してたけど今はWindowsでやってるわ
VSCode使ってるから大して変わらん
- 82 :
- テスト用にはどの環境もあったほうがいい
マルチプラットフォームだけど表示や挙動がそれぞれ少しずつ違うこともあるから。
ただWindowsだとnpm install -gでPATHが通らなかったりcross-env使わないと環境変数設定できなかったりするので開発はubuntuやMacの方がやりやすかったりする
んでMac使うことで開発モチベーション上がるならMac使えばいいだけ
- 83 :
- ろくな知識もないやつの書き込み
- 84 :
- >>82
サンクス
- 85 :
- 2ちゃんねるなんてそんなもんよ
意見あるなら反論訂正すればいいだけ
- 86 :
- npx コマンドで、node_modules 内のプログラムを、パス無しで実行できる
例、npx gulp
- 87 :
- npxは知ってるがそれで対処できない例外として
例えばnpmでyarnを入れるチュートリアルを見た初心者が躓く
ネットに書いてるコマンド通りに実行しても、うまくいかない可能性がwindowsの方ではやや大きくなる
- 88 :
- 親が裕福でない限り、どんなに頭が良くてもWindowsを使うことになるハズ。
食っていかなきゃならないからだよ。
- 89 :
- 一番安いmacでいいじゃん
- 90 :
- gulp, npm scripts に書くとか
Webデザイナーの仕事を楽にする! gulpではじめるWeb制作ワークフロー入門、中村 勇希、2018/5/29
- 91 :
- >>89
・PC/ATの場合、自作機にすれば、物凄く安く付く。買い直さずに好きな部分だけ
変えていけばいいので、特に箱(筐体)はいつまでも同じものが使える。電源も。
・一般人の大部分が Windows使ってるので、一般向けの何かを作って食って
いくためには Windowsでないととても不利になる。
- 92 :
- 外部からのデータ取得ってmainプロセスrendererプロセスどっちでやるべきなの?
javascript勉強中でとりあえず題材として2ch専ブラ作ってるから板やスレの一覧とかなんだけど
main側のnetモジュールとかにお願いするのかfetchとかでrenderer側で完結させるべきなのか
それぞれの使いどころとかも知りたい
- 93 :
- mainプロセスじゃん?
- 94 :
- 漏れはスクレイピングを、Ruby, Nokogiri, Selenium WebDriver でやってる。
GUI は、HTML, CSS, JavaScript
自動ログインも、やってる
- 95 :
- コルドバってhttp鯖はリモートでも動くのね
知らんかった
- 96 :
- >>94
electronスレでなぜそんな告白?
- 97 :
- >>94
Rubyキチここにもいたのか
- 98 :
- >>92
レンダラーの役割はメインから受け取ったデータをもとに描画することだよ
基本的にデータの取得はメイン
- 99 :
- まじかめんどくさそう
こういうのどういう風に書いたらいいのか
ipcMainとipcRendererでイベント管理すんの?
あと参考になりそうなossプロジェクトあったら教えてくださいな
- 100 :
- レンダラー側でも取得はできるけど
キャッシュの管理はメインでやる必要があるから
メインでデータ取得してレンダラーに渡すほうが使い分けがはっきりしていいかなと思う
ipcイベント管理がちょっと複雑になるけど
同期通信はipcRenderer.sendSync()で書ける
100〜のスレッドの続きを読む
【.NET】WCF〜Windows通信基盤技術【通信】
スレ立てるまでもない質問はここで 153匹目
C++相談室 part143
今だからこそ2ch代替サービスの実装を考えるスレ
俺主催囲碁プログラミングコンテスト
ATL/WTL Part7
【SL4】Windows Phone 7 アプリ開発スレ Part4【XNA】
C言語なら俺に聞け 147
UNIXプログラミング質問すれ Part10
プログラマが使ってはいけないテキストエディタ
--------------------
事務所上層部「現時点の関西Jr.ではデビューはない」
NEWS23★3
iPad Air 10.5 Part 5
ラジオ中毒の喪女 2ヘルツ
【八王子】「元カレ」呼び出し“殴る蹴る”峯尾ケイン容疑者(20)と鈴木涼一容疑者(20)を逮捕
【バーチャル】hololiveアンチスレ#6768【youtuber】
【乞食】余ったビットコインを置いていくスレ Part2
【悪徳ガン商法】北斗晶闘病中★168★【闘病ショー】
【Bloodborne】ブラッドボーン 合言葉協力募集スレ
地獄少女カレー 九
【社会】技術が発展したのに労働や家事に追われ続けているのはなぜか?
【XY】ファッション総合スレ4着目
古事記 206
【横山裕二】十勝ひとりぼっち農園【サンデー】
【MVNO】nuroモバイル part3
【名古屋・尾張】愛知選挙総合スレ24【三河】
【PSVITA】乖離性ミリオンアーサーPart73【PS4】
京大 「自閉症の子は黄色が苦手で、緑色を好む傾向にある」、心当たりはないか [998671801]
昔の土曜ワイドラジオTOKYO
千葉県のローカル私鉄Part 2【小湊・いすみ・銚子】
TOP カテ一覧 スレ一覧 100〜終まで 2ch元 削除依頼