Fork me on GitHub
#clojurescript
<
2021-10-29
>
hoppy02:10:35

community challenge - aka, my pet problem de'jure. cljs in nodejs. let's say I have file of edn, multiple megabytes. lots of forms, file bigger than memory will hold (aka no slurp or .readFile). Obviously want to leverage cljs.tools.reader.edn/read, which means I need a rdr-types/PushBackReader that chunks in the input file in manageable chunks, and let's cljs.tools.reader.edn/read pull from it to parse a form at a time. So far, this has stumped me outright. I can't seem to get my head around how to do this sort of control inversion, and my efforts of trying to use node Streams hasn't panned out. I'm guessing my js-foo is lacking somehow.... suggestions welcome.

phronmophobic02:10:01

Often, you can cheat with these sorts of things: 1. search on github or https://grep.app/search?q=IPushbackReader&amp;filter[lang][0]=Clojure 2. try and find someone who already did the work or something similar, https://github.com/replete-repl/replete-shared/blob/master/src/replete/core.cljs#L57

phronmophobic02:10:54

It's not totally clear this implementation will do everything you want, but seems like a good start

hoppy02:10:02

@smith.adriane - I get how to implement the IPushBackReader, but what I don't understand is how to work it to be async on the production side, and sync on the consumption side. But I'll read what you pointed to - so thanks.

phronmophobic02:10:45

is there a requirement that it be asynchronous? there are synchronous nodejs file apis

hoppy02:10:03

only to read the whole file, unless I missed something. playing with promises maybe?

hoppy02:10:05

yes, that would work, that escaped my gander it seems....

phronmophobic02:10:21

learning some of the base OS APIs like https://man7.org/linux/man-pages/man2/read.2.html can be useful. You'll find that every runtime offers a flavor of the same API (java, python, ruby, node, c, go, etc.)

hoppy02:10:24

quite versed in posix, just didn't manage to find that in node - I'm not a cool kid anymore 😜

😄 1
hoppy02:10:43

that will sort me out. appreciate it

Ngoc Khuat08:10:36

Hi guys, is there a way I can read env variable without using any external libs? I’m using shadow-js and following this https://shadow-cljs.github.io/docs/UsersGuide.html#shadow-env. But I’m still not figured out how to read it inside cljs.

p-himik08:10:13

If you run your CLJS on NodeJS, you can use some NodeJS library. If you run it in a browser, you simply can't.

Ngoc Khuat09:10:36

I’m using browser unfortunately, so what are the alternatives for this?

p-himik09:10:10

• Use the variables available at compile time and embed the values in the resulting JS code • Use the variables available at run time on the server and serve them in some way to the frontend

Ngoc Khuat09:10:14

> Use the variables available at run time on the server and serve them in some way to the frontend Can you elaborate pls?

p-himik09:10:01

You have two kinds of processes running when having a web app - server processes and client processes (browsers). Typically, then run in different environments, on different machines, with different environment variables. So the server can grab those variables from its own environment and serve them to the requesting client. E.g. embed the values in the HTML with a <meta> tag or put them in a response to some AJAX request or something else.

p-himik09:10:24

But you cannot have a browser have a value of an environment value that comes from the same machine where the browser is running.

Ngoc Khuat09:10:37

ok I see what you mean here. I’m trying to use env variable to point it to my back-end server so I think I’ll need to go with the first option. What would be the best format to do this? config.edn? And how could I inject it into shadow build process?

p-himik09:10:31

Not sure I follow. If a client contacts your server, doesn't it already know where your backend server is?

Ngoc Khuat09:10:24

I’m trying to use env to specify API_URL for my front-end. I often use env variables for this in javascript, and I believe this is a good practice. So I’m trying to do the same thing here cljsj

p-himik09:10:39

No clue what you did in JS, but it certainly would work in the same exact way in CLJS simply because it ends up in executing JS just the same.

Ngoc Khuat10:10:08

in JS I could use process to get env, but now when I come to think of it there is probably a nodejs program running and read the env then inject to my JS at compile time.

1
Ngoc Khuat10:10:02

I just found a way to achieve what I want. If we use shadow-js, it can read the env var at compile time. But it needs extra steps which is specified in this link: https://cljs.github.io/api/compiler-options/closure-defines

👍 1
Galaux12:10:19

