You can change the BrowserWindow to use your Django web url. As long as there is no "open in new tab" link, it should behave like a normal application. Incase you have something that opens like that then it will open a new application window. An example of this is there in this video towards the end when I'm testing the results.
hello shivam I have a issue that I have converted one of the website using electronjs and nativefier and I want to change the task bar icon which is electrons icon with my icon can you give me solution for it.
There is a command line --icon option in electron build step and you can add an icon property in BrowserWindow as well. As for nativefier, I haven't used it personally but if you're facing issues then there seems to be an open issue for this which is quite old and many people have found work arounds to do this. Hope this helps github.com/nativefier/nativefier/issues/321
great video! thanks a lot. Do you maybe also happen to know the best practise to convert the web app without building it? so that after the conversion, the app can be developed for further features?
If you find a way please tell me. Node.js does the same exact thing shown in this video... with Edge app shortcut i have no control over size and position and it shows urls.
What I've displayed is a front end Desktop App that uses Rest APIs. Stack here is Vanilla JS built with webpack. React and Angular will also build static front end files in the same way that I've shown. For adding database we can use embedded databases like SQLite. Bundling Postgres and others is not possible. You can obviously install them separately and connect to them to the electron app. You can look into installer options if more flexibility is required.
@Ebizzill That website was a product I was making so there's no tutorial for it unfortunately. The electron bit should work with any framework related project that generates static files for front end. I modeled the build process for that project by looking at react and angular.
@kevinmwangi6782 Since the background process in electron runs node you can connect mongo db in the same ways that you can connect with node. You have a lot of flexibility on this.
@@shivam_g10 I discovered electron-builder and electron-forge, electron-builder being the most easiest because somehow I found a way to edit the app name and the icon image.
Playwright has experimental support for electron: playwright.dev/docs/api/class-electronapplication This repository is a good reference if you're doing it for the first time. github.com/spaceagetv/electron-playwright-example There are eslint dependency issues with it, but those dependencies can be removed to make it run and understand how electron and playwright play together. Hope this helps :)
The angular part of it can be changed to desktop app. That's what I showed in the video. My app is still connected to the backend via rest APIs and the front end was converted to a desktop app
Might be a bit late to comment, but you can, did this just for fun, it converted my Laravel project with Filament php to a desktop app, just remember to make nodeIntegration to false in BrowserWindow, so that you get a smooth experiance.
Simple and straight to the point👍
nice job
Thank you for this really helpful video.
Nice job!
your great bro, thanks for this KT.
Great job.
Hi @Shivam Mathur, please start the electron-js series basic to advance with deep concept.
Bhai Tauri ko use karke application banana sikha de.
Bro, can you show this application icon on desktop. and please show how to build a desktop icon, and server running of this app both desktop and web
Coool! Can I use the same with a Django web app?
You can change the BrowserWindow to use your Django web url. As long as there is no "open in new tab" link, it should behave like a normal application. Incase you have something that opens like that then it will open a new application window. An example of this is there in this video towards the end when I'm testing the results.
Where can i get POC part files that you copied 6:23 link not working in description any other links please share
i have successfully run this now how can i build .exe file ?
Source code please
Will this work if we have local DB and working and whenever internet get back?
hello shivam I have a issue that I have converted one of the website using electronjs and nativefier and I want to change the task bar icon which is electrons icon with my icon can you give me solution for it.
There is a command line --icon option in electron build step and you can add an icon property in BrowserWindow as well.
As for nativefier, I haven't used it personally but if you're facing issues then there seems to be an open issue for this which is quite old and many people have found work arounds to do this. Hope this helps github.com/nativefier/nativefier/issues/321
great video! thanks a lot. Do you maybe also happen to know the best practise to convert the web app without building it? so that after the conversion, the app can be developed for further features?
If you find a way please tell me. Node.js does the same exact thing shown in this video... with Edge app shortcut i have no control over size and position and it shows urls.
How do I contact you. We have a requirement for desktop app development
Amazing which stack did you use? Also how do we compile database in a production build??
What I've displayed is a front end Desktop App that uses Rest APIs. Stack here is Vanilla JS built with webpack. React and Angular will also build static front end files in the same way that I've shown.
For adding database we can use embedded databases like SQLite. Bundling Postgres and others is not possible. You can obviously install them separately and connect to them to the electron app.
You can look into installer options if more flexibility is required.
@@shivam_g10 do you have a tutorial for the website you just demo'ed?
@@shivam_g10 I have a NodeJs,Express Js app.I ask can I use MongoDb Atlas or local mongodb for the database and still deploy my app using this?
@Ebizzill
That website was a product I was making so there's no tutorial for it unfortunately. The electron bit should work with any framework related project that generates static files for front end. I modeled the build process for that project by looking at react and angular.
@kevinmwangi6782 Since the background process in electron runs node you can connect mongo db in the same ways that you can connect with node. You have a lot of flexibility on this.
Does an application like this need to be signed?
Will this support js fetch api? Want to connect mysqli with php using fetch
can you go over packaging and changing icon image?
There are a lot of details in packaging, I'll make a video on that this week. That should be helpful
@@shivam_g10 I discovered electron-builder and electron-forge, electron-builder being the most easiest because somehow I found a way to edit the app name and the icon image.
I'm glad you were able to solve your query!
very cool!
how do i open playwright in an electron window? Please!
Thanks.
Playwright has experimental support for electron: playwright.dev/docs/api/class-electronapplication
This repository is a good reference if you're doing it for the first time. github.com/spaceagetv/electron-playwright-example
There are eslint dependency issues with it, but those dependencies can be removed to make it run and understand how electron and playwright play together.
Hope this helps :)
@@shivam_g10 thanks
i make web application using project in Angular, Laravel & mysql. Can i convert into desktop app ?
The angular part of it can be changed to desktop app. That's what I showed in the video. My app is still connected to the backend via rest APIs and the front end was converted to a desktop app
Can you convert a laravel website to desktop app with electron? Phpdesktop is a bit buggy.
Might be a bit late to comment, but you can, did this just for fun, it converted my Laravel project with Filament php to a desktop app, just remember to make nodeIntegration to false in BrowserWindow, so that you get a smooth experiance.
@@volts52 Apart from the nodeIntegration: false, change you mentioned, is it still just as easy as the video makes it look?
is this software works in ofline
Me no English can speak?
Yes, this will work offline after install if your app doesn't need to access external resources from the internet.