ElectronJS Crash Course 2022

Поделиться
HTML-код
  • Опубликовано: 24 июл 2024
  • ElectronJS Crash Course 2022
    Learn the basics of ElectronJS in this beginner-friendly crash course
    ElectronJS Tutorial is going to introduce you to every ElectronJS Concepts
    Chapter Wise Videos: bitfumes.com/courses/javacrip...
    Source Code : github.com/bitfumes/electronj...
    Hope you enjoy and may this video add value to your life.
    🌟 Course Contents 🌟
    ⏳ (00:00:00) Intro
    ⏳ (00:03:20) My First Window
    ⏳ (00:11:47) Activate Application
    ⏳ (00:16:09) Preload Script
    ⏳ (00:20:17) Production Ready App
    ⏳ (00:24:55) Add Items Menu
    ⏳ (00:31:42) Clickable Menu
    ⏳ (00:38:42) New Browser Window
    ⏳ (00:46:29) Open camera
    ⏳ (00:55:33) Capture Image
    ⏳ (01:02:30) How IPC Works
    ⏳ (01:08:29) Render to Main data share
    ⏳ (01:17:00) Render to Render data share
    ⏳ (01:25:40) Add Notification
    ⏳ (01:27:34) What Next ?
    / sarthaksavvy
    / sarthaksavvy
    Discord server
    / discord
    🌟 Premium Courses 🌟
    Check out 32 hours of Laravel Content at
    bit.ly/indepthlaravel
    🔥 DIGITAL OCEAN HOSTING Affiliate
    Get $100 in credit for 60 days m.do.co/c/a3a47da9b9a8
    🌟 Gadgets I use 🌟
    Camera amzn.to/3mGikwL
    Blue Yeti Mic amzn.to/3mA6YdI
    Blue Yeti Mic Foam Cover amzn.to/2GkmV8w
    Capture Card amzn.to/3ed3cnN
    🌟 Support Me ( I am a full-time RUclips) 🌟
    Github github.com/sponsors/bitfumes
    Patreon / bitfumes
    RUclips / @bitfumes
    🌟 FOLLOW ME 🌟
    Subscribe for New Releases!
    Twitter - / bitfumes
    Twitter - / sarthaksavvy
    Facebook - / bitfumes
    Instagram - / bitfumes
    (ask me questions!)
    -- QUESTIONS? --
    Leave a comment below and I or someone else can help you.
    For quick questions you may also want to ask me on Twitter, I respond almost immediately.
    Email me support@bitfumes.com
    Thanks for all your support

