psychoinformatics-de / shacl-vue

https://psychoinformatics-de.github.io/shacl-vue/
MIT License
0 stars 0 forks source link

Incorporate updates to VueJs and related tools since starting `datalad-catalog` #3

Closed jsheunis closed 2 days ago

jsheunis commented 3 months ago

The reactive web aspects of datalad-catalog are implemented in VueJS 2. The current version of VueJS is 3. It has some major improvements that would be beneficial for the catalog, so it would be useful to prototype those improvements here in this repo.

datalad-catalog is also implemented without a build step wrt VueJS, i.e. all javascript coding is done in .js files that are shipped as they are as the assets required for a production deploy. The intention behind this is to make it easy for users of datalad-catalog to deploy their custom catalogs. However, this misses out on several advantages of including a build step in the process, mostly: the use of VueJS single file components, improved code structuring/separation for development setup (the current setup is just a big js file with too many lines of code), local testing. So the idea for this new project is to use a build step, and use the VueJS-recommended process and tools for doing this (see vite).

The use of Vue Router will also require an update: it progressed to v4 together with VueJS progressing to v3. As part of the first demonstration of the functionality in this repo, we probably won't need routing. But useful to keep in mind.

Then, datalad-catalog makes use of the frontend component framework bootstrap-vue, but this is only supported for VueJS v2. There are several alternatives that are both widely used and supprt VueJS v3:

My suggestion for a starting development setup to work with would be:

I will likely use conda to create a local virtual enviroment with nodejs installed which also installs npm, and which can then be used to install all the packages above.

jsheunis commented 2 days ago

My suggestion for a starting development setup to work with would be:

  • vite
  • vuejs v3
  • vue router v4
  • vuetify I will likely use conda to create a local virtual enviroment with nodejs installed which also installs npm, and which can then be used to install all the packages above.

This has all been done, except for vue router 4, since it has not been necessary to incorporate until now (although it will likely become useful or necessary when the viewer components are being developed)