Best way for offline development

I'm interested in the communities workflows for development, especially on the Bangle.

Mine is as follows on Arch Linux:

• Starting a local environment with the start script.
  
• Checkout a branch
  
• Open tabs for localhost:4000 and localhost:4001 in chromium.
  
• Install app from local apploader on Bangle
  
• Files to be modified are loaded into the web IDE and edited there or in VSCodium depending on anticipated amount of changes
  
• Upload and debugging in web IDE
  
  

Gotchas:

• I link BangleApps/modules and EspruinoDocs/modules to EspruinoWebIDE/[b|e]mod dirs and set http://localhost:4001/bmod|http://localhost:4001/emod as module dirs in the web IDE. Otherwise CORS prevents me from loading modules.
  
  

I have played around with using the CLI tools for upload with the options for watching files which works fine but I always come back to the browser based method since it it a bit more finicky on the command line.

What are your top tips on developing offline?

Script for starting the environment:

export PATH="$(gem env | grep USER | tr -s ' ' | rev | cut -d ' ' -f 1 | rev)/bin:$PATH"

gem install jekyll jekyll-theme-slate
cd BangleApps
jekyll serve --port 4000 &
cd ..
cd EspruinoWebIDE
jekyll serve --port 4001 &

I've also played around with multiple ways developing and my highest priority in developing is using familiar tools with quick iteration times. Since Bluetooth pairing is very finicky for me (i.e. switching from phone to pc and back), I always either use the emulator or connect through the web IDE remotely in gadget bridge.

I use JetBrains to develop and have a script that takes the app.js and copy pasted it into the web IDE. From there I upload it automatically to the emulator or the watch over the remote IDE connection.

Pro:

• I can use all my tools and get to run the code in the emulator quickly.
  
• I can run the same code on the watch easily using remote IDE feature
  
  

Con:

• The copy pasting script is sometimes flaky (maybe there's a better more reliable way to inject the code?)
  
• my app has to reside in a single file for this to work properly
  
• running code on the watch over remote IDE only works online I guess?
  
  

(I am a bit shocked that the infamous and prolific HalEmmerich does not have a more advanced setup. ;) thanks for all the small improvements and apps!)

Thanks for the compliments ;)

My first developments were either directly using hardware (GPS/BT) or depended on boot code so the emulator wasn't great for developing those which prompted me to just use the real thing. I got a spare Bangle for this so my daily driver can stay connected to GadgetBridge all the time.
I guess for most development an emulator-based workflow would be more than sufficient and probably allow for faster iterations. That is definitely something for me to explore.

The IDE has some really nice features like getting the value of variables by hovering over them in the source while using the debugger and autocompletion for most of the Bangle/Espruino-specific APIs. I don't know if that could easily be replicated otherwise.
Opening and marking the code files of an app in the IDE (usually app.js,lib.js, maybe a module) for automatic upload to the Bangle is a relatively low overhead for me. Everything is just open all the time on a dedicated virtual desktop in the background even if I don't use it. I let it upload libs/modules to storage and apps usually to RAM. That way every save in the editor directly uploads to hardware. I think that could simplify your workflow too since you would not need to rely on the copy-paste script anymore.

The copy pasting script is sometimes flaky (maybe there's a better more reliable way to inject the code?)

You can run the IDE and if you click the down-arrow next to the 'open file' button you can 'watch' a file - so when the file changes the IDE will automatically reload it and upload it.

running code on the watch over remote IDE only works online I guess?

Good question - it uses WebRTC which is peer to peer, but to establish that connection in the first place I think it needs a kind of broker server, so you have to be online for that :(

What is the correct way to use locally hosted web IDE with locally hosted modules without CORS getting in the way? Linking the folders and using jekyll to host the IDE works fine but it feels a bit convoluted. Running with NPM does not have working bluetooth on my system:

Chrome on Linux requires chrome://flags/#enable-experimental-web-platform-features to be enabled.

Can I somehow install a complete app to the emulator without installing all files by hand? Maybe running an emulator externally and sharing it between IDE and appstore?

What is the correct way to use locally hosted web IDE with locally hosted modules

I just have an Apache server and I have the ide in localhost/ide and the app loader in /apps. Web Bluetooth works fine for me - there's an exception in the rules about it needing HTTPS that allows it to work fine when running from localhost. If you access the same server with http://yourmachine.local/foo then it won't work :)

Can I somehow install a complete app to the emulator without installing all files by hand?

Not yet - in theory the app store could send all the commands it'd send to a real Bangle over to the emulator, but I haven't done that yet. In a way it'd be an interesting way to even test the complete app store without a real device

Huh, with that hint I can simplify my script down to running jekyll in the parent directory of all my checked out repos and just point the IDE to http://localhost:4001/BangleApps/modules|http://localhost:4001/EspruinoDocs/modules as module sources. So no more file system linking of BangleApps and EspruinoDocs into the web IDE directory.

Web Bluetooth works fine for me when hosting with jekyll as http server as well but it does not work when starting with npm start. Not that it really matters, jekyll is just fine for my purposes.