[Epic] MVP of the Frontend v3 app: home, showcase, org and search pages

[lauragift21]

We want to build an MVP of a data portal frontend using Next.js. Data can be mocked or come from demo.ckan.org.

MVP URL: https://portal.datopian1.now.sh/

Acceptance

This would be the core of an MVP

• showcase
  • dataset - can model layout on top part of datahub.io showcase pages
  • resource page - a dedicated resource page
• org profile page with list of datasets
• search page for searching datasets (this could be dynamic/pure client side JS or could be server side)
• home page (semi-optional for now in fact)

Dataset and Resource page

• A page with a list of datasets - with key information(title, description, etc)
• All listed dataset leads to a new page with additional details on them.
• Resource page: details on a resource Resource page with Data Explorer or preview #12
  • download
  • preview a dataset Issue with existing React app for data explorer. needs some work. See Resource page with Data Explorer or preview #12 for details
• Search functionality - search for specific dataset using queries/keywords.

Tasks

• Boot a repo (or continue in branch of frontend-v2) https://github.com/datopian/portal
• Stub a skeleton of the site (use next.js) https://portal.lauragift21.now.sh/
  • README
• Set up CI - use mocha i think
• Set up CD
• Show case page
• write test to cover functionalities

Showcase page(s)

• Stub a page /@myorg/mydataset that is empty
• Copy over and convert nunjucks template from current frontend-v2 into jsx template (omitted all the preview stuff and resource display)
  • Copy the preview material into a /@myorg/mydataset/r/myresource template
• Refactor the JSX into templates so we move away from "inheritance" towards "composition" in how we build pages
  • Simplest to start would be to move everything into a component "DatasetShowcaseCore"
• Stub out the frontpage from frontend v2
• Replace hard coded page data with hardcoded data in the "controller"
• Replace hard coded data with real data from a live source ...

Organization page(s)

• page with a list of all organizations
• page with a list of related datasets under an org.

How do we have /@myorg/mydataset => lookup data via fetch API from the right place?

We want /@myorg to be dynamic. Creating a dynamic route might work and setting up fetch API to pull data from the dynamic source (more research to be done here)

[anuveyatsu]

Closing this as FIXED. Next items will be tracked in:

• v0.1 - [epic] MVP of Full Portal/Catalog app: site components, bootstrap app etc (June 2020) #16
• v0.2 - [epic] v0.2: create-portal-app command and steps #33
• v0.3 - [epic] v0.3 of new frontend portal app #34

[rufuspollock]

@anuveyatsu can we make sure all the unchecked items in this issue are definitely captured iin one of the follow up issues (and could you note that in your fixed comment, when done).