Fork me on GitHub
#clojurescript
<
2016-11-18
>
hwk03:11:05

anyone here have good/bad things to say about re-com ? I'm a big fan of reagent, and trying to figure out if it's worth the time to pickup the entire re-com library

hwk03:11:30

(suggestions of alternatives also welcome) -- looking for a "UI kit" with more than just basic div elements

shaun-mahood04:11:01

@hwk: I like it, I built one re-frame application with it and it really, really sped things up compared to doing the same type of work without it.

hwk04:11:53

@shaun-mahood : I am using reagent. I am reading re-frame documentation. There seems to be lots of buzzwords. What does re-fame actually do?

hwk04:11:04

WIth figwheel + devcards + reagent, it's not clear to me what reframe is providing.

shaun-mahood04:11:46

@hwk: It gives you a well thought out, performant and scalable architecture to build your application with - if the way it works suits your needs, I think it's an excellent structure to use, but it's certainly not necessary if you are happy with the structure you've built using reagent.

shaun-mahood04:11:16

I think it would be worth trying if you are already comfortable with reagent, it's pretty easy to understand the basics and it may give you some ideas you can implement even if you don't end up using it.

hwk04:11:57

@shaun-mahood : maybe I'm not seeing it -- is there a tutorial for re-frame somewhere? the devcards / reagent tutorials are jaw dropping, but with re-frame, I have yet to see a demo that makes me go "wow, this bonkers"

shaun-mahood05:11:59

@hwk: I think the best resource right now for that kind of thing is either going to be in the docs somewhere (https://github.com/Day8/re-frame/tree/master/docs), or one of the external resources (https://github.com/Day8/re-frame/blob/master/docs/External-Resources.md), or in one of the Lambda Island videos (https://lambdaisland.com) though I haven’t watched the newest re-frame one yet. I’m giving a re-frame talk at the Conj, so hopefully that will go a bit of the ways towards what you’re looking for but I won’t make any guarantees. For my part, I found devcards and figwheel amazing and love Reagent, but re-frame was the thing that made it go from “looks awesome and fun to use” to “I can make awesome stuff consistently and quickly”. If you want more details or anything like that, the #re-frame channel is active and helpful too.

tianshu05:11:56

In ClojureScript, I want some stuff generated in compile time, so I write a macro. This macro receive functions as it's arguments and return a map(not in syntax quote) after some computation. How can I parse function as arguments? I tried to write function in a cljc file, but still Could not Analyze <cljs form> when call this macro.

mikethompson06:11:54

@hwk the measure of a framework is how it helps you to bring regularity to bigger, more complex apps. Frameworks look like annoying overhead at small scale. So small little examples will show you nothing much. Over the last couple of years, I've had probably 10 people tell me "I started in pure reagent and I loved it, but my app got a little messy as my app grew bigger." That's where re-frame will help - it forces a bit more discipline/structure.

rauh06:11:30

@doglooksgood Can you show us the macro you're trying to write? You only get symbols in the macro, you can't "parse" a function.

hwk06:11:41

@mikethompson : Yeah, that's what I was assuming. That at some point, my devcard/reagent setup was going to "feel messy" and I'll suddenly realize "hmm, maybe this reframe thing makes sense"

tianshu06:11:49

@rauh I've made a minimal case, this is the macro:

(defmacro test-macro
  [f]
  (f))
And I write this function in a cljc file.
(defn foo []
  {:foo :bar})
The usage, require the cljc file in both clj(where macro is) and cljs file. in cljs file:
(test-macro some.ns/foo)

hwk06:11:45

@doglooksgood : what is the expected output of (test-macro some.ns/foo) ? -- and are you trying to infer it by (1) static analysis or (2) running the code ?

mikethompson06:11:09

@hwk yeah those that praise re-frame the most are wrangling 40K lines of Clojurescript. :-)

mikethompson06:11:20

That's when you need that discipline and structure.

tianshu06:11:54

the expected output should be {:foo :bar}, there's no syntax quote in my macro, because I want it run completely in compile time.

hwk06:11:55

@mikethompson : the diagrams do look nice; I have been recently writing a poor man's datascript based off of http://aosabook.org/en/500L/an-archaeology-inspired-database.html

hwk06:11:18

and the idea of "there is one source of truth -- the db, -- and all else is derived -- and all user actions just map to transactions on the db -- seem very very enticing"

hwk06:11:07

@doglooksgood : so suppose you had the following code, what is it supposed to do (defn tricky [] (if [some machine halts] {:foo :bar} {:a :b})) in this case, what si your macro supposed to do?

tianshu06:11:19

Just return {:foo :bar} or {:a :b}, put the result in the place where the macro is called.

hwk06:11:39

But how is the macro supposed to know which one?

hwk06:11:05

