Announcing Genie Builder, a no-code plugin to quickly build web GUIs & dashboards

essenciary · July 22, 2022, 4:40pm

Hi!

I’m very excited to share that we’ve just released Genie Builder (beta), a free VSCode plugin built on top of Genie Framework that helps you build interactive web GUIs for your Genie/Julia apps without writing code. With Genie Builder, you can just drag & drop UI elements such as text, sliders, data tables, and plots to create data apps in minutes without worrying about the front-end code.

Click here to check it out.

Here’s a quick guide to get you started: Genie Builder - Quick Start Tutorial - YouTube

Don’t miss our JuliaCon talk on July 29 for a more detailed tutorial.

If you find Genie Builder useful, you can join our Discord for support, feedback, and feature requests. Can’t wait to hear your thoughts and suggestions!

Thank you,

Adrian

EvoArt · July 22, 2022, 11:42pm

Fantastic! Thanks to all involved for your hardwork

Nathan_Boyer · July 23, 2022, 2:54am

I am curious how the experience compares with Dash and Makie GUIs, though I know next to nothing about any of them. Very excited for your JuliaCon talk!

JeffreySarnoff · July 23, 2022, 3:57am

When I follow the link for your Discord channel, I get this

NO TEXT CHANNELS.
You find yourself in a weird place.

essenciary · July 25, 2022, 2:25pm

That’s strange, sounds like a Discord server issue. Can you please try again and let me know if it works well this time?

essenciary · July 25, 2022, 2:28pm

If I understand your question correctly, the fundamental difference is that with GenieBuilder you create the GUI visually, by dragging and dropping UI elements onto the page – while with Dash and Makie you have to build your GUI by writing code.

JeffreySarnoff · July 25, 2022, 4:29pm

that works today

anon69491625 · August 1, 2022, 11:40am

Maybe just me but I’s getting

julia> import Pkg

julia> Pkg.add("GenieBuilder")
ERROR: The following package names could not be resolved:
 * GenieBuilder (not found in project, manifest or registry)

Stacktrace:
  [1] pkgerror(msg::String)
    @ Pkg.Types ~/julia-1.7.0/share/julia/stdlib/v1.7/Pkg/src/Types.jl:68
  [2] ensure_resolved(manifest::Pkg.Types.Manifest, pkgs::Vector{Pkg.Types.PackageSpec}; registry::Bool)
    @ Pkg.Types ~/julia-1.7.0/share/julia/stdlib/v1.7/Pkg/src/Types.jl:915
  [3] add(ctx::Pkg.Types.Context, pkgs::Vector{Pkg.Types.PackageSpec}; preserve::Pkg.Types.PreserveLevel, platform::Base.BinaryPlatforms.Platform, kwargs::Base.Pairs{Symbol, Base.TTY, Tuple{Symbol}, NamedTuple{(:io,), Tuple{Base.TTY}}})
    @ Pkg.API ~/julia-1.7.0/share/julia/stdlib/v1.7/Pkg/src/API.jl:257
  [4] add(pkgs::Vector{Pkg.Types.PackageSpec}; io::Base.TTY, kwargs::Base.Pairs{Symbol, Union{}, Tuple{}, NamedTuple{(), Tuple{}}})
    @ Pkg.API ~/julia-1.7.0/share/julia/stdlib/v1.7/Pkg/src/API.jl:149
  [5] add(pkgs::Vector{Pkg.Types.PackageSpec})
    @ Pkg.API ~/julia-1.7.0/share/julia/stdlib/v1.7/Pkg/src/API.jl:144
  [6] #add#27
    @ ~/julia-1.7.0/share/julia/stdlib/v1.7/Pkg/src/API.jl:142 [inlined]
  [7] add
    @ ~/julia-1.7.0/share/julia/stdlib/v1.7/Pkg/src/API.jl:142 [inlined]
  [8] #add#26
    @ ~/julia-1.7.0/share/julia/stdlib/v1.7/Pkg/src/API.jl:141 [inlined]
  [9] add(pkg::String)
    @ Pkg.API ~/julia-1.7.0/share/julia/stdlib/v1.7/Pkg/src/API.jl:141
 [10] top-level scope
    @ REPL[10]:1

essenciary · August 1, 2022, 11:50am

Sorry, I don’t understand what you’re trying to do.

I assume what you want is the actual no-code app builder, which is distributed as a VSCode plugin that you should install from the marketplace, by using the links shared in the actual post?

anon69491625 · August 1, 2022, 12:00pm

Hi there
Yep I want to try out GenieBuilder and got the error. I followed the instructions to add manually when the ext install didn’t work and that’s where I am now.

followed instructions ran

ext install GenieBuilder.geniebuilder

got the extentions installed and hit start on GENIE BUILDER SERVER

got this in Repl

dave@deepthought:~/.vscode/extensions/geniebuilder.geniebuilder-0.1.8/scripts$ julia rungb.jl
 _____         _        _____     _ _   _
|   __|___ ___|_|___   | __  |_ _|_| |_| |___ ___
|  |  | -_|   | | -_|  | __ -| | | | | . | -_|  _|
|_____|___|_|_|_|___|  |_____|___|_|_|___|___|_|

LOADING -- PLEASE WAIT.

  Activating project at `~/.julia/geniebuilder`
    Updating registry at `~/.julia/registries/General.toml`
