Cross-Platform Dev Via Electron
-
Because I started running Ubuntu as my main desktop I needed my password creation app (C'YaPass - the WinForms version) on my Ubuntu desktop but wasn't sure of the best (or good) way to create a desktop app for Linux. I DuckDuckGo'd it and found Electron -- Electron is basically Node & Chrome engine that runs natively from your desktop. Visual Studio Code is an Electron app. Anyways, I had already created a very basic HTML5, JavaScript, Bootstrap version of my desktop app (C'YaPass : Never type a password again[^]) and that made the conversion to Electron very fast. Consistent on Windows, Linux, Mac The really cool thing is that when you run the app on Linux, Windows or Mac it looks exactly the same. Here's a snapshot : https://i.stack.imgur.com/yLq7E.png[^] Bootstrap It is interesting because Bootstrap helps create basic controls like we Windows Devs are accustomed to having. Installation Packages I just need to learn how to create an installation package for each platform now. It's really a simple idea (wrapping up browser so users think it is a desktop app) but it works really well. Completely Open Source FYI - You can get the source code at : GitHub - raddevus/CYaPass-Electron: The official C'YaPass desktop app built on Electron (runs on Windows, Linux, Mac)[^] Easy To Try Out You have to have Node (and NPM) installed. But if you do you just: 1. git clone https://github.com/raddevus/CYaPass-Electron 2. npm install 3. npm start
-
Because I started running Ubuntu as my main desktop I needed my password creation app (C'YaPass - the WinForms version) on my Ubuntu desktop but wasn't sure of the best (or good) way to create a desktop app for Linux. I DuckDuckGo'd it and found Electron -- Electron is basically Node & Chrome engine that runs natively from your desktop. Visual Studio Code is an Electron app. Anyways, I had already created a very basic HTML5, JavaScript, Bootstrap version of my desktop app (C'YaPass : Never type a password again[^]) and that made the conversion to Electron very fast. Consistent on Windows, Linux, Mac The really cool thing is that when you run the app on Linux, Windows or Mac it looks exactly the same. Here's a snapshot : https://i.stack.imgur.com/yLq7E.png[^] Bootstrap It is interesting because Bootstrap helps create basic controls like we Windows Devs are accustomed to having. Installation Packages I just need to learn how to create an installation package for each platform now. It's really a simple idea (wrapping up browser so users think it is a desktop app) but it works really well. Completely Open Source FYI - You can get the source code at : GitHub - raddevus/CYaPass-Electron: The official C'YaPass desktop app built on Electron (runs on Windows, Linux, Mac)[^] Easy To Try Out You have to have Node (and NPM) installed. But if you do you just: 1. git clone https://github.com/raddevus/CYaPass-Electron 2. npm install 3. npm start
Nice post. I'm assuming you can use TypeScript with Electron apps?
Latest Articles:
HTML Editor with Live Preview and Style Playground -
Nice post. I'm assuming you can use TypeScript with Electron apps?
Latest Articles:
HTML Editor with Live Preview and Style PlaygroundMarc Clifton wrote:
I'm assuming you can use TypeScript with Electron apps?
Yes, you actually can use TypeScript now too. The npm package that you pull to create an Electron app now includes it. The amazing thing is that you can build your app based upon Angular or other front-end technologies and then run it as a desktop app. I am amazed at how well it works. It really opens up a lot of opportunities. I am still flabbergasted by that first time I ran npm start on my app on Ubuntu and my app appeared. It's really cool!
-
Because I started running Ubuntu as my main desktop I needed my password creation app (C'YaPass - the WinForms version) on my Ubuntu desktop but wasn't sure of the best (or good) way to create a desktop app for Linux. I DuckDuckGo'd it and found Electron -- Electron is basically Node & Chrome engine that runs natively from your desktop. Visual Studio Code is an Electron app. Anyways, I had already created a very basic HTML5, JavaScript, Bootstrap version of my desktop app (C'YaPass : Never type a password again[^]) and that made the conversion to Electron very fast. Consistent on Windows, Linux, Mac The really cool thing is that when you run the app on Linux, Windows or Mac it looks exactly the same. Here's a snapshot : https://i.stack.imgur.com/yLq7E.png[^] Bootstrap It is interesting because Bootstrap helps create basic controls like we Windows Devs are accustomed to having. Installation Packages I just need to learn how to create an installation package for each platform now. It's really a simple idea (wrapping up browser so users think it is a desktop app) but it works really well. Completely Open Source FYI - You can get the source code at : GitHub - raddevus/CYaPass-Electron: The official C'YaPass desktop app built on Electron (runs on Windows, Linux, Mac)[^] Easy To Try Out You have to have Node (and NPM) installed. But if you do you just: 1. git clone https://github.com/raddevus/CYaPass-Electron 2. npm install 3. npm start
Here are some other options: ways-to-make-a-cross-platform-application[^] :-\
-
Here are some other options: ways-to-make-a-cross-platform-application[^] :-\
-
Because I started running Ubuntu as my main desktop I needed my password creation app (C'YaPass - the WinForms version) on my Ubuntu desktop but wasn't sure of the best (or good) way to create a desktop app for Linux. I DuckDuckGo'd it and found Electron -- Electron is basically Node & Chrome engine that runs natively from your desktop. Visual Studio Code is an Electron app. Anyways, I had already created a very basic HTML5, JavaScript, Bootstrap version of my desktop app (C'YaPass : Never type a password again[^]) and that made the conversion to Electron very fast. Consistent on Windows, Linux, Mac The really cool thing is that when you run the app on Linux, Windows or Mac it looks exactly the same. Here's a snapshot : https://i.stack.imgur.com/yLq7E.png[^] Bootstrap It is interesting because Bootstrap helps create basic controls like we Windows Devs are accustomed to having. Installation Packages I just need to learn how to create an installation package for each platform now. It's really a simple idea (wrapping up browser so users think it is a desktop app) but it works really well. Completely Open Source FYI - You can get the source code at : GitHub - raddevus/CYaPass-Electron: The official C'YaPass desktop app built on Electron (runs on Windows, Linux, Mac)[^] Easy To Try Out You have to have Node (and NPM) installed. But if you do you just: 1. git clone https://github.com/raddevus/CYaPass-Electron 2. npm install 3. npm start
Sory, but... YUCK! On any platform.
I have lived with several Zen masters - all of them were cats. His last invention was an evil Lasagna. It didn't kill anyone, and it actually tasted pretty good.
-
Sory, but... YUCK! On any platform.
I have lived with several Zen masters - all of them were cats. His last invention was an evil Lasagna. It didn't kill anyone, and it actually tasted pretty good.
CodeWraith wrote:
Sory,
Thanks for the apology. But, it's ok. I've been on the Internet / Web for a long time so negative comments don't bother me. If you notice there is an equal amount of hate and love for every idea that is on the Web so opinions are really very meaningless. If you like it, use it. If not, no worries. Blithely, I roll on. :rolleyes:
-
CodeWraith wrote:
Sory,
Thanks for the apology. But, it's ok. I've been on the Internet / Web for a long time so negative comments don't bother me. If you notice there is an equal amount of hate and love for every idea that is on the Web so opinions are really very meaningless. If you like it, use it. If not, no worries. Blithely, I roll on. :rolleyes:
raddevus wrote:
hate and love
I'm a CodeWraith, not a Sith Lord. Just tell me why anybody would use something like JavaScript and the whole baggage that's tied to its tail for desktop applications? Is it because every problem looks like a nail to someone with a hammer? Masochism? Would it be too little of a challenge if you used something else?
I have lived with several Zen masters - all of them were cats. His last invention was an evil Lasagna. It didn't kill anyone, and it actually tasted pretty good.
-
Because I started running Ubuntu as my main desktop I needed my password creation app (C'YaPass - the WinForms version) on my Ubuntu desktop but wasn't sure of the best (or good) way to create a desktop app for Linux. I DuckDuckGo'd it and found Electron -- Electron is basically Node & Chrome engine that runs natively from your desktop. Visual Studio Code is an Electron app. Anyways, I had already created a very basic HTML5, JavaScript, Bootstrap version of my desktop app (C'YaPass : Never type a password again[^]) and that made the conversion to Electron very fast. Consistent on Windows, Linux, Mac The really cool thing is that when you run the app on Linux, Windows or Mac it looks exactly the same. Here's a snapshot : https://i.stack.imgur.com/yLq7E.png[^] Bootstrap It is interesting because Bootstrap helps create basic controls like we Windows Devs are accustomed to having. Installation Packages I just need to learn how to create an installation package for each platform now. It's really a simple idea (wrapping up browser so users think it is a desktop app) but it works really well. Completely Open Source FYI - You can get the source code at : GitHub - raddevus/CYaPass-Electron: The official C'YaPass desktop app built on Electron (runs on Windows, Linux, Mac)[^] Easy To Try Out You have to have Node (and NPM) installed. But if you do you just: 1. git clone https://github.com/raddevus/CYaPass-Electron 2. npm install 3. npm start
-
raddevus wrote:
hate and love
I'm a CodeWraith, not a Sith Lord. Just tell me why anybody would use something like JavaScript and the whole baggage that's tied to its tail for desktop applications? Is it because every problem looks like a nail to someone with a hammer? Masochism? Would it be too little of a challenge if you used something else?
I have lived with several Zen masters - all of them were cats. His last invention was an evil Lasagna. It didn't kill anyone, and it actually tasted pretty good.
Well, I've actually developed C'YaPass as (all links are GitHub repos where I provide Open Source): 1. native Android via Java [^] 2. native Android via Kotlin[^] 3. native iOS via Swift[^] 4. native WinForms [^] app via .NET Windows Forms ala Visual Studio 5. UWP [^] (but kind of gave up) 6. HTML5 (Canvas), JavaScript, Bootstrap (web app[^]) So because I had already built it using HTML5 / JavaScript / Bootstrap I was very interested in if it were possible to run it as a "native" desktop app on multiple platforms via Electron so it was a great learning experience. Also, I think that OSes are now Commodities so it would be cool to "write an app once and have it run anywhere". But that's an old dream of everyone. :-D It's all about learning for me and about really determining if Cross-Platform is a realistic thing. Also, I would write it as a native Linux app, but I don't have the UI skills there -- probably need Qt or some such.
-
Well, I've actually developed C'YaPass as (all links are GitHub repos where I provide Open Source): 1. native Android via Java [^] 2. native Android via Kotlin[^] 3. native iOS via Swift[^] 4. native WinForms [^] app via .NET Windows Forms ala Visual Studio 5. UWP [^] (but kind of gave up) 6. HTML5 (Canvas), JavaScript, Bootstrap (web app[^]) So because I had already built it using HTML5 / JavaScript / Bootstrap I was very interested in if it were possible to run it as a "native" desktop app on multiple platforms via Electron so it was a great learning experience. Also, I think that OSes are now Commodities so it would be cool to "write an app once and have it run anywhere". But that's an old dream of everyone. :-D It's all about learning for me and about really determining if Cross-Platform is a realistic thing. Also, I would write it as a native Linux app, but I don't have the UI skills there -- probably need Qt or some such.
I reached that almost by accident. I really intended to port the applications to different UIs. It started out as ASP.Net Web Forms, was ported to WinForms, then WPF and last my own UI that runs in a 3D engine. By that last step I also got Linux (via MONO) and MacOs onboard, but I have not really tried them out. Universal platform independence will probably never come. Too different are the devices and their capabilities for that. Could you really expect to get anything to run on an old C64, even if you somehow got a .Net framework ported there?
I have lived with several Zen masters - all of them were cats. His last invention was an evil Lasagna. It didn't kill anyone, and it actually tasted pretty good.
-
That's an interesting list. It included Electron. :) Also, the Java one was funny because the note for the reasons against using was "it's not really cross platform".
Even funnier that that comment got five upvotes :-\ And although I'm not a web developer, I can understand that if you are one, you want to stick to web technologies and use Electron for cross platform development ...
-
Because I started running Ubuntu as my main desktop I needed my password creation app (C'YaPass - the WinForms version) on my Ubuntu desktop but wasn't sure of the best (or good) way to create a desktop app for Linux. I DuckDuckGo'd it and found Electron -- Electron is basically Node & Chrome engine that runs natively from your desktop. Visual Studio Code is an Electron app. Anyways, I had already created a very basic HTML5, JavaScript, Bootstrap version of my desktop app (C'YaPass : Never type a password again[^]) and that made the conversion to Electron very fast. Consistent on Windows, Linux, Mac The really cool thing is that when you run the app on Linux, Windows or Mac it looks exactly the same. Here's a snapshot : https://i.stack.imgur.com/yLq7E.png[^] Bootstrap It is interesting because Bootstrap helps create basic controls like we Windows Devs are accustomed to having. Installation Packages I just need to learn how to create an installation package for each platform now. It's really a simple idea (wrapping up browser so users think it is a desktop app) but it works really well. Completely Open Source FYI - You can get the source code at : GitHub - raddevus/CYaPass-Electron: The official C'YaPass desktop app built on Electron (runs on Windows, Linux, Mac)[^] Easy To Try Out You have to have Node (and NPM) installed. But if you do you just: 1. git clone https://github.com/raddevus/CYaPass-Electron 2. npm install 3. npm start
Completely unrelated question - does DDG show images for you? Mine shows empty panels instead of the expected image...
".45 ACP - because shooting twice is just silly" - JSOP, 2010
-----
You can never have too much ammo - unless you're swimming, or on fire. - JSOP, 2010
-----
When you pry the gun from my cold dead hands, be careful - the barrel will be very hot. - JSOP, 2013 -
Because I started running Ubuntu as my main desktop I needed my password creation app (C'YaPass - the WinForms version) on my Ubuntu desktop but wasn't sure of the best (or good) way to create a desktop app for Linux. I DuckDuckGo'd it and found Electron -- Electron is basically Node & Chrome engine that runs natively from your desktop. Visual Studio Code is an Electron app. Anyways, I had already created a very basic HTML5, JavaScript, Bootstrap version of my desktop app (C'YaPass : Never type a password again[^]) and that made the conversion to Electron very fast. Consistent on Windows, Linux, Mac The really cool thing is that when you run the app on Linux, Windows or Mac it looks exactly the same. Here's a snapshot : https://i.stack.imgur.com/yLq7E.png[^] Bootstrap It is interesting because Bootstrap helps create basic controls like we Windows Devs are accustomed to having. Installation Packages I just need to learn how to create an installation package for each platform now. It's really a simple idea (wrapping up browser so users think it is a desktop app) but it works really well. Completely Open Source FYI - You can get the source code at : GitHub - raddevus/CYaPass-Electron: The official C'YaPass desktop app built on Electron (runs on Windows, Linux, Mac)[^] Easy To Try Out You have to have Node (and NPM) installed. But if you do you just: 1. git clone https://github.com/raddevus/CYaPass-Electron 2. npm install 3. npm start
-
I reached that almost by accident. I really intended to port the applications to different UIs. It started out as ASP.Net Web Forms, was ported to WinForms, then WPF and last my own UI that runs in a 3D engine. By that last step I also got Linux (via MONO) and MacOs onboard, but I have not really tried them out. Universal platform independence will probably never come. Too different are the devices and their capabilities for that. Could you really expect to get anything to run on an old C64, even if you somehow got a .Net framework ported there?
I have lived with several Zen masters - all of them were cats. His last invention was an evil Lasagna. It didn't kill anyone, and it actually tasted pretty good.
CodeWraith wrote:
I reached that almost by accident. I really intended to port the applications to different UIs.
Yeah it's a challenge for sure. I always think about "how will I be able to give this program to someone who has OS XYZ and doesn't know anything about technology?" It leads me down the deployment path and that is the thing I really try to solve: how can someone install my app no matter what device they have and how can I make it easy for them?
CodeWraith wrote:
Could you really expect to get anything to run on an old C64, even if you somehow got a .Net framework ported there?
:laugh: We can hope! :laugh:
-
Completely unrelated question - does DDG show images for you? Mine shows empty panels instead of the expected image...
".45 ACP - because shooting twice is just silly" - JSOP, 2010
-----
You can never have too much ammo - unless you're swimming, or on fire. - JSOP, 2010
-----
When you pry the gun from my cold dead hands, be careful - the barrel will be very hot. - JSOP, 2013#realJSOP wrote:
does DDG show images for you?
I think I'm missing it. Not sure what DDG is. I did have a problem where my app's icon was not showing up when I ran it on Linux. THen I noticed that my configuration was using lowercase to reference the JPG that represented the app icon and of course on Linux files are case-sensitive. I think you're talking about something else but I'm missing it. Let me know and I'll try to answer. Thanks,
-
-
CodeWraith wrote:
I reached that almost by accident. I really intended to port the applications to different UIs.
Yeah it's a challenge for sure. I always think about "how will I be able to give this program to someone who has OS XYZ and doesn't know anything about technology?" It leads me down the deployment path and that is the thing I really try to solve: how can someone install my app no matter what device they have and how can I make it easy for them?
CodeWraith wrote:
Could you really expect to get anything to run on an old C64, even if you somehow got a .Net framework ported there?
:laugh: We can hope! :laugh:
There is one thing that is absolutely independent of the processor, hardware, OS or languages. Algorithms. Choosing the right algorithm at least helps you to make most of whatever resources you may have.
I have lived with several Zen masters - all of them were cats. His last invention was an evil Lasagna. It didn't kill anyone, and it actually tasted pretty good.
-
There is one thing that is absolutely independent of the processor, hardware, OS or languages. Algorithms. Choosing the right algorithm at least helps you to make most of whatever resources you may have.
I have lived with several Zen masters - all of them were cats. His last invention was an evil Lasagna. It didn't kill anyone, and it actually tasted pretty good.
CodeWraith wrote:
Choosing the right algorithm at least helps you to make most of whatever resources you may have.
I agree 100%. I also found that some _real_ Architecture helped me to build my app on multiple platforms. The Domain objects in every solution are the same so I could simply convert my classes from one language to another and they worked just fine. It really sped development up. But, of course, the UI is the real challenge since every platform requires you to build it in a different way. Great discussion! :thumbsup:
-
#realJSOP wrote:
does DDG show images for you?
I think I'm missing it. Not sure what DDG is. I did have a problem where my app's icon was not showing up when I ran it on Linux. THen I noticed that my configuration was using lowercase to reference the JPG that represented the app icon and of course on Linux files are case-sensitive. I think you're talking about something else but I'm missing it. Let me know and I'll try to answer. Thanks,
DDG = DuckDuckGo search engine
".45 ACP - because shooting twice is just silly" - JSOP, 2010
-----
You can never have too much ammo - unless you're swimming, or on fire. - JSOP, 2010
-----
When you pry the gun from my cold dead hands, be careful - the barrel will be very hot. - JSOP, 2013
