Recommendations for a Web App for Noob

Specific Domains Web Stack
, ,
1

I’d like to make a very basic WebApp running locally where the user can see some basic text/graphics, select various options, toggles, items from a list, input text, select files, set parameters, etc. Underneath (the guts) would be a bunch of calculation based on user input input and then a display (text, tables, graphics).

I’ve never made a WebApp before. I’d like to use Julia for the calculation guts. Which packages do you recommend? What should my workflow be? Is there a tutorial that will take me from zero to useful?

Thanks for your recommendations.

2

I’d highly recommend giving Interact.jl a try.

3

I like Interact.jl, but I’m not sure that a Jupyter Notebook will be acceptable. Can Interact.jl be used with a plain web interface somehow?

4

The documentation said it could be used on other places, I have never tried that though.

Interact allows to create small GUIs in Julia based on web technology. These GUIs can be deployed in jupyter notebooks, in the Juno IDE plot pane, in an Electron window or in the browser.

http://juliagizmos.github.io/Interact.jl/latest/

2 Likes
5

Yes. If you use it from a Jupyter notebook it makes it in the notebook, but if you use it outside a Jupyter notebook then it makes a standard web interface. This makes it really easy to create and debug from standard Julia development tools!

1 Like
6

Thanks! I’ll give the tutorial a try and see how it goes.

7

If you run into the limitations of what Interact can do on the front end, you can always build that side using traditional (read: javascript) tools and then do the calculations with a Julia API.

8

I hope I can stay within Julia to build the WebApp. I know zero Java/JavaScript/PHP/Rails/everything.

1 Like
9

Also consider the Julia web framework Genie. I recommend to be patient though, say for 6 months, since this is work in progress.

2 Likes
10

You really want Interact.jl to make the interface and Blink.jl for a standalone browser window. I’m using this combo right now, doing quite a few of the things you mention and plotting the output live.

You can also serve the same Interact ui on the web using Mux.jl and an extra two or three lines of code.

2 Likes
11

I watched a presentation about Genie.jl on YouTube and I found it super capable and also super complicated for a noob.

12

Yes, this looks very appealing!

13

Yes, I agree. Genie integration with Interact or similar is required to make Genie more newbie friendly similar to R Shiny or Python Dash.

I am curious about what Raf proposed: “Interact + Blink/Mux”. It sounds beginner friendly but documentation with examples is super important.

1 Like
14

It actually is quite simple. Let’s say you create an Interact app with either custom widgets or using the @manipulate macro (which is just a shortcut for a specific case of custom widget). For example:

ui = @manipulate for i = 1:10, j = "test"
   j^i
end

If you are in the notebook, this appears inline already and you are good to go. If you are doing this from the REPL, you can serve it via Blink:

using Blink
w = Window()
body!(w, ui)

or in a browser via Mux:

using Mux
WebIO.webio_serve(page("/", req -> ui))

(there’s discussion on a simpler API here).

This should all be documented here. The only bit I’m not sure about is the Juno integration as a few things changed there.

2 Likes
15

That’s also an interesting approach. In principle Interact allows more or less arbitrary HTML + JavaScript using WebIO (you can construct arbitrary DOM nodes with say node(:div, ...) and run javascript with onimport) but at some point it may be simpler to do it in HTML + javascript directly. Do you have a writeup of how to make a javascript+julia webapp like this? I also wonder whether that could benefit from some of the Interact stack, for example Knockout allows two-way binding between javascript-knockout observables and julia observables, so maybe one could code the whole thing in javascript and share the data with Julia via these observables.

16

I’m writing Julia-based APIs with Joseki.jl and this project is an example of a front end written in Angular (my personal favorite, but Vue and React are also both options) and two different APIs written in Julia. DiffEqOnline is another older example of a traditional front end sitting on top of a Julia API.

1 Like
17

Hi Raf! I’m also trying to develop some web app with julia. Do you have any examples or projects on GitHub I could checkout to see how you’re using Interact and Blink? I would really really appreciate it.

Regards!

18

We have this soon to be published package for DynamicGrids.jl models.
https://github.com/cesaraustralia/DynamicGridsInteract.jl

It has a few bugs righ not but you can see how we build the interfaces for atom, electron and served to the web.

There are also a few manual model-fitting interfaces in GrowthMaps.jl:
https://github.com/cesaraustralia/GrowthMaps.jl/blob/master/src/fit.jl

Were you can manually fit models to maps or plotted curves.

The thing you may find confusing is that everything is general - there are no specific sliders being generated in these packages, instead the interfaces are for arbitrary composed models. We use Flatten.jl and FieldMetadata.jl to flatten composite objects down to tuples that you can make sliders from.

3 Likes
19

Thanks a lot! I´ll check it out