[
https://issues.apache.org/jira/browse/JENA-1911?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=17126285#comment-17126285
]
Bruno P. Kinoshita commented on JENA-1911:
------------------------------------------
I took one week off before returning to office after our national lock-down.
And had a bit of spare time, so decided to have a go at it a couple days ago:
[https://github.com/apache/jena/compare/master...kinow:add-vue]
It has a new Maven module "jena-fuseki-ui" under "jena-fuseki2", that uses a
Maven plugin that downloads Node, and Yarn, and links Maven targets with Yarn
tasks. So it's possible to run `mvn clean install` and get it to clean the
project, install JS dependencies, build and run tests with
Yarn/mocha/cypress/etc.
At the moment I haven't replaced Fuseki UI in my branch. Instead it's a
separate project, with a development proxy server that sends my JS requests to
the Fuseki endpoint at localhost:3030. This way I can quickly prototype looking
at both UI's side-by-side.
I think it has near 40% done. Needing now the upload, manage, and the main
screen for the Query.
It has small changes in some views. For example, this is the old view for
dataset information.
!image-2020-06-05-12-09-57-685.png|width=503,height=366!
And this is the equivalent I created with Vue.
!image-2020-06-05-12-11-01-945.png|width=503,height=225!
The idea was to use more of the available space in the user browser. The page
is not using tabs, but a pseudo-tab layout. It looks like a tabbed navigation,
but when you click on "query", "add data", or "info" it takes you to a new
"view". This allows users to bookmark the info, query, or upload URL for a
dataset.
The button to count triples does not count the triples until the user confirms
that s/he really wants to submit it. So users don't trigger it accidentally.
The table with statistics was transposed, so it can now be rendered in mobile
too.
!image-2020-06-05-12-13-40-428.png|width=255,height=427!
I changed the landing page of Fuseki too, making the dataset listing the
default.
!image-2020-06-05-12-15-19-199.png|width=503,height=275!
At the moment it is displaying only 5 datasets, but that's only so I could see
it paginating the datasets. The current UI doesn't paginate, so if you have a
long list of datasets it may get a bit complicated to visualize.
Furthermore, I've added a component to filter by name too. The buttons under
the Actions column match the tabs in the dataset tabbed-navigation.
> Update Fuseki 2 UI JS code
> --------------------------
>
> Key: JENA-1911
> URL: https://issues.apache.org/jira/browse/JENA-1911
> Project: Apache Jena
> Issue Type: Improvement
> Components: Fuseki
> Affects Versions: Jena 3.15.0
> Reporter: Bruno P. Kinoshita
> Assignee: Bruno P. Kinoshita
> Priority: Minor
> Attachments: image-2020-06-05-12-09-57-685.png,
> image-2020-06-05-12-11-01-945.png, image-2020-06-05-12-13-40-428.png,
> image-2020-06-05-12-15-19-199.png
>
>
> The existing Jena Fuseki user interface uses Backbone.js, with extra
> libraries such as JQuery, Marionette.js. The JavaScript code pre-dates ES6,
> which is largely supported now.
> This issue is a placeholder for discussion & work around updating the UI.
> Using ES6 in the code would be a great improvement.
> But I also suggesting adopting a different framework. The most famous
> framework for JS UI is probably React, followed by Angular & Vue. I am using
> Vue.js at $work, so I am biased.
> The reason we chose Vue.js at work is that the development team is using
> mainly Python, with background in Perl, C, and Shell. So out of the three,
> Vue.js was the simplest, as it didn't require TypeScript, special syntax, and
> the tools required to build an app with Vue are also quite simple.
> One downside of this approach is the build of Apache Jena, which would
> require Node.js and a build tool like Yarn or NPM. But it also brings
> benefits such as:
> * We can write unit tests for the UI
> * We can write integration (e2e, end to end) tests with Cypress or
> Nightwatch (similar to Selenium, but simpler to run and maintain)
> * It will be easier to keep the code up to date, as tools like GitHub
> security bot are able to inspect package.json and look for outdated or
> libraries with CVE's
> * It will be easier to incorporate other libraries in the code, so that we
> can easily switch the JS code for the editor (for example), or add a new
> library to handle SPARQL, etc
> * It is now easier to find developers that know Vue, React, Angular, than
> Backbone (though that was the first framework I learned, and I really like
> it), so maybe we would get more contributors to help with Fuseki UI
--
This message was sent by Atlassian Jira
(v8.3.4#803005)