Skip to content

JavaScript framework selection

Lars Holm Nielsen edited this page Feb 6, 2018 · 3 revisions

JavaScript framework selection

In order to simplify and speed up the selection process of a JavaScript framework, I invite all interested developers to a full day hackathon (09:00 to 17:30).

The idea of the hackathon is to split the developers into a couple of groups. Each group will build the same prototype application but use different JS frameworks.

Afterwards, each group will present them at the next coming Invenio Developer Forum.

Sign-up

Please sign up (and mark your preferred date) using the Doodle below:

Please reply by Thursday, Feb 8th evening.

Groups

I suggest we try to make groups of around 2-3 people. Groups should possibly include one person already experienced in the framework, and one person who’ve never tried the framework before.

Also, I encourage everyone who has a favourite framework, to give another framework a try.

Proposed frameworks to test:

  • Angular

  • React

  • VueJS

  • WebComponents

  • <your favourite framework>

Prototype application: Search app

The application that should be built in a day is essentially the same as Invenio-Search-JS, i.e. JS application that queries the Invenio REST API.

The applications can be built against any of the Invenio v3 REST APIs:

The existing Invenio-Search-JS application serves as a model of what you need to build.

1. UI Components (must)

The application should demonstrate the following UI components:

  • Search field

  • Result list (a list of records)

  • Result item (a single record)

  • Pagination

  • Sort

  • Facets

  • Result count

  • Error (in case of search errors)

  • Loading (displayed when the user executes a query and until the server returns the response) - e.g. loading bar or spinner or similar.

The components should as much as possible be UI-only components (i.e. possible reusable for different JS applications)

2. State management (must)

The application should demonstrate clear application state management using Redux- or RxJS-like patterns.

The application should support deep links. I.e. at any point in time a user should be able to copy/paste the URL to get the same application state. I.e.

  • URL should reflect the application state.

  • Application state should be able to be initialized from the URL.

4. Customizable record templates (must)

It must be possible to provide the application with a custom template that it uses to render the record with (i.e. the result item). The idea is that each site will have different requirements for how a record should be displayed.

5. I18N (optional)

If time allows the application should demonstrate how it can be translated.

6. Single/Multi Page app (optional)

The application should be usable in both a single page and multi-page app.

Presentation

In addition to giving a brief walk-through of the application and above requirements, the groups should also cover experience from the beginner group member on how easy it was to learn about the framework.