From mn/ifi/inf5750
Revision as of 16:10, 6 November 2017 by (talk | contribs) (updated timeline)

Jump to: navigation, search

Group members

  • Vebjørn Kvisli (
  • Halvard Hella Kværna (
  • Andreas Hauge Standal (


We have chosen the assignment Master Facility List.

The final product will be a React-based DHIS2 app for browsing facilities. The main feature of the app will be a list of all facilities including the option to filter and search to get specific results in the list. There will also be a map feature where the user can see where the facilities are. The map will have the ability to show one, all or a subset of facilities.

Timeline for Development

Week 42

  • Created our first React app.
  • Created an organization and repository on GitHub.
  • Fetched our first data from the api using fetch().
  • Created a simple layout for the Master Facility List (MFL) with a navigation bar, search option boxes and a result page.
  • Added some styling with css and React Bootstrap.

Week 43

  • Improved navigation bar style
  • Improved overall layout style
  • Added support for string matching of user-input for organizatons to get relevant organizations.
  • Added toggle button for advanced search user inputs.
  • Added routing of navigation bar buttons.

Week 44

  • Linked search boxes to their respective functions to fetch and print the correct data.

Plans for week 45

  • Integrate google maps or a similar map function to display the organizations using their coordinates.
  • Evaluate the best method for filtering data, either during fetch()-call, or afterwards using JS (a mix might be required for more advanced searches).
  • Figure out the best way to do paging when there are many results.

Plans for week 46

  • Add functionality for feedback and user suggestions.
  • Continue development of dynamically updating search fields.
  • Continue adding functionality and link everything together.

Plans for week 47

  • Clean up and release


The application is primarily based on the React framework. The different visual elements in the app is created as React components, with the help of HTML and CSS.

Additional libraries we use:

  • React Bootstrap
  • Google Maps API

Git repository