Document Isomorphic/Universal usage

[margaretjoanmiller]

I'm still new to Cycle.js so I apologize for my noobiness but how would one go about rendering a Cycle app with cyclic-router by using the req.url (in an express app, for instance)? I can't figure out where to pass the req.url string into the makeRouterDriver function in order to make Cycle render the correct page of my app. Thanks!

[TylorS]

Hi @gigavinyl, definitely not you, it's just not documented yet. Before I get to that I'll give you a quick idea of

import { makeRouterDriver } from 'cyclic-router'
import switchPath from 'switch-path'
import { createServerHistory } from '@cycle/history'

http.createServer((req, res) => { 
  // call run like usual
  const dispose = Cycle.run(main, {
    DOM: makeHTMLDriver(html => {
      res.end(html) // send out your rendered HTML
      dispose() // clean up resources to prevent memory leaks
    })
    router: makeRouterDriver(createServerHistory(req.url), switchPath)
  })
})

[wyqydsyq]

This no longer works with the latest @cycle/history (5.0.0) because that uses the latest history (4.5.x) library underneath which has a different API compared to 3.x.x that cyclic-router is designed against.

I think cyclic-router needs to be changed to either take a Cycle history driver (so we can just pass it a makeHistoryDriver() or makeServerHistoryDriver() from @cycle/history, I imagine this would also remove history as a peer dependency?) or be updated to accept history objects from the latest version of history.