Great tutorial. Due to breaking changes in Electron, add to createWindow() in the BrowserWindow options to fix the error that says "require is not defined" (same fix needed for Brad's excellent tutorial on 60-minute Electron app): webPreferences: { nodeIntegration: true, contextIsolation: false }
Awesome, makes electron seem so simple. Before watching this, I thought it would be seriously complicated. I love visual studio code (like many of us) and it's great to see such great tools emerging.
Thank you for this brief intro Brad. This is exactly what I was looking for. Now I can finally bring my chess apps all together into a single cross platform GUI!
Being more of a backend kind of guy myself I have something like a inner aversion to everything JavaScript, but to be honest Electron is really impressive from what I have seen. Visual Studio Code itself is written with it and I'm really impressed how well it runs on both Windows and Linux. The look and feel is also very consistent and it's not that mess that some cross platform apps tend to be, UI wise. This technology might just be the trick to make myself learn JavaScript without hating my life for having to do it.
I actually love Javascript. I don't need to worry about: Memory management Predefined code. Potentially undefined values. Very useful for dynamic classes, because using this.foo won't crash. Zero division error. According to JS logic anything divided by 0 is infinity, because anything divided by infinity is 0. Type conversion. Having to differentiate between different types of array-ish things. Being limited only to objects if I want to define properties. In JS any variable can have its own properties, including integers. And missing this in other languages is a huge pain for me sometimes! And in the end there's also a ton of ready-made plugins. Animations made easy. Audio handling - really powerful, made easy. WebGL made easy. And I could continue indefinitely.
This is sweet! I am working on my senior project in college and am deciding which technologies to use. Originally, I planned to go with Angular2 & Firebase (since you have a solid tutorial on), however, Electron seems legit and I think it has a better use case for my application. Please create a tutorial series for Electron. Which DBMS would be best for Electron? Keep up the great videos man. You've helped me immensely and I have only been watching your videos for a month or so.
MongoDB works great with Nodejs if you want NoSQL b ut if you want SQL Postgres works best with Nodejs.. and anything that works best with nodejs works best with electron
Brad Traversy you are very brilliant, Why i am saying this because i have watched almost all of your videos and they keep on solving all of my issues an example is the PHP OOP and MVC and some of your other videos on react js, node js etc thanks for all you are doing. Keep up with your good works
I've been building an Electron app for the last couple of weeks and I'm enjoying it. I had some trouble with the mongoose driver for Mongodb so I had to use the MongoDB official node driver but apart from that it's been going quite smoothly.
I tried learning electron few months before, but couldn't learn as the doc's were confusing and was not able to put everything successfully. great seeing u coming up with the tutorial. am sure I will successfully learn it this time. looking forward to more in-depth vedios. thanks bro
old comment, but react isn''t written in another language. it's still javascript. the entire react library was written using pure javascript. javascript itself is an interpreted language, meaning you can interpret it using any language, but most interpreters like Chrome's V8 use c++
I have really enjoyed this tutorial, format is very good, not too fast, easy steps, good explanation, keep moving the same direction, Brad! Subscribed, waiting for next videos of this series.
You should definitely check out PhotonKit for use with Electron. It is perfect for getting your app to have a native look when choosing your environment. A lot developers use it when building with Electron. Great tutorial by the way!
Great tutorial as always. Brad as a suggestion, why don't you develop a CRUD app using electron and sqlite when you finish your research on electron? It occurs to me that this combo can be used for fast developing of small db projects which can be platform independent because both chrome and sqlite run almost everywhere. Nowadays the most common tools for accomplishing this are java and maybe lazarus/pascal which have a steep learning curve. Thanks a lot for your great content, regards from México!
+Web Probie I busted out laughing when I heard that too! Sometimes technology is like women, sometimes you just get thirsty, and when you get dehydrated, you want mooooooooooooooooooooooooore.
I was searching for info about the Intel Atom CPU, and this came up (Since you use Atom editor). I watched the whole video and got ideas for small desktop apps I want to do :D
On Reddit someone told me to stay away from Electron because it was too complicated for me. I want to make simple desktop gui-based apps using JavaScript in the front end and Python in the backend.
Cool video. Can't wait to see more. That being said, it would be cool if you maximized your editor, if possible. That right side brightness is painful at night. :)
I am unable to get process to show in the consoles tab of the developers menu, I just get the error "Uncaught ReferenceError: process is not defined at index.html:19" Any help?
This is awesome! Very great tutorial! I've' seen some of your stuff now and I have subscribed to your channel. So, I stopped coding back in 20001 after burning out. I was writing ActiveX and inserting into web browser to distribute. I am finally ready to get back in the game and finally have hope since cross-platform support is here and embedded into the browser. I was looking for a good framework to start with like MEAN. Since, I want to re-write some apps I developed for a vendor years ago, I will still be able to deploy via web server. This is great!
Hey Brad, would you consider redoing it for 2021. With Electron v12 this does not work and as some comments said, the nodeIntegration trick does not work really
Another great video. Desktop applications built from the guts of web development, reuse your JavaScript skills. I understand there are some concerns about resource management with Electron APp's?
Man how awesome, I'm a web developer myself and the ability to use that to build desktop apps cross platform? ahhhhh thanks for this intro edit: shit... 3:45 does this mean you can't package the apps as say a .exe that doesn't require installing other stuff (like node.js) it would just come inside that .exe as an execution command or something? That would suck if you have to setup an environment that runs an electron app. I use Visual Studio Code that for Linux/Windows I just download a file and run it so maybe...
If, while installing electron, you got this error: "Error: EACCES: permission denied, mkdir '/usr/lib/node_modules/electron/.electron'", use: sudo npm install -g electron --unsafe-perm=true --allow-root If you're not using linux, do not add 'sudo'.
Sweet intro! Got any suggestions about solid database managers to use with Electron? Been using Sqlite3 but seems to struggle with Electron for some reason.
please tell me, what is difference between win.on('closed') and app.on('window-all-closed'), isn't there only one window ? And closing window does not mean closing entire app?
I just don't understand one thing: Why install local and global? Only local is not enough? With that way, will not have 2 versions of the same thing? Thank you!
truecoder I get the concept of global installation. But why both global and local is the question. You need one of them, no matter which. But not both.
Hope you get the answer, but if not so in general when we install a module , plugin or some library globally we can access it from anywhere inside our machine even outside our current project directory . Hope that helps .
Nice tutorial as always. So is it possible to deploy electron to the server along with normal app and create a web app that could cooperate with user's machine?
![ไลฟ์สุ่ม iPhone 295 บาท... โกงมั้ย?[ โกงมั้ยครับ ep.97 ] | DOM](http://i.ytimg.com/vi/gdstHEE4UUE/mqdefault.jpg)
When I finally get a javascript job, I'm going all the way back to learn and watch all Brad's videos. One doesn't need anything else.
Great tutorial. Due to breaking changes in Electron, add to createWindow() in the BrowserWindow options to fix the error that says "require is not defined" (same fix needed for Brad's excellent tutorial on 60-minute Electron app):
webPreferences: {
nodeIntegration: true,
contextIsolation: false
}
Awesome, makes electron seem so simple. Before watching this, I thought it would be seriously complicated. I love visual studio code (like many of us) and it's great to see such great tools emerging.
I've looked at a lot of programming environments and Electron most definitely interests me. Thanks for educating me.
Thank you for this brief intro Brad.
This is exactly what I was looking for.
Now I can finally bring my chess apps all together into a single cross platform GUI!
Being more of a backend kind of guy myself I have something like a inner aversion to everything JavaScript, but to be honest Electron is really impressive from what I have seen. Visual Studio Code itself is written with it and I'm really impressed how well it runs on both Windows and Linux. The look and feel is also very consistent and it's not that mess that some cross platform apps tend to be, UI wise.
This technology might just be the trick to make myself learn JavaScript without hating my life for having to do it.
Yes it is a very intriguing technology. I am excited to learn more about it. Right now I just know the very basics
same
I actually love Javascript. I don't need to worry about:
Memory management
Predefined code.
Potentially undefined values. Very useful for dynamic classes, because using this.foo won't crash.
Zero division error. According to JS logic anything divided by 0 is infinity, because anything divided by infinity is 0.
Type conversion.
Having to differentiate between different types of array-ish things.
Being limited only to objects if I want to define properties. In JS any variable can have its own properties, including integers. And missing this in other languages is a huge pain for me sometimes!
And in the end there's also a ton of ready-made plugins. Animations made easy. Audio handling - really powerful, made easy. WebGL made easy.
And I could continue indefinitely.
This is sweet!
I am working on my senior project in college and am deciding which technologies to use.
Originally, I planned to go with Angular2 & Firebase (since you have a solid tutorial on), however, Electron seems legit and I think it has a better use case for my application.
Please create a tutorial series for Electron. Which DBMS would be best for Electron?
Keep up the great videos man. You've helped me immensely and I have only been watching your videos for a month or so.
MongoDB works great with Nodejs if you want NoSQL b ut if you want SQL Postgres works best with Nodejs.. and anything that works best with nodejs works best with electron
I would go for NeDB
React man. React.
Brad Traversy you are very brilliant, Why i am saying this because i have watched almost all of your videos and they keep on solving all of my issues an example is the PHP OOP and MVC and some of your other videos on react js, node js etc thanks for all you are doing. Keep up with your good works
I've been building an Electron app for the last couple of weeks and I'm enjoying it. I had some trouble with the mongoose driver for Mongodb so I had to use the MongoDB official node driver but apart from that it's been going quite smoothly.
I tried learning electron few months before, but couldn't learn as the doc's were confusing and was not able to put everything successfully.
great seeing u coming up with the tutorial. am sure I will successfully learn it this time.
looking forward to more in-depth vedios.
thanks bro
Yes they are very confusing
Been creating C# forms apps for years, planning to give this a go as been learning node and react in recent weeks .
The best electron tutorial which i ever seen. As a beginner its helped me so much. I'm using OS X, some processes are different in MAC.
OH MY GOD
I have been waiting for this - i utterly detested JS because i couldnt write desktop stuff.
this is brilliant
old comment, but react isn''t written in another language. it's still javascript. the entire react library was written using pure javascript. javascript itself is an interpreted language, meaning you can interpret it using any language, but most interpreters like Chrome's V8 use c++
Same bro
I love this, you've really opened my eyes to the potential of JS well done :)
I have really enjoyed this tutorial, format is very good, not too fast, easy steps, good explanation, keep moving the same direction, Brad!
Subscribed, waiting for next videos of this series.
Thanks Brad for a cool intro to Electron. Looking forward to the next installment!
really surprised at number the of really good apps built by big companies with this library, impressive
You should definitely check out PhotonKit for use with Electron. It is perfect for getting your app to have a native look when choosing your environment. A lot developers use it when building with Electron. Great tutorial by the way!
+Werther'sOriginal - great suggestion, thanks
Thanks so much 4 the sweeeeet kewpage. I'm replacing my JAVA app with this approach and so grateful for your selfless sharing. Stay strong, Code on!
My God! JavaScript is becoming the god of all programming languages front-end, back-end, graphics rendering, and now desktop apps!
Great tutorial as always. Brad as a suggestion, why don't you develop a CRUD app using electron and sqlite when you finish your research on electron? It occurs to me that this combo can be used for fast developing of small db projects which can be platform independent because both chrome and sqlite run almost everywhere. Nowadays the most common tools for accomplishing this are java and maybe lazarus/pascal which have a steep learning curve. Thanks a lot for your great content, regards from México!
I am thirsty for more indeed. Please, I am begging you.
+Web Probie I busted out laughing when I heard that too! Sometimes technology is like women, sometimes you just get thirsty, and when you get dehydrated, you want mooooooooooooooooooooooooore.
no such thing as leavx thirsx or not, say, do any nmw, no nerx
liked before watching video..that's how much we believe in you, Brad. Keep bringing up cool stuff. You are the best teacher.
I was searching for info about the Intel Atom CPU, and this came up (Since you use Atom editor). I watched the whole video and got ideas for small desktop apps I want to do :D
and here i was thinking javascript was just for web design, had given up on it thank you for this
On Reddit someone told me to stay away from Electron because it was too complicated for me. I want to make simple desktop gui-based apps using JavaScript in the front end and Python in the backend.
I learnt PHP using one of your guides!!! Thanks a bunch
Please do more videos about electron!!! Brad, this is so awesome!
Cool video. Can't wait to see more. That being said, it would be cool if you maximized your editor, if possible. That right side brightness is painful at night. :)
I am unable to get process to show in the consoles tab of the developers menu, I just get the error "Uncaught ReferenceError: process is not defined
at index.html:19"
Any help?
Inside your "win = new BrowserWindow({width: 800,....}" you need to add "webPreferences: { nodeIntegration: true }"
Cool. Awesome introduction to Electron.
Just what I wanted to know! Thank you for jumping in ad just doing it for us!
Thank you soo much!!!!! I was looking for something like this. Please do continue on this series please. Thank you
Wow ... that was fun. You're right ... leaves one thirsty for more.
This is awesome! Very great tutorial! I've' seen some of your stuff now and I have subscribed to your channel. So, I stopped coding back in 20001 after burning out. I was writing ActiveX and inserting into web browser to distribute. I am finally ready to get back in the game and finally have hope since cross-platform support is here and embedded into the browser. I was looking for a good framework to start with like MEAN. Since, I want to re-write some apps I developed for a vendor years ago, I will still be able to deploy via web server. This is great!
Had to add
webPreferences: {
nodeIntegration: true
}
in win = new BrowserWindow function
Amazing Thanks and please make a full series on it thats cover all the basic crud functionality with electron please.... thanks alot
I love how u explain things
Thanks Brad, nice intro to Electron,
Great intro video, nice and simple as it should be so we can easily follow all of it. Well done. Look forward to more.
awesome! Hope you do more videos about Electron and how to build desktop apps with it
We are waiting more Brad Good job Bro
This was an awesome intro Brad! Thanks so much.
i've been waiting for this. or even if there was electron+external api
I'm so happy that this exists so that I don't have to touch C++ or C#
this is thumbs up for me.. yes i do enjoy watching in this app.
" My Thank's "
I already have an idea which app I going to build :) Waiting for more lessons
Yeah, this is one of those technologies that really makes your gears move and anxious to start creating stuff
Traversy Media no kidding!
Thanks Brad
Perfect into to Electron - just what I was looking for - cheers
great work man
I couldn't find the promised follow up. Did you stop looking at Electron? Otherwise a great series of videos, thank you.
BRad this is a cool app here can’t wait to c more
great tutorial brad
Traversy
you are the best !
Brad,
Would love if you did one with webusb and electron! :)
16k of views and 557 guys, come on !!! push like!
keep "pushing" like that and you won't get any likes
This isn't Ivan's video. "He" won't be "not" getting likes because he pushed for them...
Thank you TraversyMedia
جزاك الله خيرا
Interesting. I will try it soon.
Hey Brad, would you consider redoing it for 2021. With Electron v12 this does not work and as some comments said, the nodeIntegration trick does not work really
your work is so great ,i love it
Great tutorial. Thanks! Would love to see more on this from you. Couldn't find part 2 (if it's done)
Thanks Brad!
Awesome!! Lots of potential!!!!
Very nice introduction, thank you.
Hello sir, if you could make a series on "how to make desktop app with Electron". That would be very useful. thanks
Cheers man, I really appreciate your content. Keep it coming!
Louder and more clear voice this time :-)
Another great video. Desktop applications built from the guts of web development, reuse your JavaScript skills. I understand there are some concerns about resource management with Electron APp's?
you're a lifesaver !
Hello, this was a very good video! Will you make more Electron videos?
Man how awesome, I'm a web developer myself and the ability to use that to build desktop apps cross platform? ahhhhh
thanks for this intro
edit: shit... 3:45 does this mean you can't package the apps as say a .exe that doesn't require installing other stuff (like node.js) it would just come inside that .exe as an execution command or something? That would suck if you have to setup an environment that runs an electron app.
I use Visual Studio Code that for Linux/Windows I just download a file and run it so maybe...
finally, i found what I need
Thanks man alot for this work
Please do a webseries on complete app with electron (notes app for example).
Thank You
you're awesome, i owe you a lot man, wish that one day i could pay you back
Excellent video... learn a lot
Perfect intro, thanks
Very nice.
When will you make a course on electron?
Your vids are awesome, thanks a lot.
2 and a half years later electron is on 7.1.7 lol
and one month after your comment it's 8.0.0
@@mulanszechuansauceisthemeaning and @Static Charge Now 8.2.0...!!!
Now 9.0.4 XD
R they just adding new single line of code as a feature n compiling into a new version or what lol 😂
If, while installing electron, you got this error: "Error: EACCES: permission denied, mkdir '/usr/lib/node_modules/electron/.electron'", use:
sudo npm install -g electron --unsafe-perm=true --allow-root
If you're not using linux, do not add 'sudo'.
Sweet intro!
Got any suggestions about solid database managers to use with Electron?
Been using Sqlite3 but seems to struggle with Electron for some reason.
super cool, thanxx
Well done.
Great! please make a tutorial series and thank you for your efforts, great channel, Keep it up (y)
please tell me, what is difference between win.on('closed') and app.on('window-all-closed'), isn't there only one window ? And closing window does not mean closing entire app?
Thanks , you really help me bro!
great tutorial , thanks a lot
Best tutorial!
Nice - very interesting... Thanks
Super cool...
Thanks for the tutorial.. looking forward for more videos on same topic... :)
Thanks for the tutorial! Wouldn't it be better to download the CSS file locally? What about using the app without an internet connection?
Jean-Simon Robert Ouimet I would say yes. However, for the purposes of an intro to tutorial, linking it would be fine.
Yes definitely. I should have mentioned that. I only did it to make things quicker.
You put me on to a lot of cool stuff!
Please continue !!!! ♥
Are you going to do more keystone.js videos? The first one you did was great and sparked my interest for it!
Pedogoat i plan on it. Im still trying to figure out what i want to do with it
I just don't understand one thing: Why install local and global? Only local is not enough? With that way, will not have 2 versions of the same thing? Thank you!
Did you find out why?
same question here... why installing 2 times?
so you dont have to be in the project dir to run `electron .`
truecoder I get the concept of global installation. But why both global and local is the question. You need one of them, no matter which. But not both.
Hope you get the answer, but if not so in general when we install a module , plugin or some library globally we can access it from anywhere inside our machine even outside our current project directory . Hope that helps .
Nice tutorial as always. So is it possible to deploy electron to the server along with normal app and create a web app that could cooperate with user's machine?
This is awesome