squint

kauppilainen 2024-09-14T11:44:01.075949Z

Hey, I'm giving a https://2024.heartofclojure.eu/talks/squint-a-taste-of-clojure-for-javascript-devs/ at Heart of Clojure and a stretch goal I've been thinking about to drive home the experience of REPL driven development is to have the generated JavaScript send live values of function argument inputs as bindings when the function is invoked, similar to https://github.com/AbhinavOmprakash/snitch defn*, to a running REPL. I'm thinking given the following clojure

(defn foo [input]
  input)

(foo "hello")
would generate JS that sends an HTTP request to the REPL process with an eval op binding input to "hello". Any ideas on how doable this is or alternative ways forward?

pez 2024-09-17T10:54:24.188589Z

Kick ass in Belgium, Felix! We will be missing you at the Clojure Lunch in Stockholm tomorrow, but the deed you will be doing is a worthwhile deed, so thereโ€™s that.

๐Ÿค˜ 1
kauppilainen 2024-09-17T12:11:44.382469Z

Thank you, Peter! Send my hello's to the peeps ๐Ÿ™‚

1
borkdude 2024-09-17T12:13:46.846159Z

@felix.kauppi.alm you're also living in Stockholm?

pez 2024-09-17T12:17:25.044979Z

I saw Oslo flash by in a comment that was then deleted. ๐Ÿ˜ƒ Since Iโ€™ve already brought up the Stockholm Clojure Lunches hereโ€ฆ I went to Oslo this spring to try to figure out their success with Clojure lunches and meetups. So thatโ€™s why we met there, @borkdude. And so far weโ€™ve been able to clone the success pretty well. Even if I may not be the best judge there.

borkdude 2024-09-17T12:17:43.270649Z

niiiiice!

1
kauppilainen 2024-09-17T12:18:24.799799Z

Yes I'm also in Stockholm. Met Peter at the Clojure Lunch meetup he resurrected just a couple of months ago

2
borkdude 2024-09-14T11:45:39.140439Z

Hey @felix.kauppi.alm, first of all: really cool that you're giving a talk on squint, I'm planning to visit it at HoC for sure!

borkdude 2024-09-14T11:46:28.443119Z

Now let's see if I can understand your question...

kauppilainen 2024-09-14T11:48:07.987539Z

Cool! I'm looking forward to saying hi in person ๐Ÿ™‚

borkdude 2024-09-14T11:49:51.013419Z

so do you mean that you would generate something like:

(def input "hello")
such that you could evaluate input?

kauppilainen 2024-09-14T11:50:42.238939Z

Exactly

borkdude 2024-09-14T11:52:45.449419Z

First I'd try if this works at all in squint:

(defn foo [x]
  (def x x)
  x)
I'm not even sure that this will work, since "vars" are emitted as "var" and I don't think it will hoist it to the top level currently

borkdude 2024-09-14T11:53:36.718049Z

Something like this would work:

(def x)
(defn foo [x]
  (set! x x)
   x))
probably

borkdude 2024-09-14T11:55:23.601679Z

hmm, that won't work either. it just modifies the function's argument ;-) https://squint-cljs.github.io/squint/?src=KGRlZiB4KQooZGVmbiBmb28gW3hdCiAgKHNldCEgeCB4KQogIHgpCgooZm9vIDEpCng%3D

borkdude 2024-09-14T11:56:02.398209Z

ah this does work, only in the REPL-output:

kauppilainen 2024-09-14T12:00:02.182979Z

Hmm yes that works when all is run in the REPL. But the generated JS isn't sending anything to the repl process on run

borkdude 2024-09-14T12:01:00.962979Z

with "the repl" do you mean nREPL? and not sure what you mean with "isn't sending" ?

kauppilainen 2024-09-14T12:01:49.531269Z

I'm creating an example that I hope will make it clearer. Two secs

kauppilainen 2024-09-14T12:03:48.687859Z

or rather making a GH repo public so you can gauge the setup

borkdude 2024-09-14T12:03:55.023319Z

ah yes even better, thanks

borkdude 2024-09-14T12:04:13.153779Z

will take a look later today-ish

kauppilainen 2024-09-14T12:04:33.276189Z

No stress, I appreciate it ๐Ÿ™Œ

kauppilainen 2024-09-14T12:31:35.261309Z

https://github.com/kauppilainen/react-cljs/ exposes a vite plugin that runs Squint on all .cljs files in your project. Working test project https://github.com/kauppilainen/react-cljs-test.

๐Ÿค˜ 1
borkdude 2024-09-14T12:52:57.289299Z

in the above example, how do I start it?

borkdude 2024-09-14T12:53:23.154429Z

