0.0.1 Roadmap

[neetjn]

After thoughtful consideration, I've decided to drop the [riot-view-router]() project and start from scratch. Riot.js 4 is a complete overhaul of the framework, with a fundamentally different api. My initial observations can be read here.

Roadmap - 0.0.1

• Create basic project structure.
• Provide Router component for instantiating a new core-routing instance, this component should provide a client to subscribe to routing mechanisms. Router should adjust current base path depending on the default prop if current location is not recognized.
• Provide Route component for defining a route. This component will expect two props, path and component. The path prop specifies the target route, it will support argument interpolation in the form /route/:arg1/path or in practice /user/:userId/profile.
• Provide Link component for declaratively creating an anchor.
• Create functional tests using Jest/Jest-Dom.
• Write basic documentation for code, provide project documentation in README.
• Wire up project with either Git Actions or Travis CI.
• ...

[neetjn]

See: core-routing for router interface. Once version 0.0.1 is feature completed and tested, I'll begin drafting a road map for riot-routing.

[neetjn]

Update (9/2/19):

• I've decided to go with a declarative routing style for this project:

  
  <Root>
  <script>
    import {Home} from './containers/home.riot';
    import {NotFound} from './containers/notFound.riot';
  </script>
  <Router default="/">
    <Route path="/" component={Home} />
    <Route path="*" component={ NotFound } />
  </Router>
  <Link to="/">Home</Link>

• The plugin will inject three components previewed above: Router, Route, and Link.
• Due to the nature of the core-routing project, this project only really needs to:
  • Interpolate components based on routes (can match routes using core-routing tooling).
  • Provide arguments for routes (can extract route variables using core-routing tooling).
  • Provide a linking schema for declarative anchors.

[neetjn]

Update (9/11/19):

• core-routing version 0.0.1 has been published.
• I'm going to begin development of riot-routing will begin within the next few days.

[neetjn]

Update (9/27/19):

• Created separate project for prototyping @ riot-routing-prototype.
• Experiencing issue with mounting logic.
  • Resolved: It seems the riot loaders for build processors (webpack, rollup, etc.) only compile components on import. We can get passed this by directly providing the riot component function in the router component.
• Q: Do we go with slots (will be much more difficult to deal with) and a router instance we pass down to our routes? If so, how do we listen on updates, the router only provides a single interface. Re: https://github.com/neetjn/core-routing/issues/16#issuecomment-536057916
• Q: Is a route component even necessary? We can store all the state data/logic in a single component.

[neetjn]

Update (9/28/19):

• Mounting Logic: May be easier to simply register each route component globably.
• Single Client Interface: This might actually be a cleaner approach to thwart over engineering. I've implemented a different way to handle routes (bringing back route component).

root.riot

<Root>
  <router routes={ routes } />
  <script>
    import Router from 'riot-routing/router.riot'
    import Home from './components/home.riot'
    import NotFound from './component/not-found.riot'

    const routes = [
      { component: Home, path: ['/', '/home'] },
      { component: NotFound, path: '*' }
    ]

    export default {
      routes,
      components: {
        Router
      }
    }
  </script>
</Root>

router.riot

<Router>
  <route each={ route in props.routes } if={ route.active } />
</Router>

route.riot

TBD