Is the macro supposed to execute the function at compile time and output its output ?

rauh06:11:46

@doglooksgood Then you just need to eval it. (eval (f))

tianshu06:11:03

Actually, in my case, I'm try to write a DSL for generating stylesheet, this doesn't need any information from runtime. But the generating may take some seconds.

rauh06:11:50

You can also do a resolve, same effect.

tianshu06:11:18

@rauh The eval works, but if I give some.ns an alias name, how can I correct resolve it?

rauh06:11:11

@doglooksgood That's probably possible with tapping into the cljs compiler. But it's been a while since I did that 🙂

tianshu06:11:35

maybe syntax quote works

rauh06:11:16

@doglooksgood (cljs/resolve-var &env sym), where (:require [cljs.analyzer :as cljs])

tianshu06:11:22

(test-macro `alias-ns/foo)
in macro, use
(defmacro test-macro [f]
  (str (type (second f))))
this way, I can get the symbol.😂

rauh06:11:38

You could do this:

(defmacro cljc-eval
  [sym]
  ((resolve (:name (cljs/resolve-var &env sym)))))

tianshu06:11:38

is cljs/resolve-var a Clojure function?

rauh06:11:06

Everything called in a macro is a clojure function. There is no cljs anymore.

tianshu06:11:12

I have two question: 1. what is the full namespace of cljs/resolve-var? 2. what's &env stands for and how can I get it.

rauh06:11:36

I posted the require for cljs above

tianshu06:11:56

Oh! found it

tianshu06:11:52

that's MAGIC!

tianshu07:11:34

@rauh can you explain what is the &env?

rauh07:11:00

@doglooksgood You can just return it and see, there is also a bunch of info about it on google

tianshu07:11:31

Okay, this is exactly what I want, thank you very much!

danielgrosse09:11:29

Hello, I want to use macros in clojure script. But when I compile the cljs, the error Could not locate vr_secondview/devtools__init.class or vr_secondview/devtools.clj on classpath. Please check that namespaces with dashes use underscores in the Clojure file name. occurs. How do I define the compilation of the file devtools.clj?

thheller09:11:07

@danielgrosse looks like your .clj file is not on the JVM classpath

thheller09:11:04

happens if you use something like src/cljs and use cljs build tools to access it without telling lein about it

thheller09:11:05

how are your :source-paths configured? and is the clj in one of them?

danielgrosse09:11:12

@thheller That was the solution. Thank you

borkdude09:11:18

Should I be able to evaluate x from the console when in the debugger? https://www.dropbox.com/s/vhq8osx3eg8jfl6/Screenshot%202016-11-18%2010.29.19.png?dl=0

borkdude09:11:31

I finally got source maps working, but I forgot if this should work or not

anmonteiro09:11:36

@borkdude I think that'll only work in Dirac

anmonteiro09:11:45

but I'm not a devtools or dirac user, so can't really be sure

danielgrosse12:11:04

Has someone experience with dirac, figwheel and cursive?

danielgrosse13:11:51

Hello @dnolen I load figwheel in cursive as it is documented on the wiki of figwheel. But I suffer on enabling dirac with it. At the first attempt I preload the dirac library and start figwheel with the plugin in terminal. But the dirac agent isn't enabled. On second I loaded (start-figwheel config) (dirac.agent/boot!). But dirac isn't connecting to the websocket.

dnolen13:11:58

@danielgrosse oh sorry, I thought you were just referring to cljs-devtools

dnolen13:11:03

I don’t use dirac actually

darwin13:11:37

@danielgrosse I should be able to help, but if you are a beginner, I would advise not using Dirac at this point

darwin13:11:12

getting dirac+figwheel work together is the most advanced dirac-related setup

danielgrosse13:11:00

Hm, I know, figwheel is now only used as webserver and hot reloader. Dirac is providing a websocket which the chrome extension connects to. Am I right?

darwin13:11:16

as you can see, in the nREPL server JVM process, I start nREPL server, Dirac Agent and Figwheel sidecar, all happily sharing one JVM

darwin13:11:14

after you get that working, here is the document describing how to connect with Cursive: https://github.com/binaryage/dirac/blob/master/docs/integration.md

danielgrosse14:11:23

@dnolen When I set a namespace into the preload setting. The namespace gets added to the cljs_deps.js, but when is it evaluated?

mikebelanger14:11:44

Atom users: I just stumbled over this, and it works with .cljs files too! https://atom.io/packages/atom-cljs-doc

dnolen15:11:42

@danielgrosse preloads come after the standard library but before all of your own code

darwin15:11:07

@danielgrosse please share whole project.clj, from that error message it looks like you didn’t provide :figwheel-config profile, which is a profile

darwin15:11:19

highlighted code depends on

hwk16:11:45

I have seen 'in browser cljs repls' that depend on a clj server on the backend -- are there any "cljs repls" that run entirely in the browser ?

br11k16:11:35

Is there a way to setup nginx as front-end reverse proxy to figwheel while using SSL for dev? I have an error connecting to wss:// so I've tried to use tunnels ruby gem. But I cannot map port 443 because it says it's already in use. So I'm kind of stuck.

dnolen17:11:15

@hwk yes that’s what bootstrap allows http://clojurescript.io

hwk17:11:48

@dnolen : I just want to confirm: http://clojurescript.io/ is running entirely in my browser there is no server side compilation of any form going on?

spacepluk17:11:52

does clojurescript benefit from direct linking?

dnolen17:11:34

@spacepluk we already have that optimization, it’s called :static-fns in ClojureScript

dnolen17:11:53

and yes - it’s a huge performance boost

spacepluk17:11:33

I'm running some code on a very slow interpreter and I'm trying to find ways to make it a bit faster

spacepluk17:11:10

but I'm seeing that most of it is enabled with advanced optimizations

spacepluk17:11:15

which I'm already using

dnolen17:11:41

@spacepluk if you’re looking for hotspots use Chrome DevTools profiling

dnolen17:11:12

:none optimizations + :static-fns is good enough for fairly accurate profiling

hwk17:11:24

I' using cljs. I'm using (println (.-stack e)). Now, my question is: is there a way I can interact with this output before it's written? In particular, I want to filter out certain stack traces.

dnolen17:11:19

@hwk if you mean you want to intercept evaluation - no there’s no generic way to do that

spacepluk17:11:41

@dnolen thanks again, I'll try with those settings

hwk17:11:22

I want to filter for all strings in lst that contains *foo< so this should work right? (filter #(re-find #"foo" %) lst)

hwk17:11:29

I'm getting a weird error about re-find only getting 1 argument

spacepluk18:11:29

whas it lst?

hwk18:11:49

@spacepluk: I apologize. There was another part of my code which had (re-find #" ...") with no string.

hwk18:11:01

cljs was complaining about that line, but I incorrectly attributed it to another line.

hwk18:11:10

[It also works for me now] -- sorry for crying wolf. 🙂

spacepluk18:11:16

hehe np 🙂

hwk18:11:34

cljs stack traces has too much cljs.core/js stack traces; I'm writing a filter to only display the ones from my actual code.

hwk18:11:13

Thus, I'm filtering for "at <my-package-name>" in on a (map #(filter #"package-name" %) (split-lines (.-stack e))))

dnolen18:11:56

that’s not something I recommend doing - but OK

dnolen18:11:27

experience

hwk18:11:50

given you wrote clojurescript, om, om-next, and god knows what else, I'll keep it in mind 🙂

darwin18:11:13

@hwk: chrome devtools have a feature called “script blackboxing”, look into that, many places where stacktraces are presented in devtools UI support that, including console stack trace printing

hwk19:11:07

@darwin: nice, thanks!

hwk19:11:19

Two separate questions: 1) is there a guide on getting figwheel to work over google app engine, and 2) what is the standard way to deploy clj + cljs apps on gae ? [1] I'm assuming possibly not since, unless I use GCE and setup a VM, the clj is running on my desktop, but the website is served via GAE

darwin19:11:56

@hwk 1) doesn’t make much sense to me - it is a general practice to develop app locally in a dev mode (using figwheel) and then build optimized version in advanced mode and deploy it - technically you could deploy a dev build on gae with "figwheel plugin” included and drive code reloading from your local machine, but for each hard refresh you would have to re-deploy a new version, sounds like a bad workflow

darwin19:11:26

but last time I used GAE was 7 years ago, things could be different today 🙂

darwin19:11:29

btw. I wrote this thing: http://firelogger.binaryage.com, it used to be pretty handy for server-side logging on GAE

hwk19:11:30

darwin: 1) was not aware GAE even ezited 7 years ago; 2) you wrote a firefox addon for your own debuggin -- that's hard core; 3) I wanted to develop 'vs live database' -- but in retrospect, maybe it's better I don't do that

br11k23:11:21

How to run figwheel on HTTPS using Nginx as front-end web-server reverse-proxy?

noisesmith23:11:04

@br11k so you are trying to run figwheel as a server process? Ideally you'd use cljsbuild to compile the cljs and just serve that, figwheel is a dev tool.

br11k23:11:41

@noisesmith I would like to use reload-less workflow using "lein figwheel dev". But I thought SSL would be working out of the box. I have been searching for this answer for quite a while and I'm really confused like what is the proper way to deploy apps written in ClojureScript

noisesmith23:11:12

so you want to do live dev in a repl for your production environment?

noisesmith23:11:45

you deploy clojurescript apps by using cljsbuild, then serving the resulting js files

noisesmith23:11:52

after that it's the same as serving any other js

noisesmith23:11:28

(I mean, that's the normal way to do it at least)

br11k23:11:27

Not sure if I need REPL at all. I've tried using this guide to make it clear: https://solovyov.net/en/2014/cljs-start/

noisesmith23:11:51

that's a dev workflow, it's not how you'd serve an app

br11k23:11:07

Yep, but can I use this workflow together with nginx?

noisesmith23:11:26

I mean, figwheel might be just fine as a production server, but my assumption until I see proof otherwise is that it's fundamentally a security hole (as most dev tools are if clients access them)

noisesmith23:11:45

br11k so you want nginx running in your dev environment? maybe I misunderstood

br11k23:11:20

I already have a lot of applications running on my VPS, and :3449 port is not accessible for security reasons

noisesmith23:11:49

figwheel should only be serving to localhost anyway, and the port is configurable

noisesmith23:11:27

in my experience trying to access my app from other machines on the LAN doesn't allow the figwheel connection, which is sane (for security reasons, of course)

noisesmith23:11:33

if you are using figwheel from docker I'd assume you could just tunnel the ports from the image into ports that work on your actual box

noisesmith23:11:50

maybe I'm still misunderstanding this situation though

br11k23:11:53

Yeah that is ok, I've also configured my nginx to serve files from resources/public folder so you can see it's working: https://cljs-todo.br11k.me/

br11k23:11:04

But the problem is that I cannot connect to secure websockets

br11k23:11:13

See js console

br11k23:11:08

But I cannot run tunnels because 443 port is owned by Nginx I guess

noisesmith23:11:16

oh yeah, you need the wss protocol

br11k23:11:24

Maybe I'm overcomplicating this 😄

noisesmith23:11:01

can't you just run wss over an alternate port? also, consider using ssh to tunnel the localhost-only websocket port from the server to your dev machine

noisesmith23:11:17

that's at least as secure as wss, if not moreso

noisesmith23:11:37

br11k my concern would be that since figwheel connects the js browser repl directly to a java process, someone could easily start messing with your server via their js console

noisesmith23:11:52

because I don't think figwheel was written with security in mind, at all

br11k23:11:58

I see, I can allow only selected IP addresses using nginx though

br11k23:11:26

So I've tried to change websocket port in project.cjl :websocket-url "<wss://cljs-todo.br11k.me/figwheel-ws>"

noisesmith23:11:50

sure, but creating an ssh tunnel for the ws port might be less complex

br11k23:11:51

But it gives me the error: VM884:35 WebSocket connection to '<wss://cljs-todo.br11k.me/figwheel-ws/dev>' failed: Error during WebSocket handshake: Unexpected response code: 200

noisesmith23:11:24

ahh, we saw this with the websocket of our app (using nginx)

br11k23:11:46

How can I create ssh tunnel for ws port (443)?

br11k23:11:49

Yep I know how it works basically, but I'm not sure I would be able to map port 443 to another one

noisesmith23:11:51

your case is close to the "connecting to a database behind a firewall" example on that page

noisesmith23:11:57

but if port numbers are hard coded in the cljs, that makes it trickier

noisesmith23:11:10

@br11k also my ops guy just found his config that fixed this for our server's nginx setup, I guess we can share that config if it helps

noisesmith23:11:35

(I mean we were using this for our cljs websockets, not addressing figwheel at all, but I guess it would translate)

br11k23:11:06

So that's issue with cljs, not with figwheel in particular?

noisesmith23:11:21

not even cljs - websockets and nginx

noisesmith23:11:28

map $http_upgrade $connection_upgrade {
    default   upgrade;
    ''        close;
}

server {
       listen         8083;
       return         301 https://$host$request_uri;
}

server {
  listen 80 proxy_protocol;

  location / {
    proxy_pass 
    proxy_http_version 1.1;
    proxy_set_header  Upgrade  $http_upgrade;
    proxy_set_header Connection $connection_upgrade;
    proxy_set_header  X-Forwarded-For  $proxy_protocol_addr;
  }

    access_log /var/log/nginx/elb-access.log elb_log;

  proxy_connect_timeout       1202;
  proxy_send_timeout          1200;
  proxy_read_timeout          1200;
  send_timeout                     1200;
}

br11k23:11:38

Oh thank you very much I've fixed the issue 😉

noisesmith23:11:28

what was the problem?

noisesmith23:11:35

or, what worked?

br11k23:11:17

I thought that nginx works with SSL websockets out of the box

br11k23:11:25

When you told me that this is not the case, I've googled this: http://stackoverflow.com/questions/12102110/nginx-to-reverse-proxy-websockets-and-enable-ssl-wss and it's worked!