roadmap

[snd]

roadmap

• serverside that serves single page app
• basic gulp build script for the clientside js
• wire everything up that hinoki works perfectly on the client and adding new factories is as easy as on the server
• for routing keep a cursor containing the current url in sync with the current url across anchor clicks and push state events
• then simply implement routing by dispatching on that url-cursor and enabling/disabling "page"-components
• integrate http://getbootstrap.com/
• working login form
• send login request to api
• add some fake users
• validation for login form that reuses serverside validation rules
  • waechter on the client side
  • make validation rules available to clientside
  • run sync validation every time user inputs change
  • show validation errors next to form fields
  • only show validation errors after first click on login
  • gray out login button if validation errors after first click on login
  • show green glyphicon-ok inside valid form fields
• make login button style primary
• document react and cursor gotchas
• refactor the way the login form state is updated
• improve initial validation messages
• show error in form when login failed
  • as an alert
  • handle both json and strings
• handle successful login
  • keep currentUser and token in a cursor
• make navigation change based on login status
• store user token in cookie to persist it across refreshs
• load user on refresh if token is present
• make enter key submit form
• we're not continuing with https://github.com/caseywebdev/cursors. find the next cursors library/solution that looks promising
  • findings are documented here
• use a different cursor solution
  • remove code and libs that are no longer needed
• fix gulp ruby sass
• find way to keep bower deps up to date
• clean page cursor (on mounting)
• working user table
  • load data on componentDidMount using https://github.com/ded/reqwest
  • just list all the users for a start
  • serialize/update filter state to url query params automatically
    • exactly the siv params
    • path stores query params (its the only place its stored)
    • setQuery
    • getQuery
  • sorting (and default sort)
  • momentjs and pretty printing of dates
  • put the filtering stuff into a modal
  • pagination: page [input for page number] of {page count} [<] [>] with [input for per page] per page
    • immediate query
  • make it work/functional
  • then make it pretty
• make clientside redirects (nagivate) work
• complete two-way-binding: pushState automatically if the path cursor changes
• handle server responses with error status codes by setting an error cursor to the response which if set pops up a modal with the raw error data and is cleared when the modal is closed
  • "please refresh"
  • "we've been notified"
  • "we apologize for the situation"
• improve workflow with auto-compile and auto-refresh to speed up development
• user detail view
• parse rights string
  • preferably on server side
• user delete if currentUser has that right
• user create if currentUser has that right
  • debounced async email taken validation
• user update if currentUser has that right
• exhaustive user table filtering on the clientside which uses https://github.com/snd/siv
  • good UX ???

nice to have

• hinoki source for autogeneration of clientside data accessor functions
• use isomorphic url-patterns clientside
• look at https://github.com/ubolonton/js-csp and see if its better suited to your problems than http://highlandjs.org/
• multiple lifetimes on the client
  • extracted into issue multiple clientside lifetimes #2
• possibly reinject in react components methods when using dependencies that might not be available on the server (example: login on the clientside) in order to make react components work on the server without mocking out all the clientside stuff
• use a different cursor system if https://github.com/caseywebdev/cursors doesn't do the job
  • consider writing your own - it's easy and you'll then have full control
• find better unified name for path and use it everywhere (helpers, cursor, ...)
• find better name for page cursor
• material design
• make button for collapsed nav work
• production gulp tasks
  • minify / uglify
  • dont expose dev js on production
• make the state/tree/cursor a dependency so you can define functions that work directly on it
  • navigate
  • setError
• navigate function as a more convenient way to update the path cursor
  • don't know about this. its pretty explicit to update the path cursor directly and can often be bundled with other updates. each action that has to update state should preferably and with a single update anyway.
• would be best to pushState if and only if path cursor changes and to change path cursor when relative anchor is clicked or manually in code
  • changing path cursor = navigating
• add active class to active links
• only route certain routes when user is logged in
• catch invalid paths clientside and show 404
• always redirect to login when user is not logged in
• fetch as much as possible using npm and not bower
• https://github.com/rstacruz/nprogress

nice to have changes to external libraries

• port https://github.com/snd/fragments-user urls to https://github.com/snd/url-pattern and use .stringify
• support things like GET pattern, stringThatIsNameOfRequestHandlerDependency in https://github.com/snd/fragments