npm run cljs-repl?

kauppilainen 2024-09-14T12:53:27.400509Z

Correct

borkdude 2024-09-14T12:53:53.045949Z

and in parallel I also run watch?

kauppilainen 2024-09-14T12:54:10.389109Z

npm run dev and npm run cljs-repl are the only ones you need running in parallel

borkdude 2024-09-14T12:55:01.840579Z

$ npm run dev
npm ERR! Missing script: "dev"

kauppilainen 2024-09-14T12:55:53.989689Z

Is this in https://github.com/kauppilainen/react-cljs-test?

borkdude 2024-09-14T12:56:17.609099Z

no I thought you linked to react-cljs

kauppilainen 2024-09-14T12:56:49.674499Z

Sorry, that's just to the npm package. The example React project using the that npm packages is react-cljs-test

borkdude 2024-09-14T13:00:19.226269Z

ok, I have the REPL working

borkdude 2024-09-14T13:00:25.868079Z

now what do I do?

kauppilainen 2024-09-14T13:01:15.308369Z

Check out counter.cljs. There's an example in the comment block of how I'm thinking about how the communication could be done

borkdude 2024-09-14T13:02:05.032369Z

nREPL isn't http you know

borkdude 2024-09-14T13:02:19.999329Z

not sure what the example is supposed to mean

borkdude 2024-09-14T13:02:39.670749Z

if you want to eval (def n 1) that can be done by ... doing that in nREPL? :)

borkdude 2024-09-14T13:03:07.407629Z

borkdude 2024-09-14T13:03:49.221589Z

I think I might be misunderstanding you

borkdude 2024-09-14T13:04:50.366279Z

This also works for me:

kauppilainen 2024-09-14T13:04:53.550779Z

That all works as expected ๐Ÿ‘ Now in customInc, I'm imagining that when the Squint generated JS is run in the React project by clicking the count button, the n input should be sent to the REPL

kauppilainen 2024-09-14T13:05:28.337429Z

A lot like https://github.com/AbhinavOmprakash/snitch defn* macro

borkdude 2024-09-14T13:05:28.573039Z

I see

borkdude 2024-09-14T13:05:54.283229Z

one of the problems is that the nREPL only runs in Node.js right, so it's not connected in any way to the web browser

kauppilainen 2024-09-14T13:06:03.015899Z

Correct

borkdude 2024-09-14T13:06:49.719399Z

which is something that could be solved (I have it working for #scittle) but takes time

borkdude 2024-09-14T13:08:09.835259Z

what I did there is implement an nREPL server which runs in an external process, listens for messages and forwards those to the browser via a websocket

borkdude 2024-09-14T13:08:26.305769Z

since a browser can only connect via http or websockets

borkdude 2024-09-14T13:09:28.332599Z

so it's very similar to your idea

kauppilainen 2024-09-14T13:11:16.479259Z

I see. Cool that you've done something similar for scittle!

kauppilainen 2024-09-14T13:12:51.182659Z

I probably won't have time to get that working in time for the talk but I'll be sure to give it a mention. For me that's where the REPL workflow really starts to shine in comparison to the Javascript equivalent save file->see changes loop

borkdude 2024-09-14T13:13:13.176539Z

yeah

borkdude 2024-09-14T13:14:12.660289Z

I probably won't get to this before the talk either but I'm pretty sure it will exist at some point :)

kauppilainen 2024-09-14T13:14:24.713519Z

Thanks for taking the time to give this a look! I'll read the scittle solution for this at some point. Interesting stuff ๐Ÿ˜ƒ

borkdude 2024-09-14T13:14:25.889579Z

the Proof of Concept is scittle, let's say

โญ 1
borkdude 2024-09-14T13:14:55.099459Z

here's the docs: https://github.com/babashka/scittle/tree/main/doc/nrepl

borkdude 2024-09-14T13:15:26.704469Z

Clerk viewer functions are also built using SCI and you can now even develop those using an nREPL server which uses the same approach

borkdude 2024-09-14T13:16:02.375259Z

Good luck with your talk! If you have any questions, etc. let me know

kauppilainen 2024-09-14T13:16:26.299119Z

Thank you! I will ๐Ÿ™‚

Chris McCormick 2024-09-15T16:30:24.407949Z

@felix.kauppi.alm I'm going to be touching briefly on Squint in my workshop and I will point people to your talk, which is later in the day, for more depth and details.

kauppilainen 2024-09-15T17:06:47.449119Z

@chris358 Cool! Please do ๐Ÿ™‚ Looking forward to seeing you at the conference.

Chris McCormick 2024-09-15T18:09:03.116079Z

Likewise!