search

wailsapp / wails

Create beautiful applications using Go
https://wails.io
MIT License
25.34k stars 1.22k forks source link

Wails with plain HTML/CSS/Js #170

Closed BugDiver closed 5 years ago

BugDiver commented 5 years ago

Can we use wails with plain HTML CSS and js without using any framework? We have a requirement where we want to create a small GUI app in golang but we do not want to use any framework like (Vue or React). Most of the frameworks build static files which get used by wails so I think it should be possible. Have anyone tried this sort of thing? Any help would be appreciated

bh90210 commented 5 years ago

yes it is 100% possible! for now I am not aware of any implementation being done this way to link you I'm afraid. I am thinking that possibly you still have to use webpack? in order to compile to one file, but I'll let someone else comment about the JS part....

but maybe it is worth writing a small tutorial around this method @leaanthony ? seems arbitrarily easy..

leaanthony commented 5 years ago

We used to support this but dropped it. Wails supports anything that essentially builds to a single CSS and js file. The default HTML has a single div with an ID of app. The only thing wails does is call an install script and a build script, eg npm install and npm run build. If you give us an example HTML file and js/css, we can look at what a base template looks like.

leaanthony commented 5 years ago

What we could do is a basic HTML/CSS webpack template. That shouldn't be a problem at all.

leaanthony commented 5 years ago

I've looked at this in depth and it is possible, but it's wildly different depending on how you want to do it. Essentially wails needs a js + css bundle. Generally, the JS will deal with mounting components, dom updates, scoping of javascript functions and CSS. Doing that manually is pretty difficult.

So yes, it is possible, but it's very subjective on how you want to do it. The only thing you need to know from a Wails perspective is this:

If you can provide more information on your specific needs, then I'll keep this ticket open.

BugDiver commented 5 years ago

@leaanthony Thanks for giving the pointers. I think it would help me a lot to get started.

If you can provide more information on your specific needs,

We do not have specific needs. We just wanted to create a GUI with Golang (let's say a POC), and not to use React or Vue for starting.

I think if there is a template (same as react and vue) for plain HTML (with webpack), it would help others if they do not want to use any web frameworks.

Thanks again for all the efforts.

leaanthony commented 5 years ago

So, then that depends on how you want to write your apps. I can get an example working where you have a global object on window which had your app logic and HTML calls those... I will make a branch. If you are a webpacker then I could do with your help.

Vaelatern commented 5 years ago

I want to say this is also something I want to do. No tools, just give wails css, html, and javascript.

bh90210 commented 5 years ago

actually @leaanthony was working on something and I have plans to work on a different solution before v1.0.0 (end of Oct) too. ATM I am working on getting nuxt behave, and I need some help as I am stuck, but if you are interested we could start an open collab on getting this one done (or if you have an idea you can implement alone open a solo PR..)

leaanthony commented 5 years ago

@BugDiver I've not forgotten about this. The issue is, most frameworks have a start point where you mount the app. In plain html/js/css you don't get this by default. Why does that matter? Because you need to wait until Wails runtime loads to be able to do any of the things you may want to do. You would still need to adhere to that for it to work. I have an idea on a way that may work and am looking to get that into v1.0.0.

leaanthony commented 5 years ago

This has not had the attention it deserves so I'm pushing it post V1. Closing for now and listing on the https://github.com/wailsapp/wails/wiki/Post-V1-Enhancements page