So there are two things you need - 1) a route file (uses bidi routing) and 2) reagent views that are connected to each route. Let me see if I can put a quick example together.

(def my-routes ["/" {"index.html" :index
                           "article.html" :article}])

like this?

I can understand the reagent views I think, I just didn't know what it was really asking for with {:routes router/routes} as in, what I need to set up

yeah that bidi’s routing so something like (def routes ["/" :home]) would point to the home component

okay! Learning

(for now my entire front end is in one file just so I can refactor it in my own time)

and then you would mount a router component that would look something like…

(defmulti containers identity)

(defmethod home 
  :home [] [home-container])

(defn router []
  (let [route (re-frame/subscribe [:router/route])]
    (fn []
      [containers @route])))

This would be your router component that renders your view. So when a user visits / it would render :home

You would also want to subscribe to path params and pass that to all of those to your view as well. So if you have something like /user/:user-uuid/profile your view will have access to user-uuid without having to subscribe to that data directly.

sorry I'm just processing the information I have right now 🙂

so do I pass the router into reagent/render? Or am I misunderstanding?

I’ll put a quick gist together with a full example. Then I’ll update the readme 🙂

sorry for making you go through this!!

no worries

It might be an idea, to set it up with regards to re-frames simple example (that's what I'm running) https://github.com/Day8/re-frame/blob/master/examples/simple/src/simple/core.cljs

So that people know how to go from a simple one -page (as I imagine people first app will just be one page, like mine) to a multi page one with routing if that's what they're using your library for

I don't want to start making seperate files other than my core.cljs until I understand every step on it's own so I can learn to group things for myself you know? 🙂

@ashley Something like this https://gist.github.com/oconn/7f6ea67d92e0b6aaedf719c54c2cacb8

I did not test this so let me know if you run into any issues

giving it whirl

So is router just like any other component?

okay that makes a lot of sense 🙂

typo on path-parms line 31 🙂

Hmm, weirdly, I get the page not found even though I don't have any extra paths in my URL bar?

https://gist.github.com/Ashe/6c94a677371fe0a87b8d4feddce24901 I include the router you made on line 204, other than that your stuff is at the top

While I don't understand why it's not finding the home route, what's a little more pressing is that because I only have index.html navigating somewhere else in the URL takes me to the figwheel page

So yeah - router is just a component

Yeah so the router seems to be working if page not found is showing…

oh

so get rid of the leading slashes on the other two routes

(def routes ["/" {"" :home
                 "home" :home
                 "sign-in" :sign-in}])

okay! I did that

@ashley

I think it's something fundamentally wrong though, and not your program. All of this only exists in index.html, right? So changing the URL changes the page and cannot load any JS, right?

Oh and for the other problem you need to set up a push-state server

so / will render index /anything-else needs to hit a server and server up your index.html file

figwheel supports this out the box I believe

https://github.com/bhauman/figwheel-main/blob/master/docs/config-options.md#ring-handler

well Im using ring so this shouldn't be too hard

oh hang on ring is my backend though

yeah so when the user requests any route you server up /index.html

this is a basic dev one I use

(ns clj.server
  (:require [ring.adapter.jetty :refer [run-jetty]]
            [ring.util.response :refer [not-found file-response]]
            [ring.middleware.content-type :refer [content-type-response]]
            [ring.middleware.file :refer [file-request]]
            [ring.middleware.not-modified :refer [not-modified-response]]))

(defonce resource-dir "resources/public")

(defn handler [req]
  (let [is-file (some-> req
                        :uri
                        (clojure.string/split #"/")
                        last
                        (clojure.string/includes? "."))]
    (if is-file
      (if-let [res (file-request req resource-dir)]
        (-> res
            (not-modified-response req)
            (content-type-response req))
        (not-found "Not Found"))
      (assoc-in (file-response resource-dir)
                [:headers "Content-Type"]
                "text/html;charset=utf8"))))

I think I've realised a massive flaw in what I'm doing then So. I have my CLJ code compiled into a jar file, that is spun up by docker. My CLJS code is compiled into a .js file, which combined with my index.html file creates the front end. Ring is on the back end and has routes, for AJAX calls. My front end doesn't use ring or anything, but it does use Jetty in the sense that figwheel shares it as a dependency.. so I need so somehow edit the server that figwheel gives me? Or maybe this is a flaw, and that my backend and front end should be the same program (in the sense that the server serves a webpage with the compiled CLJS?) Gosh there's a lot to learn when it comes to web development

my back end can handle any requests I throw at it like you suggest. Typing in different URLs to the server allows me to call functions (so I have localhost:8080/count-up/10 returns a list of 1-10)

https://figwheel.org/config-options.html#ring-server-options

this will do it right?

yeah so for figwheel development of SPA apps I use that server I pasted above with

^{:open-file-command "emacs",
  :ring-handler clj.server/handler,
  :ring-server-options {:port 4001},
  :watch-dirs ["src"]}
{:main app.core
 ;; other clojurescript settings  
}

Okay! So with those settings, figwheel boots up my server without me needing to run docker, thats nice 🙂

Nice!

Im still not quite so sure if this will help me though, as it's my backend that is now responding to the URL address and not my front end

maybe the solution is to have a front-end server too

thats got to be actually I think

im sorry for sending lots of messages haha thinking to myself

You could put the backend routes all under /api/ for example, and then server the same frontend cljs for any frontend routes, and let the frontend router handle the url

im currently in IRC just asking about best practice setc

etc

In my mind, I need two servers, one for front and one for back, as serving web pages might strain the backend? But at the same time, it would also be really easy to just make the backend serve a webpage with the correct javascript on?

I think you should be able to get a long way with one server - definitely to start off with

okay im going to split them

the webdev irc said it'd be good and good to learn

I don't think it'll be hard either 🙂

Well, my front end now has its own little server, but router is still saying Page not found despite there now being things in the URL hmm