Global Javascript and/or CSS code
Greetings fellow Mendix community.
I'm here to present just an idea on the upgrade for Mendix as a platform, and the way you type the code.
I'm gonna try to be as brief as possible before I explain what I really need, which is an option within Mendix modeler itself to inject global javascript/CSS code.
So far, if you wish to have custom code written in your Mendix app, and by custom code, I mean custom Javascript code, you're limited to three options, as far as I understand:
1. Widgets
Widgets are awesome and work insanely good job. They're preconfigured to receive entity objects, which you can use (__GUID) to perform different actions such as update database, dispatch microflows, ...
- GOOD: You have Mendix object and you can use it.
- BAD: Dojo... ugh. Ok. I'm not a huge fan. I've built a dojo/wrapper for VueJS, the code is available here (https://github.com/Intonovi/mendix-vuejs-widget-boilerplate) and you can use it to write more familiar code. There's also a great React library on Github if that's your weapon of choice. Also, bad thing is, once you change page, for example, widget data is lost forever. You can't load in "global" functions there, they're scoped to the widget itself.
2. Theme directory (index.html)
Here you have a great place to fit in your custom imports... Google fonts, Javascript CDN libraries, all sort of goodies.
- GOOD: This is exactly what's expected of the task I want to fulfill what I need, a global place to place my global imports. Fonts, JS libraries like lodash, momentJS, ...
- BAD: Errrrrr, PhoneGap? Every time I want to change something, I have to build a new version of APK/IPA, deploy to stores, and then I need users (!!!) to manually update the app, otherwise, my features won't work? Extremely bad. The key point of most of the frustration I've had in my ~2y of meddling with Mendix.
3. HTMLSnippet
This is an amazing tool/widget that grants you the ability to write your own HTML, Javascript, Javascript with jQuery. But it is still just a widget, so my points stand withing the first declarative point I've had in this post.
Now, bottom line and my feature request:
A PLACE IN MENDIX WHERE YOU CAN ENTER GLOBAL JAVASCRIPT/CSS WITH A BOOLEAN SELECTOR WHETHER YOU WANT THAT CODE IN HEADER OR FOOTER
This is a key thing that would make my life as an app developer a paradise. Mendix is an amazing tool for already experienced developers to speed up a lot, but also an extreme mud-pit of slowness for experienced developers that know how to get their head around projects.
So, just to finalize my suggestion of how this can be done, here's a bit of imagery:
Sorry for the long post, but I hope it'll be clear and understood as an amazing option by Mendix.
Thank you for your time.
- The thing with phonegap is one I recognize as a problem as well. It helps if those phones are in your own company and you can push the application to the phones but the moment it's individual people using it it gets tougher to convince them they need to reinstall the app and not just restart to update it.
Especially if it's not through an app store and thus the phone recognizes it as "unknown source --> likely unsafe, you need to agree to give additional permission to install"
- Wrapping Vue in a Dojo widget is a bad idea. It's the same idea as someone had with adding React to a widget. The problem is that you will end up with Vue a couple of times in widgets.js. Doing it once might be fine.
That being said, the only thing I can reveal is that a lot is going to change in terms of widgets. We're moving away from Dojo and are heading towards all React, removing a lot of the overhead code like update, postCreate etc. This is still in its early stages, but plugin widgets are going to replace current custom widgets. As I am not in charge of that development, there isn't a lot I can tell about it, only that Mendix is working on it.
- If you want to write widgets in a different way, but still use Dojo (yeah I know, it kind of sucks), have a look at my widget-base and generator-mendix-widget. You can write widgets in a ES6 syntax, but still output an AMD compatible dojo widget, using Webpack.
- Loading global things into your page using a widget is possible. We're doing something similar with our new Feedback widget, as well as our in page guidance (did I mention i use Vue for this, outside of Mendix? ;-)). Of course you need to think about scoping, but adding a widget to a layout and exposing things globally is possible. Google Maps widget does this, for example
- I agree that it should be possible to load things globally (would probably circumvent adding jQuery 234x times in every widget).