Hi everyone, Has anyone managed to use Storybook templates in ClojureScript? I already use Storybook with my project (mostly adapted from https://shaolang.github.io/posts/2021-02-14-storybook.js-with-shadow-cljs/) but cannot use https://storybook.js.org/docs/react/writing-stories/args though many attempts to use https://gist.github.com/ghostandthemachine/347d1a1c679615a93930e4fdb48d907e.

nyantocat 1
thheller16:10:30

it is kinda hard to follow your gist since you already abstracted way too much

thheller16:10:01

why not just translate the absolute minimum you need via regular interop and once that is working abstract it away with some helper functions or so

Galaux16:10:04

@U05224H0W Sorry, this Gist is not mine. I'm just trying to get inspiration from it 🙂

Galaux16:10:03

I'm trying to just translate the absolute minimum I need though that seems above my competences thus why I was asking whether someone else had gone through the task.

thheller17:10:31

(defn template [args]
  [YourComponent (js->clj args)])

(def ^:export LoggedIn
  (doto (.bind template #js {})
    (set! -args #js {:primary true
                     :label "Foo"})))

👍 1
thheller17:10:01

sort of I guess. dunno what the template bind is supposed to do though

thheller17:10:13

I don't use storybook so I don't know much about it but this would be the translation of something like

const Primary = ButtonStory.bind({});
Primary.args = {
  primary: true,
  label: 'Button',
}

Galaux09:10:18

Thanks @U05224H0W @U07GPFFAS I was definitely doing something more complex than it should be!

David Vujic10:10:41

There's also a link in the blog post to my example repo using Storybook that might give you some ideas. Here's some more info too: https://davidvujic.blogspot.com/2021/08/component-driven-clojurescript-with-storybook.html

Galaux11:10:44

Very nice @U018VMC8T0W thanks.

danbunea20:11:57

Great, thanks! 🙂

David Vujic17:11:08

I’m not sure if this is proper templating - but here’s an example I just pushed to my example repo 😄 https://github.com/DavidVujic/clojurescript-amplified/blob/main/src/stories/app/stories/top_bar_stories.cljs

roelof18:10:35

no body whoi wants to help me with why things not get updated

thheller18:10:02

we have given you advice on how to debug this yourself. you need to learn to use those things and how to deconstruct problems into smaller ones. we cannot give you solutions for everything.

thheller18:10:02

the way I would approach this is: does the update even trigger when I think it should? verify by logging something or so. if it doesn't trigger figure out why. if it does trigger go to the next step

thheller18:10:22

you continue doing that until solved

roelof18:10:53

I know this one id different because I now use events more and I cannot test this in repl as far as I know

thheller18:10:38

then do whatever in the browser and prn will be visible in the browser console

thheller18:10:59

the process is the same really just the place you look for print output is different

p-himik18:10:16

To expand a bit on the "figure out why" part. For any X to happen, you usually have some chain of conditions that all need to be satisfied. For example, you want a label that just reflects some input field's value. "The label having the same value as the input" is your X. Now, the needed steps: 1. The input's change must be triggered 2. That change must be communicated to your code 3. Your code must get the value after the change 4. Your code must get hold of the right label 5. Your code must set that value to the label's text If that X doesn't work, then it means that any of the above steps could potentially be the issue - so you have to check them all. For more complex Xs, the steps will be more complex as well, and more numerous. But the approach is just the same.

john19:10:37

@U0EGWJE3E Videos also help. And pair programming. Ask around for someone to pair up with you, so you can hear others reason through the code. Unfortunately I'm super busy at the moment but maybe this weekend or next week I can pair - and most people are super busy, obviously, so keep asking around on different forums for pairing.

roelof20:10:36

hmm, got a some data back but I do not see why it happens but it looks like this :

(defn get-input-target[]
  (.-value input-target))
is not the way to get a value out of a drop down list

roelof20:10:06

more wierd things In the hrml I have

<input type="number" class="form-control" id="inputDegree" name="inputDegree" placeholder="Enter Degree" value="0" />
and then I do
(def temp-input (gdom/getElement "degreeInput"))
and
(defn get-input-temp []
  (js/parseInt (.-value temp-input)))

roelof20:10:28

but when I do

(prn (get-input-temp))
I see as output a C

roelof20:10:02

or I see this :

Uncaught TypeError: learn_cljs.temp_converter.temp_input is null
but I set a number in the input box

roelof20:10:23

sorry, I gave up on clojurescript. This gives me too much confusion

p-himik21:10:00

You write (gdom/getElement "degreeInput") along with id="inputDegree". Do you see the issue here?

👍 1
Apple21:10:03

@U0EGWJE3E programming is hard. there is not going to be an easy language i think. after all how can one translate easily real life into 0 and 1? no way. try to relax and come back to it. if cljs doesnt work for you pick another one but use more patience.

1
roelof09:10:28

got it working after a hint here on the chat. I used a wrong name for one of the tags.

🎉 1
wilkerlucio20:10:35

are there plans to port :as-alias to Clojurescript already?

thheller06:10:51

shadow-cljs already has it

🙌 2
Alex Miller (Clojure team)21:10:13

usually David waits for features like this to be in a released Clojure I think