How to implements routing-like SPA? about karax HOT 15 CLOSED

@itsumura-h i updated the links in my original comment to the corresponding files in those 2 projects.

You'll be switching between the hash part of the url on each redraw of the virtual dom. All your variables should be kept in a global scope and you should mutate accordingly. This is not the most documented framework for reactive apps but it can be a good match for writing apps in only one language (nim).

from karax.

Here is how I've done it in the Nim forum: https://github.com/nim-lang/nimforum/blob/master/src/frontend/forum.nim#L80

from karax.

Again, let me know if you approve and I can create a formal PR, I'm treating this more as an "RFC" issue.

Alright, approved.

from karax.

The only thing that Jester is being used for is for parsing a route and extracting information in the route.

then maybe that API can be added to stdlib to avoid karax depending on jester?
(and jester can reuse too with when (NimVersion, ...) >= 1.5.1): useStdlib else: redefine, but that's optional)

from karax.

The point is not to avoid "bloat" or to introduce "code duplication". The point is that I like to iterate over the routing DSL design without concern about how e.g. Jester does it.

from karax.

Check example: https://github.com/pragmagic/karax/blob/master/examples/todoapp/todoapp.nim#L120

If you need variables in the routing you'll need to implement something like this:
https://github.com/dom96/jester/blob/master/jester/patterns.nim#L15

from karax.

Check example: https://github.com/pragmagic/karax/blob/master/examples/todoapp/todoapp.nim#L144

If you need variables in the routing you'll need to implement something like this:
https://github.com/dom96/jester/blob/master/jester/private/patterns.nim

I can't understand how to do...
Can anybody show me how to use variables in the routing more specific?

from karax.

I recently brought this up on the Nim Discord, but should (better) routing be included as a part of Karax, similar to Kajax? By better, I mean something very similar to the way Nim forum does it, but with a bit more syntactic sugar like Jester. In https://forum.nim-lang.org/t/4991#31305 @dom96 brought up moving the forum routing code to karax.

My suggestion would be something like this/Jester:

route "/@id":
    renderThreadList(getLoggedInUser(), some(@"id".parseInt))

Along with a function that could be used to directly change the view, such as router.visit("/5") or something similar.

from karax.

I'm pretty much out of frontend development, sorry, I don't have an opinion. But you can create a PR and I'll have a look.

from karax.

I tried doing something like what I said here:
https://github.com/ajusa/kautil/blob/master/karoute.nim#L36

Only possible issue is that it relies on jester for the route parsing. If you think that is okay, I can polish it up and create a PR for karoute.

from karax.

Meh... Parsing is a finger excercise... The stdlib has strscans for it.

from karax.

While I mostly agree with you, I also don't want to basically copy paste/rewrite the routing handling that Jester already does. Code duplication is almost never a good sign.

Plus this only imports one module within Jester, so it wouldn't be compiling all of Jester anyway. It shouldn't add bloat to Karax (well no more than the Nim Forums, since it also uses the jester/patterns implementation).

from karax.

Routing logic should be in a separate package IMO. Pretty sure even React does it this way. But yes, depending on Jester here is the right way to do it: it means that you can easily reuse the router for both.

The dream is to have something eventually that automagically connects Karax and Jester by just one route spec

from karax.

Well, the routing DSL can be pretty easily changed without worrying about Jester. The only thing that Jester is being used for is for parsing a route and extracting information in the route. It really is just a glorified string matching function 😄
/asdf/@id? -> seeing if a URL matches and extracting the variable "id" is all Jester uses. The rest of the code was written by me, for handling creation of routes, the DSL, and making sure that it works for websites by using the #.

I honestly can't really think of any more complicated patterns that we'd want to allow for the parsing. If do need to do that at some point, then we could fork that bit of code from Jester but I'm not sure of any examples where that might be needed. Hope that clears stuff up! Again, let me know if you approve and I can create a formal PR, I'm treating this more as an "RFC" issue.

from karax.

There are several good options for routing at the moment, from those mentioned above to the recently published nimble packages kroutes and kraut.

I'm going to close this for now. At some point we should consider adding these routing options to the documentation.

Please feel free to re-open and comment if you want to discuss further!

from karax.