┌ Warning: The active manifest file at `/home/dave/.julia/geniebuilder/Manifest.toml` has an old format that is being maintained.
│ To update to the new format run `Pkg.upgrade_manifest()` which will upgrade the format without re-resolving.
└ @ Pkg.Types /buildworker/worker/package_linux64/build/usr/share/julia/stdlib/v1.7/Pkg/src/manifest.jl:287
  No Changes to `~/.julia/geniebuilder/Project.toml`
  No Changes to `~/.julia/geniebuilder/Manifest.toml`
ERROR: ArgumentError: Package GenieBuilder not found in current path:
- Run `import Pkg; Pkg.add("GenieBuilder")` to install the GenieBuilder package.

Stacktrace:
 [1] require(into::Module, mod::Symbol)
   @ Base ./loading.jl:967
ERROR: LoadError: failed process: Process(`julia --startup-file=no --depwarn=no -e '
            using Pkg;
            Pkg.activate(".");
            Pkg.update();
            using GenieBuilder;
            GenieBuilder.postinstall();'`, ProcessExited(1)) [1]

Stacktrace:
 [1] pipeline_error
   @ ./process.jl:531 [inlined]
 [2] run(::Cmd; wait::Bool)
   @ Base ./process.jl:446
 [3] run
   @ ./process.jl:444 [inlined]
 [4] |>
   @ ./operators.jl:966 [inlined]
 [5] installgb()
   @ Main.RunGB ~/.vscode/extensions/geniebuilder.geniebuilder-0.1.8/scripts/rungb.jl:32
 [6] startgb()
   @ Main.RunGB ~/.vscode/extensions/geniebuilder.geniebuilder-0.1.8/scripts/rungb.jl:57
 [7] top-level scope
   @ ~/.vscode/extensions/geniebuilder.geniebuilder-0.1.8/scripts/rungb.jl:72
in expression starting at /home/dave/.vscode/extensions/geniebuilder.geniebuilder-0.1.8/scripts/rungb.jl:72
dave@deepthought:~/.vscode/extensions/geniebuilder.geniebuilder-0.1.8/scripts$

followed intructions to add GenieBuilder Where did I go wrong?

SOLUTION

It seems to have been the OLD julia version.

I removed the directory ~/.julia/geniebuilder

I changed the julia version to 1.7.3

reran the "ext install GenieBuilder.geniebuilder"

and it WORKED!!

essenciary · August 1, 2022, 12:08pm

Thanks, I understand.

You’re on Julia 1.7 on a linux?

essenciary · August 1, 2022, 12:10pm

OK - I’ll follow up with DM so we don’t spam the thread.

anon69491625 · August 1, 2022, 12:48pm

It seems to have been the OLD julia version.

I removed the directory ~/.julia/geniebuilder

I changed the julia version to 1.7.3

reran the "ext install GenieBuilder.geniebuilder"

and it WORKED!!

PharmCat · August 13, 2022, 9:18am

Hi! Great package!

Is any working example to make file upload with builder?

No idea how to implement examples from StippleDemos

PharmCat · August 13, 2022, 9:32am

I try to make some test and I found that mechanics is low-documented, so I think primary feature request is more minimal working examples for buttons, file upload, ets… and documentation about views html design.

some things is unclear:

what @reactive exactly do? and how to use it?

on(model.message) do message
    model.isprocessing = true
    model.message[] = "Hello to you too!"
    model.isprocessing = false
  end

What is model.message[] and what is model.message and so on…

PharmCat · August 14, 2022, 9:08pm

Hi! It will be very useful to get few small examples with minimal realization with annotation of:

file upload
graphics update
buttons mechanics
registration / authentication
file download

Now it hard to understand how some methods work - because there is no docs (for example for PlotData)

I saw Oscar and Scoring - but there are too much code that more make confused that help

essenciary · August 15, 2022, 11:47am

Thanks - yes, I agree, current demos are too complex. We’ll prepare some small nuggets and recipes to implement useful individual features.

essenciary · November 23, 2022, 5:16pm

Hi @everyone! Today I’m excited to announce Genie Builder v0.2, a major update of our VSCode plugin to help you build Julia apps more quickly and productively.

What’s new?

We’ve integrated the new Genie Framework API, which lets you create apps with less backend code

The no-code UI editor is more powerful and polished featuring automatic loading of binding variables and other improvements.

The app template is more streamlined, making the app building process more intuitive.

Read more in our release post: Genie Builder v0.2: speed up your Julia app development

To install this new version, download or update Genie Builder via VSCode: Genie Builder - Visual Studio Marketplace

juliohm · November 23, 2022, 5:34pm

Amazing work as usual @essenciary Thank you for the awesome user experience.

essenciary · November 23, 2022, 6:03pm

Thank you @juliohm ! Very happy to say that it’s a team effort – I’m lucky to be working with great colleagues at Genie (and we’re hiring!)

Topic		Replies	Views
Genie Builder 1.0 Now in VS Code: Build Genie Web Apps around your Julia code 10x faster Web Stack web , webapps , genie	3	661	May 29, 2025
Announcing Genie Cloud (Private Beta), the no-code platform to quickly build and deploy Genie apps Tooling	1	541	June 13, 2023
Introducing Genie UI Assistant: the AI-powered UI builder for Genie apps Tooling web , webapps , genie , gui	0	612	May 9, 2023
Web development with Julia - quick survey Web Stack	12	1498	December 3, 2021
Tutorial GenieFrameworks.jl New to Julia genie	1	1202	March 15, 2023

Announcing Genie Builder, a no-code plugin to quickly build web GUIs & dashboards

Related topics