Hello! I am not a complete beginner to Clojure, Reagent, Re-frame etc as I have built a few web apps, but I am now trying to get a react native application up and going with re-frame and reagent. I have spent past few days hitting my head on the wall, but I can't get through. Basic re-natal project doesn't work, and I don't know how to get a react native up and running. If anyone has experience with react native and clojurescript and you have some time to help a fellow out, please do. Much appreciated!
What does react-native -h
and react-native --version
return?
Good morning!
I uninstalled the react-native-cli. It seems that react-native recommend to use @react-native-community/cli instead as react-native-cli is deprecated. So I will create a new react-native project with that cli and try to recreate what I did already. This recommended cli package contains all the things needed. 🙂
I will come back to this thread as soon as I have sometrhing to share!
I have made it all work with the new CLI and it is going great.
I have even made it work with the android emulator which didn't work earlier.
But the one problem I have now is that the emulator doesn't update in a very certain case. It is very hard to explain. Perhaps I need to make a video or something 😛
I have fixed that weird problem as well! I am not 100% sure why, but I needed to elevate my function call to the core.cljs file so that my app hot reloaded correctly with state etc. Otherwise it would just hot reload sometimes and other times it would need a full reload. 😮
Hi, maybe you can describe, in detail, what you’ve done, so that we have something to go on. Because saying “it doesn’t work” it’s not very meaningful
I have followed https://github.com/drapanjanas/re-natal guide and made no modifications to at all. Just followed that step by step. I have adoptjdk 8 hotspot installed.
And what happened?
Maybe post that as a gist? Slack is reporting that it’s a “bin” file
This is the output of running "lein figwheel android" and then going to localhost:3449/figwheel-ws
This is my java version btw D:\Clojure Projects>java -version openjdk version "1.8.0_242" OpenJDK Runtime Environment (AdoptOpenJDK)(build 1.8.0_242-b08) OpenJDK 64-Bit Server VM (AdoptOpenJDK)(build 25.242-b08, mixed mode)
I’d try https://github.com/PEZ/rn-rf-shadow I don’t think you need re-natal
Let him just get bootstrapped with re-natal to make sure that it can work
Then he can decide what to go with
Just to understand @shakof91 you ran:
npm install -g re-natal
re-natal init FutureApp
re-natal use-figwheel
and at this point you brought up your Android emulator?yes, then I ran re-natal use-android-device avd then lein figwheel android then react-native run-android
OK, and did you start your Android emulator?
Yes, I had it up and running before running lein figwheel android command
This is odd. Let me try to run the same steps to see if I can reproduce it. Mind you, I’m on a different operating system and I see that you’re on Windows…
Let me ask you this, does your lein
command behave like it should in the other projects?
Yeah, I am on windows. But I have clojure and my web app projects working fine.
Great
Yes it does. But let me double check
Now look in your app, what does your project.clj
look like, does it have this: https://github.com/drapanjanas/re-natal/pull/228/files
(NOTE: the extra =
)
YEs, it is exactly like that.
Just started up one of my web apps with lein figwheel and it is working as it should.
So leiningen works fine it seems.
When you said yes, did you mean, you do have the extra =
?
yes, I do have the extra =
Ah I shouldn\t I guess
I think that this setting is only relevant for JVMs that are over 8
But just in case, I’d remove it, because it shouldn’t be there.
Remove the whole line or jsut the =?
I’d modify it to look like the green line in the PR I shared above.
OK, so I followed the steps on macOS and it worked for me, I got the REPL prompt, as expected. There is a little omission in the steps listed in the README. Try this:
npm install -g re-natal
re-natal init FutureApp
cd future-app
yarn (or npm install, whichever one you prefer)
re-natal use-android-device avd
re-natal use-figwheel
Open a second terminal and run: react-native run-android.
Once it completes, go back to the first terminal and run:
lein figwheel android
@shakof91 did that work?
I got a phone call. Let me get back into it. Sorry about the delay
the metro server doesnt start up. The emulator just says that it was unable to load scrip and that I need to make sure that metro srver is running.
If something works, don’t post the output of that, but do post the output of whatever doesn’t work, preferably as a gist, here: https://gist.github.com/
Ah that is the one that didn't work. As it didnt start metro server.
OK, but I didn’t see any errors on it.
Let me ask you this, have you used these tools on Windows before and confirmed that they work outside of ClojureScript ?
As in, you’ve got no problems running all these spinning plates in a vanilla JavaScript setup?
I’m asking this, because I’m unfamiliar with Windows, and want to make sure that none of the issues that we’re trying to get to work, can work on Windows.
Hmmm yeah. Let me startup a normal react native app.
If you confirm that all is working, what error do you get when you run react-native run-android
?
Yup works great when I just do react-native init Project cd Project react-native run-android
I have the emulator up with the Metro running and it works nicely.
OK, so go back to the clojurescript project and report back at what step does Metro break for you and share in a gist the error
It is when I run react-native run-android https://gist.github.com/ShakoFarhad/fc1c9872a646164700a3486b8308ebda
So in that gist that you’ve shared, I don’t see the error. All I can see there is that the app was installed on your Pixel_3a_API_R(AVD)
.
My successful attempt with normal react native started the Metro server in another cmd terminal and the run-android command is looping in my original terminal. But when I do the same in re-natal project, the Metro terminal doesnt pop up (It pop ups for 1 milli second and then goes away) and the run-android command doesn't loop.
I will try to setup the shadowcljs way as it is a bit closer to the normal react native way. Hope it works!
Hmmm, that’s unfortunate. Because I don’t have much to go on and tell you what could be broken exactly…
So instead of pursuing this path with re-natal
could you try another with a different build tool, using shadow-cljs
instead of leiningen
?
We are in sync! 😉
Use this repo: https://github.com/thheller/reagent-react-native
It works!
The above repo, the shadow-cljs one ?
I made some modifications and got latest re-frame and latest reagent to work with it. We have an app!
The one you linked. I didn't want to use expo 🙂
Great 🙂
It successfully built a release app aswell.
I have not tested on mac and ios yet. For now, connecting the app to my own android phone works flawlessly. But connecting to emulator doesn't work. The app inside the emulator just opens and closes.
Hmmm, not sure what could be the issue there… but react-native works on both platforms with ClojureScript
Yeah I will test IOS later. 🙂
As long as it works on my phone I am fine. Don't know why the emulator is being weird, but I guess the phone is better anyway.
I remember reading this once, 10+ years ago, and I can’t find the source any more, that describes mobile development experience: “In a Death Star, shooting ants”
Hopefully that deathstar is a compact pocket magnifying glass now 😜
Dotemacs, you have Mac, right? It seems the "npx react-native run-ios" is not recognized in the repo I am working in. Do you have something like that in your repo? Perhaps you could share how you open a emulator and run the code on mac? I have a macbook pro with cocoapods, java, npm, shadowcljs and leiningen installed.
AFK... but try running the above without the npx
in front
I did. It is the same response. As if react native doesnt have a run-ios command.
I have managed to get the index.js file compiled with shadow-cljs in a react native app. And I have also managed to create a APK with the gradlew command. The react-native run-android command also works great as it starts the app on my phone (but not on emulator). But I do not have a react-native run-ios command. And i do not know how to build an ios app out of the index.js file. Anyone know how to proceed with this? I have a mac with xcode, react-native-cli, npm, cocoapods, leiningen and shadow-cljs installed.