Комментарии • 163

  • @Bitfumes
    @Bitfumes  2 года назад +7

    👉 Get Chapter Wise Videos here : *bit.ly/3yCEgSR*
    👉 Video Timestamps
    ⏳ (00:00:00) Intro
    ⏳ (00:03:20) My First Window
    ⏳ (00:11:47) Activate Application
    ⏳ (00:16:09) Preload Script
    ⏳ (00:20:17) Production Ready App
    ⏳ (00:24:55) Add Items Menu
    ⏳ (00:31:42) Clickable Menu
    ⏳ (00:38:42) New Browser Window
    ⏳ (00:46:29) Open camera
    ⏳ (00:55:33) Capture Image
    ⏳ (01:02:30) How IPC Works
    ⏳ (01:08:29) Render to Main data share
    ⏳ (01:17:00) Render to Render data share
    ⏳ (01:25:40) Add Notification
    ⏳ (01:27:34) What Next ?
    👉 Comment your views or request for any other *crash course*
    👉 Keep learning and Keep growing

  • @jeffsuddaby4788
    @jeffsuddaby4788 2 года назад +1

    My lucky day! Elegantly integrated demos of key concepts, practical tips on how to navigate the Electron docs, and (at last!!!) a tutorial that doesn't melt down with breaking changes on install... Now I can cross the bridge from web dev to desktop apps. Thanks so very much.

  • @LearningWithBandE
    @LearningWithBandE Год назад +5

    This is fantastic! Your instructions are clear and concise and I love how you explain concepts while showing how to look through the official documentation, which teaches how to find information and figure things out on your own. Not nearly enough teachers do that!

  • @luis6732
    @luis6732 Год назад +1

    Thanks for your easy to follow explanations, one step at a ti. It makes learning less overwhelming!

  • @queenofsheba8275
    @queenofsheba8275 2 года назад +1

    Thank you! This is the most up to date course on Electron I've found on RUclips

    • @Bitfumes
      @Bitfumes  2 года назад +1

      Glad it was helpful!

  • @remon962
    @remon962 Год назад +2

    Thank you for your effort in making this video. Really helpful to me! I was really confused before but now i am clearer now about electronjs.

  • @mickyrendon7382
    @mickyrendon7382 Год назад +1

    i´m new in this channel and i'm really fascinating how you explain the concepts! it was easy for me to understand electron as you teached, the best part is fresh content! i was blocked with others courses because the content is from 2 or 3 years ago... thank you so much for this good content! you got a new subscriber!

    • @Bitfumes
      @Bitfumes  Год назад +2

      waooo, so nice comment bro
      This is my real motivation, thanks for your support
      Keep learning
      Subscribe, like and share this video

  • @JonathanCook-kl2zp
    @JonathanCook-kl2zp 11 месяцев назад

    Brilliant tutorial. Loved your enthusiasm as it comes across as genuine.

  • @arifdevcoding
    @arifdevcoding 2 года назад +3

    crash course that i couldn't ask but needed the most as a web dev. thanks bro!

    • @Bitfumes
      @Bitfumes  2 года назад +1

      Sure, I am working on java crash course and spring boot crash course

  • @felixljr
    @felixljr Год назад

    Such a great tutorial, very clear explanations!!!!

  • @adityamore32
    @adityamore32 2 года назад

    Thank you, Excellent Course Make more tutorials on this electron js

  • @nagendrababupalacharla
    @nagendrababupalacharla 2 года назад +1

    Good to see u again with new technology bro

  • @aki1840
    @aki1840 Год назад

    I love how this man uses Stack Overflow. You can tell he makes software, he is the man.

  • @elajcha
    @elajcha Год назад

    Yoo tnx dude, everytNice tutorialng works. I LIKE IT

  • @trungmaithanh91
    @trungmaithanh91 9 месяцев назад

    electron so easy after this video. thank you very much for sharing

  • @ArmandoBN497
    @ArmandoBN497 Год назад

    I have a mac and I'm having trouble changing the name of my application on the dock.
    On the window and menu bar i figured out how but still can figure out the dock name just says Electron

  • @amitavroydev
    @amitavroydev 2 года назад +1

    Great introduction.. slowly starting with it. I am excited as well.

    • @Bitfumes
      @Bitfumes  2 года назад

      Yeah, it is very nice thing to learn and easy too

  • @liamwang9497
    @liamwang9497 Год назад +1

    Thanks for an excellent video!
    And a BUG fix:
    In the part "render to render data share", after we cilcked capture button and the win2 closed, we cannot reuse such auto-close function properly -- if we open a camera window and then capture again, an error will occurs that something was destroyed and the win2 remains. I think we can use win2.destroy() instead of win2.close() to fix this problem.

  • @muhammadagung2934
    @muhammadagung2934 9 месяцев назад

    BROOO I LIKE UR TUTORIAL, the explanation u gave it's really ez to understand, thank you so much!

    • @Bitfumes
      @Bitfumes  9 месяцев назад

      Glad it helped!

  • @mdhossen7082
    @mdhossen7082 Год назад +1

    This video and your react.js crash course are very beneficial,
    thanks,

  • @TonyTesla
    @TonyTesla Год назад

    Thanks for your electron course,Render to Main data share,is very helpful for me to study electron framework.You are the best teacher in the world!!!!!!!!!

  • @dm-bn4nq
    @dm-bn4nq 2 года назад +3

    Sir , thank you so much , i need more of this and advanced lessons please , you're the best no cap

    • @Bitfumes
      @Bitfumes  2 года назад

      I will try my best to move to advanced stuffs

    • @yoskokleng3658
      @yoskokleng3658 Год назад

      @@Bitfumes yeah, pls

  • @TheNamesJT
    @TheNamesJT 2 года назад

    at 26:48 you have syntax red text that says Variable declaration list cannot be empty is that an extension and if so what is it?

  • @manukyanq
    @manukyanq Год назад

    nice video, really helpful!

  • @zzz-1x
    @zzz-1x 11 месяцев назад

    How about hot reload and auto refresh after files changed bro? Thanks you!

  • @almeralmazan
    @almeralmazan 2 года назад

    Awesome video!!! is it possible to connect a fingerprint scanner like Digital Persona with electronjs?

  • @ArchIntelLTD
    @ArchIntelLTD 5 месяцев назад

    Thank you very much

  • @queenchespin
    @queenchespin Год назад

    Nice tutorial.... Very helpful

  • @mahendranath2504
    @mahendranath2504 Год назад

    Thank you so much ❤❤❤❤

  • @Ebizzill
    @Ebizzill 2 года назад

    after the npm run make prompt I find that I have to keep my web server on in order for the desktop app to work, what am I doing wrong ?

  • @eatsometoes5139
    @eatsometoes5139 Год назад

    just a simple question......I wanna do a rap what should I focus the most on when I wanna edit or make a good soft?i would love to

  • @henrybelmonte438
    @henrybelmonte438 Год назад

    I follow you since you released your codeigniter 3 series, question, is t possible to enable scree sharing

  • @friziana9506
    @friziana9506 Год назад +1

    Finally, I found someone who posted a normal working crack!

    • @Bitfumes
      @Bitfumes  Год назад

      Thanks for watching, please subscribe and like this video

  • @_xentropy
    @_xentropy 2 года назад +1

    Excellent video. Much thanks.

    • @Bitfumes
      @Bitfumes  2 года назад

      Glad you enjoyed it!
      Please share with your friends, and subscribe to bitfumes channel

  • @ballpen9157
    @ballpen9157 Год назад

    Thank you so much. Can you create something like powerpoint? is that possible?

  • @Ebizzill
    @Ebizzill 2 года назад

    I want to change the image of the desktop icon, how would I do that?

  • @ugochukwuonwuchekwa1077
    @ugochukwuonwuchekwa1077 Год назад

    Can you convert and existing web app to desktop using Electron JS?

  • @ramezrafla
    @ramezrafla Год назад +1

    Nice crash course, well done!

    • @Bitfumes
      @Bitfumes  Год назад

      THanks bro,
      Thanks for watching, please subscribe and like this video

  • @arunkumarmathivaanan5700
    @arunkumarmathivaanan5700 2 месяца назад +1

    thank you for nice explanation.

    • @Bitfumes
      @Bitfumes  2 месяца назад

      So nice of you

  • @daoudaseye3018
    @daoudaseye3018 Год назад +2

    Hi ,
    Électron is really interesting but have some questions.
    I use an existing laravel livewire project to turn it into électron app but i sée électron with laravel are really slow. And sometimes have a jugé delay to serve content and flickering when navigation between menu content.
    Do you have some advice ???

    • @Bitfumes
      @Bitfumes  Год назад +1

      If you have slow response then you need to optimize your API you have created in laravel.
      If electron is making it slow, make sure you are using updated versions of all packages and try to debug where it is slowing

  • @jyotiranjanswain1737
    @jyotiranjanswain1737 Год назад +1

    Very helpful, for overview.

    • @Bitfumes
      @Bitfumes  Год назад

      Thanks for your love and support, keep learning. Join bitfumes telegram group t.me/bitfumes

  • @certifiedmemer6000
    @certifiedmemer6000 Год назад +1

    having tNice tutorials tutorial playing when first using soft soft was a godsend. Thank you!!

  • @jakubgadzala7474
    @jakubgadzala7474 Год назад +1

    Hey, I have a question. I have been grinding whole day since the afternoon. Now, it's almost 4am. My problem:
    I have a drag and drop game. Eight boxes in the top row (draggables), eight boxes in the bottom row(droppables). Everything works great. I'm using jquery ui with punch. It works great in my local environment, Chrome for mobile in dev tools, and so on. However this entire thing is run in Electron js. I just took it for a spin to my classroom that has a touch screen TV computer. And the drag and drop doesnt work at all.
    Brother, for me its very late and I will just drink some beer and sleep, but if you had any clue what could be the issue I would appreciate.

    • @Bitfumes
      @Bitfumes  Год назад

      I would suggest you to ask same question on that drag library github repo.

  • @nezuko_130
    @nezuko_130 Год назад

    makes complete sense. Only a couple other tNice tutorialngs I need to find out before I can actually make it work, but you’ve got more in depth

  • @viswabharathreddy147
    @viswabharathreddy147 Год назад

    how to change default name of application in electron?

  • @aqua-vc2oe
    @aqua-vc2oe Год назад

    TNice tutorials is the channel that made start actually creating instead of being intimidated by the software. Thanks for a new form of therapy

  • @TheNamesJT
    @TheNamesJT 2 года назад +1

    I wish he went over how to seperate the menu from the main.js and how to connect seperate js files onto the main one. With the current tutorial he just shows everything in one js file basically which isn't the best thing.

  • @overtideasandsolutionschandan
    @overtideasandsolutionschandan Год назад

    Good crash course. How to develop a website using Web API calls using electron?

  • @largezen
    @largezen 6 месяцев назад

    how to build for exe file. please help me

  • @ahmedragab9418
    @ahmedragab9418 Год назад

    you are very good and think you

  • @zulaazul1660
    @zulaazul1660 Год назад

    is there state management in Electron JS?

  • @jwlzloff26
    @jwlzloff26 Год назад +1

    God your video saved me a lot of time, thx dude!

    • @Bitfumes
      @Bitfumes  Год назад

      Glad to hear it!
      Thanks for watching, please subscribe and like this video

  • @gigai9361
    @gigai9361 2 года назад +1

    When I used npx electron-forge import: Make sure you git installed and Node.js version >= 12.13.0.
    My Node.js normal but what about git?

    • @edwardhandrich6043
      @edwardhandrich6043 2 года назад

      Yes, @11:51 .gitignore magically appears. @22:22 you say "initialize git repository, which we already did". I didn't see where you initialize git.

  • @divyadharshni6694
    @divyadharshni6694 Год назад

    worked for . On default it was at Agressive TE for but I clicked to the right

  • @tazimbintucooking
    @tazimbintucooking Год назад

    how to stop hearing yourself in headphones when recording softs?

  • @ballpen9157
    @ballpen9157 Год назад

    Wow, i found my new teacher. What differ you from other youtuber. You go to documentation which i really like.

  • @ejaadhulab8924
    @ejaadhulab8924 Год назад +1

    Awesome content as always. Butfufes rocks!! Any idea 💡 where to get tutorial on electron with simple sql dB. I have searched Google too but they are all outdated having issues. Thanks in advance

  • @hanifullahjamalzai3351
    @hanifullahjamalzai3351 2 года назад

    Thank you ❤

    • @Bitfumes
      @Bitfumes  2 года назад +1

      You're welcome 😊

  • @egliselessemeurs4981
    @egliselessemeurs4981 Год назад +1

    What an angel! You save my broken head!

    • @Bitfumes
      @Bitfumes  Год назад

      Thanks for watching, please subscribe and like this video

  • @yoskokleng3658
    @yoskokleng3658 Год назад

    Can you make a tutorial about merge electron js with nuxt js or vue js? I think it would be cool.

  • @Gameboyl
    @Gameboyl Год назад

    Fantastic course I'm on IPC rn and gotta admit its a little bit too hard

  • @Sonamsingh-vz1ex
    @Sonamsingh-vz1ex Год назад

    Hey, I'm just starting to get into making soft and tNice tutorials 17 minute video helped a LOT MORE than those one hour long tutorials out

  • @raymondmichael4987
    @raymondmichael4987 2 года назад +1

    Really appreciate your work brother. Very good tutorial and well paced.
    Please consider part two and three if possible.
    Part 2 Adding Reactjs
    Part 3 adding Tailwindcss
    Part 4 Using mongodb evel local,

    • @Bitfumes
      @Bitfumes  2 года назад +1

      Thank you, I will

    • @raymondmichael4987
      @raymondmichael4987 Год назад +1

      @@Bitfumes,
      Part 2 please

    • @BlexJS
      @BlexJS Год назад

      Why new parts? everything you list is simple package installations and config settings, there is nothing complicated about it

    • @raymondmichael4987
      @raymondmichael4987 Год назад +1

      @@BlexJS even electron itself is just a simple package installation

    • @BlexJS
      @BlexJS Год назад

      @@raymondmichael4987 Well, there's no arguing😁

  • @redsmith9953
    @redsmith9953 Год назад

    Very good tutorial, someday make one like this but using "Tauri", still i don't get why use all of this instead of c#, but anyway, thanks!

  • @jebythomas3485
    @jebythomas3485 Год назад +1

    starting the video). I'm looking forward to making soft in tNice tutorials software!

    • @Bitfumes
      @Bitfumes  Год назад

      Hope you enjoy it!
      Thanks for watching, please subscribe and like this video

  • @kashifumer9283
    @kashifumer9283 Год назад +1

    Now tNice tutorials was truly an aweso video. I love your thorough style

    • @Bitfumes
      @Bitfumes  Год назад

      Thanks for watching, please subscribe and like this video

  • @ankush4484
    @ankush4484 Год назад +1

    Great

    • @Bitfumes
      @Bitfumes  Год назад

      Thanks for watching, please subscribe and like this video

  • @MASKED_AMSR
    @MASKED_AMSR Год назад

    Up to you dawg, how good do you want it?

  • @anupriyaprasad2130
    @anupriyaprasad2130 Год назад +1

    Febens Lordeus Thank you!

    • @Bitfumes
      @Bitfumes  Год назад

      Thanks for watching, please subscribe and like this video

  • @alexon2010
    @alexon2010 Год назад

    I'm watching a lot of electron videos, but I still haven't found good information... I'm a web developer, for some time now we are used to using import and not require, we also use typescript for type validation even reluctantly I learned typescript and today I use it everywhere... but when I go to electron I can't run code, even if I check to use import and typescript I always have an error of import -> import { app, BrowserWindow } from 'electron' not recognizing it, even having configured the my package.json and tsconfig.json

  • @N.k.thakor6458
    @N.k.thakor6458 13 дней назад

    thanks to give me hope

    • @Bitfumes
      @Bitfumes  2 дня назад

      Thanks for your love and support, keep learning. Join bitfumes newsletter bitfumes.com/newsletters

    • @Bitfumes
      @Bitfumes  2 дня назад

      Thanks for your love and support, keep learning. Join bitfumes newsletter bitfumes.com/newsletters

  • @ishaprabhu8662
    @ishaprabhu8662 Год назад

    The application gets killed as soon as I close the window even after applying the activate application code snippet. please help.

    • @ishaprabhu8662
      @ishaprabhu8662 Год назад

      i'm using windows 10 with npm version 8.15.0

  • @gameeiei9842
    @gameeiei9842 Год назад

    How to build to .exe?

  • @madhanhasee6625
    @madhanhasee6625 Год назад +1

    What the name of the vscode theme that you're using..

    • @Bitfumes
      @Bitfumes  Год назад

      It's material design

  • @xarzu
    @xarzu 17 часов назад +1

    How would something like Menu appear in a Microsoft Windows Application.?

    • @Bitfumes
      @Bitfumes  17 часов назад

      I think it will be same but you can also have some windows specific menus

  • @gsdgfvzxczxc9152
    @gsdgfvzxczxc9152 Год назад

    Wao

  • @tamaldas381
    @tamaldas381 Год назад

    dat escalated quickly

  • @ballpen9157
    @ballpen9157 Год назад

    what should I watch after this video?

  • @glareminds4286
    @glareminds4286 Год назад

    tanx, pls lets go advance

  • @sarahasad8707
    @sarahasad8707 2 года назад +1

    👍👍👍

  • @victoroliveira9131
    @victoroliveira9131 Год назад +1

    ❤️

    • @Bitfumes
      @Bitfumes  Год назад

      Thanks for watching, please subscribe and like this video

  • @AntiGrindServices
    @AntiGrindServices Год назад

    softEX softs like a mouthorgan.. why?

  • @rikki7663
    @rikki7663 4 месяца назад +1

    why no one focus on electron js if it can build desktop application. May be something wrong with this framework. I am hardly seeing any recent tutorial for electron js mostly 3-4 year old

  • @runugope4227
    @runugope4227 Год назад

    understanding how everytNice tutorialng works. TNice tutorials is like my 10th ti watcNice tutorialng tNice tutorials lol I’m so basic!

  • @afifhaiqal2159
    @afifhaiqal2159 Год назад +1

    Make a 1 hour video of one nice tuto from google

  • @pratikpatil5696
    @pratikpatil5696 Год назад

    upload react js course

  • @jessielaplascaosorno4044
    @jessielaplascaosorno4044 Год назад +1

    When u first used a phone in ur life it probably was complicated too.

  • @alto794
    @alto794 Год назад

    It ans you have completed the ga

  • @bubuluke
    @bubuluke Год назад

    Is there a Github repository or do you have to type while following the tutorial?

  • @always_swagin
    @always_swagin Год назад +1

    yeah

    • @Bitfumes
      @Bitfumes  Год назад

      Thanks for watching, please subscribe and like this video

  • @mohamedsaid320
    @mohamedsaid320 Год назад

    missing my ti line sir.

  • @thepokemontrainer6894
    @thepokemontrainer6894 Год назад +1

    literally rn..

  • @Owen.v
    @Owen.v Год назад

    Thank you for tNice tutorials video! I just got soft softs today, and even with the guidebook, I was lost. TNice tutorials video taught even better than

  • @Yash_27
    @Yash_27 Год назад

    more money then I would recomnd getting Ableton, it's much more powerful and better organized. You don't need to get the suite

  • @themecapture7376
    @themecapture7376 Год назад +1

    Will i watch your channel 24/7 just to look at that beautiful face of yours? *yes*.

    • @Bitfumes
      @Bitfumes  Год назад

      Thanks for watching, please subscribe and like this video

  • @r.sgupta1136
    @r.sgupta1136 Год назад

    when i click GMS it gives sotNice tutorialng that softs electrical with no app soft whatsoever

  • @InDiAnAjOnEs0002
    @InDiAnAjOnEs0002 3 месяца назад +2

    bhai tum sikhaane aaye the ya confuse karne aaye the, interview ke pahle tumhara video dekh liya, ab khopadi fodne ka man kar raha hai..

    • @Bitfumes
      @Bitfumes  3 месяца назад +1

      sorry bhai, next video or acha banaunga

  • @zaybrazile427
    @zaybrazile427 Год назад +1

    Wait.

    • @Bitfumes
      @Bitfumes  Год назад

      Waiting for what bro??

  • @QamarAbbas-nb2cl
    @QamarAbbas-nb2cl Год назад +1

    interest please let know ahead of ti

    • @Bitfumes
      @Bitfumes  Год назад

      Thanks for watching, please subscribe and like this video

  • @krkr2132
    @krkr2132 Год назад +1

    dont even soft like anytNice tutorialng, was that a problem for more experienced people here as well?

    • @Bitfumes
      @Bitfumes  Год назад

      Please hit like if this video is helpful