I think that's the point that they're making: Electron, due to its nature, isn't an optimal choice to build something that ought to be a small tool.
This is obviously a kind of "hello world" learning experience for you, and I'm sure it'll be a useful stepping stone to work toward more complex programs that provide better justification for the footprint. And with that purpose in mind, it's a nice start. I personally don't care for some of the UI paradigms that are fashionable right now (the "flat" and "minimal" stuff), but this seems like a sane implementation of that style.
Electron's footprint is rather shocking. It's essentially an entire operating system being included with each small GUI utility.
For comparison, Windows 95's install package took up 19MB of disk space. So I guess Electron's 50MB is pretty efficient as far as operating systems go.
Yeah, I really have to spend some time cleaning everything up. The code itself is pretty messy too and needs to especially be split up into smaller files.
This is the first electron or even real node projects I've worked on from scratch, so I'm still getting used to everything.
I tried doing this exact same thing and it wasn't as quick/easy as I hoped so I bailed, so first off, thank you for making it, and second, don't worry that its messy at least you got it started and that is the hard part.
Oh god I nearly bailed as well. Some things were a huge pain to get working.
That's why the code is so messy. A lot of old code left over from trial/error - and a lot of terrible loops to prevent dual FTP connections (which would error).
Oh, and to answer your question about SFTP, no - not yet.
I'm using JSFTP (https://github.com/sergi/jsftp), which doesn't have SFTP support yet. I wanted to get it up and running on both Mac and Windows before diving into that.
I've found a few forks of JSFTP with it at least partially implemented, so that's the next thing I plan to tackle.
I made this because I just switched from Mac to PC. On Mac I was using Transmit, which was super easy to use and looked pretty good.
I don't use FTP frequently - I just needed something basically to upload/download files.
After switching to windows, I couldn't find any decent FTP clients I liked. I tried Filezilla, Winscp, Cyberduck. They're all too busy and look like they're straight from XP... so I made this.
I guess I'm just not sure what you're talking about when you say "High Quality GUIs" when talking about Windows FTP clients specifically.
That looks really good. Never heard of those folks before, but looking at their website & blog, I get a similar vibe to Panic Software (the Mac developers of Transmit). At the very least they seem to care about design. Thanks for the link!
Filezilla and WinSCP are precisely the apps I was referring to. "Straight from XP". Pfft. Windows explorer maintains about the same look in most places as well as most other windows applications. Not everything needs to be changed for the sake of change every few months.
For this particular app, yes. However, more more complex UIs I think that Electron has some benefits that QT does not. The UI tools available to web applications is miles ahead of desktop. The benefit the technology set gives us in productivity will hopefully produce higher quality apps at lower costs. FOr example, I'm considering it for a big data front-end because of all the high quality graphing libraries and reactive template libraries available for web applications. Plus I don't need to retrain the team.
> The UI tools available to web applications is miles ahead of desktop.
That's a ridiculous statement. Web UIs are pretty awful, unpredictable, confusing and non-standard compared to desktop ones. Not only that but they're hard to develop, you have to jump through hoops of CSS hacks to make things behave in a sort-of-desktop-like fashion.
There are many high quality graphing libraries available on desktop apps (Qwt, QCustomPlot, DevExpress to name a few I've worked with).
The training thing you talk about is true though, if your team has more experience on the web, then retraining them is wasted effort I suppose. Depends on your idea of quality result though.
> Web UIs are pretty awful, unpredictable, confusing and non-standard compared to desktop ones. Not only that but they're hard to develop, you have to jump through hoops of CSS hacks to make things behave in a sort-of-desktop-like fashion.
I disagree almost completely with this. I haven't had to use a CSS "hack" in ages. And I think the "hard to develop" part is a product of experience. Having been in the web world for a while I find no difficult in it at all. Especially when using one of the many CSS frameworks out there.
Although I will give you that on second read, my statement is a bit ridiculous because I said "tools" and desktop does have better drag and drop tools for UI. What I should have said is "capabilities"
Was there something that can be done on the desktop you had in mind that is particular difficult in web?
> The UI tools available to web applications is miles ahead of desktop.
Such as?
Doing native UIs since MS-DOS and Amiga, with enough web experience not to see how it is better than the RAD tooling of the 90's or declarative UIs like XAML.
Where is Blend for web UIs or Delphi style app development?
Having developed in all of those (Borland C++ Builder which is the same as Delphi except not OO Pascal, QT, and web)...
The amount of power CSS gives you over the precise look of the app at different aspect ratios gives an awesome amount of control over what the app looks like on any screen size.
Also, things like wrapping of elements from one line to another work very well in CSS/HTML, especially when dealing with interactive rich text. For example, in some UI libraries (iOS comes to mind) making a line of text with a clickable image inside of it that wraps when the text gets too long is frustratingly difficult but in HTML it is a piece of cake.
With that said, the rich text editing choses for web are much easier to work with and more robust (IMHO) than the desktop equivalents.
Not to mention OpenGL rendering, vector graphics, loading of assets from the network are all built-in. All of which can certainly be done from a desktop environment but the tools to do so are not as mature.
.NET makes a lot of strides in this direction. But if you're going to include the .NET runtime with your distribution it will be almost as large as Electron apps.
Then there are animations which are easy in web technologies. And which UX designers are starting to realize is an important aspect of good user experiences.
Can all of this be done in QT? Absolutely. But all of it is out-of-the-box with web.
As far as the RAD tools from the 90s? Not even close. Albeit Blend is nice. But tools like that do exist for web, just not for desktop UI. I'm sure if web tech becomes more common in desktop UI the tools will come.
What you call garbage, might be good looking to someone else. He did not say he's trying to replace other GUIs, there's a good use for this. Calling someone's work garbage after you haven't even extensively tried it (it was posted 30 minutes ago) is uncalled for. I think it looks promising and look forward to trying it when I get home.
Electron is objectively horrible. The only upsides are 1 "it's easy" and 2 "it's pretty" neither of which make for efficient or minimal programs. To be quite honest, "pretty" GUIs are usually the worst anyway.
> What you call garbage, might be good looking to someone else.
"Beauty is in the eye of the beholder", "There's no accounting for taste", and all that. I'm not a fan of the style that was used (too much blank space, flat UI elements, gives the vibe of a webpage instead of an application that you can do something in, having both a hamburger menu and dropdown menus seems weird), but "garbage" is needlessly harsh.
It's useful to be reminded that software development is a process of continuous learning, and that's what this project represents anyhow: Learning a new platform by tying some libraries together into something that's functional and that demonstrates what the developer was trying to learn.
a very very good point. I think the answer is art. People like to create art. It's just another painting but we already have other paintings. Well this is a new painting that might speak to people in a new way.
Basically. I get that there are several, but having just moved from developing on a mac to Windows, I didn't find one I liked. I just needed super basic - single pane.
Also I wasn't a fan of how every client looked like they were straight from XP. I used this as a way to get familiar with Electron, as well.
Lastly, it's open source so people can add whatever they want to it. I have a few ideas that I would love to be using myself (image previews, in-client file editing, etc), and I'm sure other people have their own features they'd want - and they can add them now.
I think it's awesome. Sure some people think creating an FTP client is like a hello world project but I appreciate what you have done for the reasons you have stated.
> Also I wasn't a fan of how every client looked like they were straight from XP.
You keep repeating this line. If a FTP client has received heavy usage and development since the XP days, that's a good sign, I think. It proves that it is well used, tested, reliable, and capable.
I'd much rather have a program with a passable UI that is lightweight and does everything I want, than one that has an unjustified resource usage to feature ratio.
We have different thoughts then. Especially since I now use FTP so infrequently, I wanted something very minimal. There just weren't any clients like that - XP style definitely isn't clean/minimal. I don't care too much about being well used, tested, and reliable if I don't like it.
I think your definition of minimal doesn't really match everyone else in this threads'. Opening up an entire chromium runtime just to manage FTP seems incredibly _not_ minimal to me. Filezilla, for it's somewhat outdated look and myriad of options is substantially more lightweight than anything that requires a whole web browser.
There's this phrase, right? "Don't reinvent the wheel". I think it's central to the development experience. Don't re-do work your ancestors have already done, lest you waste your time.
I think there's a very valid exception -- well, there's many, but here's my favorite: "Don't reinvent the wheel unless you are trying to learn how the wheel works."
See I like that phrase. Gives you a lot more creative license to just redo what has been made if you are curious about it. What if at the end of that learning experience you have a nice, fairly polished wheel and you'd like to share it? Maybe for e-cred, maybe for criticism, maybe just searching for praise.
I'd say that the underlying motivation is irrelevant. We as a community should be less skeptical about this stuff, we really need to learn to just be happy for people, maybe even give out some praise.
So on that note. Nice job OP! I really like the font choice, and colors. UI wise this might be the best FTP client I've seen.
I get doing something like this as a learning project. All I'm saying is that we should actively be trying to kill off FTP for good. There are superior protocols (and workflows for that matter). I will concede that it looks like a fantastic FTP client, but would you be excited about a dial up modem controller (no matter how nice it looked)? Or a really fancy cassette tape player? It's an interesting thought experiment to see what those technologies might look like if they were brought to market today, but it's very strange to want people to actually use them in my opinion.
Isn't there some moral violation here? The app looks great but we really really should not be encouraging people to use FTP. Anyone using FTP should feel weight of a thousand suns of shame.
Haha. I rarely use it myself - basically only for the few freelance clients I work with where they pass me the FTP credentials to make a change to a site. But for the little bit I use it, I wanted to use a program I liked :)
The 'filesize' section is from [1], only the word 'bytes' has changed to 'B' and 'filesize' in two places. It looks like there are other copies of this same snippet in a Google search, but this one shows direct descent from [2] via the 'forked from' tag, so is probably the root of the trail. Not saying that's where you got it from, but this is clearly a derivative work.
Then your 'showFocus' section is from [3] and [4], both posted under the same username. I can't immediately see any other path this piece has developed from and it doesn't seem as significant, but your copy only differs by some trailing spaces.
I stopped looking after realizing over 50% of the first file I looked at was stolen from other sources without attribution.
I added it last minute, and it doesn't even work very well with packaged electron apps, so I'll probably remove it. I was just curious about how often it is being used.
If you're targeting Windows, I'd recommend writing a GUI in PHP-Desktop, if you know PHP and can handle working with IE8 without destroying your PC in anger... The binaries are only 5MB + your code, and it works pretty well.
62 comments
[ 3.0 ms ] story [ 144 ms ] threadI think that's the point that they're making: Electron, due to its nature, isn't an optimal choice to build something that ought to be a small tool.
This is obviously a kind of "hello world" learning experience for you, and I'm sure it'll be a useful stepping stone to work toward more complex programs that provide better justification for the footprint. And with that purpose in mind, it's a nice start. I personally don't care for some of the UI paradigms that are fashionable right now (the "flat" and "minimal" stuff), but this seems like a sane implementation of that style.
For comparison, Windows 95's install package took up 19MB of disk space. So I guess Electron's 50MB is pretty efficient as far as operating systems go.
.NET does this, Java does this, DirectX does this, etc.
Does it support SFTP too? From a operational perspective FTP itself should be avoided for anything except public drop-box applications (IMHO).
Also, best practice in node.js (and electron too) is to not put your node_modules folder in Git. You should add it to a '.gitignore' file.
This is the first electron or even real node projects I've worked on from scratch, so I'm still getting used to everything.
That's why the code is so messy. A lot of old code left over from trial/error - and a lot of terrible loops to prevent dual FTP connections (which would error).
I'm using JSFTP (https://github.com/sergi/jsftp), which doesn't have SFTP support yet. I wanted to get it up and running on both Mac and Windows before diving into that.
I've found a few forks of JSFTP with it at least partially implemented, so that's the next thing I plan to tackle.
This would be a much better use for Qt than Electron. But I guess that's not hip enough anymore.
I don't use FTP frequently - I just needed something basically to upload/download files.
After switching to windows, I couldn't find any decent FTP clients I liked. I tried Filezilla, Winscp, Cyberduck. They're all too busy and look like they're straight from XP... so I made this.
I guess I'm just not sure what you're talking about when you say "High Quality GUIs" when talking about Windows FTP clients specifically.
This app it is kind of overkill, though.
That's a ridiculous statement. Web UIs are pretty awful, unpredictable, confusing and non-standard compared to desktop ones. Not only that but they're hard to develop, you have to jump through hoops of CSS hacks to make things behave in a sort-of-desktop-like fashion.
There are many high quality graphing libraries available on desktop apps (Qwt, QCustomPlot, DevExpress to name a few I've worked with).
The training thing you talk about is true though, if your team has more experience on the web, then retraining them is wasted effort I suppose. Depends on your idea of quality result though.
I disagree almost completely with this. I haven't had to use a CSS "hack" in ages. And I think the "hard to develop" part is a product of experience. Having been in the web world for a while I find no difficult in it at all. Especially when using one of the many CSS frameworks out there.
Although I will give you that on second read, my statement is a bit ridiculous because I said "tools" and desktop does have better drag and drop tools for UI. What I should have said is "capabilities"
Was there something that can be done on the desktop you had in mind that is particular difficult in web?
Such as?
Doing native UIs since MS-DOS and Amiga, with enough web experience not to see how it is better than the RAD tooling of the 90's or declarative UIs like XAML.
Where is Blend for web UIs or Delphi style app development?
Having developed in all of those (Borland C++ Builder which is the same as Delphi except not OO Pascal, QT, and web)...
The amount of power CSS gives you over the precise look of the app at different aspect ratios gives an awesome amount of control over what the app looks like on any screen size.
Also, things like wrapping of elements from one line to another work very well in CSS/HTML, especially when dealing with interactive rich text. For example, in some UI libraries (iOS comes to mind) making a line of text with a clickable image inside of it that wraps when the text gets too long is frustratingly difficult but in HTML it is a piece of cake.
With that said, the rich text editing choses for web are much easier to work with and more robust (IMHO) than the desktop equivalents.
Not to mention OpenGL rendering, vector graphics, loading of assets from the network are all built-in. All of which can certainly be done from a desktop environment but the tools to do so are not as mature.
.NET makes a lot of strides in this direction. But if you're going to include the .NET runtime with your distribution it will be almost as large as Electron apps.
Then there are animations which are easy in web technologies. And which UX designers are starting to realize is an important aspect of good user experiences.
Can all of this be done in QT? Absolutely. But all of it is out-of-the-box with web.
As far as the RAD tools from the 90s? Not even close. Albeit Blend is nice. But tools like that do exist for web, just not for desktop UI. I'm sure if web tech becomes more common in desktop UI the tools will come.
Or playing with CSS magic trying to figure out the incantation that will make it hardware accelerate the GUI in a portable way across all browsers?
Web animations are a poor cousin of native animation engines like iOS, Android,UWP, MacOS, JavaFX.
Electron was already done in 90's and it didn't take the world, it was called MSHTML.
So what wonderful tool for web development does match Blend?
"Beauty is in the eye of the beholder", "There's no accounting for taste", and all that. I'm not a fan of the style that was used (too much blank space, flat UI elements, gives the vibe of a webpage instead of an application that you can do something in, having both a hamburger menu and dropdown menus seems weird), but "garbage" is needlessly harsh.
It's useful to be reminded that software development is a process of continuous learning, and that's what this project represents anyhow: Learning a new platform by tying some libraries together into something that's functional and that demonstrates what the developer was trying to learn.
One of the reasons I love Filezilla is because it feels like I am working right inside Windows shell / explorer.exe.
Also I wasn't a fan of how every client looked like they were straight from XP. I used this as a way to get familiar with Electron, as well.
Lastly, it's open source so people can add whatever they want to it. I have a few ideas that I would love to be using myself (image previews, in-client file editing, etc), and I'm sure other people have their own features they'd want - and they can add them now.
You keep repeating this line. If a FTP client has received heavy usage and development since the XP days, that's a good sign, I think. It proves that it is well used, tested, reliable, and capable.
I'd much rather have a program with a passable UI that is lightweight and does everything I want, than one that has an unjustified resource usage to feature ratio.
I think there's a very valid exception -- well, there's many, but here's my favorite: "Don't reinvent the wheel unless you are trying to learn how the wheel works."
See I like that phrase. Gives you a lot more creative license to just redo what has been made if you are curious about it. What if at the end of that learning experience you have a nice, fairly polished wheel and you'd like to share it? Maybe for e-cred, maybe for criticism, maybe just searching for praise.
I'd say that the underlying motivation is irrelevant. We as a community should be less skeptical about this stuff, we really need to learn to just be happy for people, maybe even give out some praise.
So on that note. Nice job OP! I really like the font choice, and colors. UI wise this might be the best FTP client I've seen.
https://filezilla-project.org/download.php?platform=osx
There's no shortage of clients. Personally, I think you shouldn't use FTP at all, but you do you.
I'll try to figure it out.
The 'filesize' section is from [1], only the word 'bytes' has changed to 'B' and 'filesize' in two places. It looks like there are other copies of this same snippet in a Google search, but this one shows direct descent from [2] via the 'forked from' tag, so is probably the root of the trail. Not saying that's where you got it from, but this is clearly a derivative work.
Then your 'showFocus' section is from [3] and [4], both posted under the same username. I can't immediately see any other path this piece has developed from and it doesn't seem as significant, but your copy only differs by some trailing spaces.
I stopped looking after realizing over 50% of the first file I looked at was stolen from other sources without attribution.
[0] https://github.com/mitchas/ffftp/blob/master/app/app.js
[1] https://gist.github.com/napoli1890/d33c7b9056e77a8670874e93d...
[2] https://gist.github.com/thomseddon/3511330
[3] http://stackoverflow.com/questions/22776662/catch-ng-show-ev...
[4] https://gist.github.com/ezsi/77a708fde8af5cb4d239
So running an entire web browser, separate from your actual web browser is minimal?