the make file was the thing i never think i will learn, thankyou so much! the way i do is directly place de js code sinde de web folder and no use it with assets when develop.
Rare information, thank you for the tutorial. I implemented this with the new js_interop package which is very similar in a project that uses iOS, Android, and the web. When I attempted to build iOS, I received an error: 'Error: Dart library 'dart:js_interop' is not available on this platform'. Do you know if there is a way to conditionally import or only use this when the running platform is web? It seems I may not be able to use this at all in a multi platform Flutter project.
Yes. This is a common thing I have to do. I'm like 90% sure I've covered this in a video already. Let me try and track it down! EDIT: Found it> th-cam.com/video/Nq5bPx1bmCU/w-d-xo.html (part 3 of this video)
If it were me, i'd rebuild the animation in flutter. You could use a webview, but that's going to not be a performant as using flutter's native engine. Too many layers of separation.
I could marry you from this tutorial. Now, i need to figure how to load data created from a transcationBuilder from an JS SDK, to flutter, and use flutter web3 to send the transaction and broadcast it. (data is the only field I require from the SDK) This tutorial reminds me, when I was having fun putting a whole dart app and turning it into a chrome extensions. Similar to like a metamask extension. Hopefully, i can somehow preload a whole JS SDK into browser or something.
Yep, you sure can. Assuming its a browser based js SDK, just include it near the top of your index.html file. Then, you just need to following more or less what is shown in this video to create the bindings between dart and your global javascript. I've done this exact thing with a crypto library on a flutter web project. The biggest hurdle you will likely run into with crypto is ensuring whatever you make is browser based (and not just node). Many JS libraries don't actually work in the browser but you can use browserify to help with this. GLHF!
Turns out I can import then as cdn imports. It felt dirty to metamask connect via js instead flutter web3 packages lol. Now I'm stuck on typescript package, cause that's different and needs to be complied before accessing and importing
@@Snggle Yeah, you'll need to compile it to plain old javascript and then just put it in your assets folder and load it in the index.html. Then you should be off to the races.
came for the code, stuck around for the fun experiments hehe thx a lot :D
the make file was the thing i never think i will learn, thankyou so much! the way i do is directly place de js code sinde de web folder and no use it with assets when develop.
This is absolutely amazing, thank you so much!
Rare information, thank you for the tutorial. I implemented this with the new js_interop package which is very similar in a project that uses iOS, Android, and the web. When I attempted to build iOS, I received an error:
'Error: Dart library 'dart:js_interop' is not available on this platform'.
Do you know if there is a way to conditionally import or only use this when the running platform is web? It seems I may not be able to use this at all in a multi platform Flutter project.
Yes. This is a common thing I have to do. I'm like 90% sure I've covered this in a video already. Let me try and track it down!
EDIT: Found it> th-cam.com/video/Nq5bPx1bmCU/w-d-xo.html
(part 3 of this video)
Hi, can all of this work for a webview?
I missed one example method. The data stream with UI reactivity.
Not sure if I follow. Do you mean JS streaming data to flutter and flutter reacting to it? If so, what would be a good use case for this?
Flutter with the new version 3.22.0 migrated the JS package to dart:js_interop. Do you think what you showed us works using the js_interop package?
Good inquiry! I'm actually planning on digging into some of the latest stuff with web assembly. So perhaps a follow up video is in the works for this.
@@TylerCodes Oh great!
Let say i have some animations done with js, how can i make it render in my flutter desktop applications
If it were me, i'd rebuild the animation in flutter. You could use a webview, but that's going to not be a performant as using flutter's native engine. Too many layers of separation.
which auto code complete extension you are using
copilot
Can we do this in mobile also? Is it possible to run js on mobile
Mobile web, yes.
@@TylerCodes dont get this. What’s flutter web mobile? So does that mean interop in “just mobile” doesnt work?
👍👍
great
I could marry you from this tutorial.
Now, i need to figure how to load data created from a transcationBuilder from an JS SDK, to flutter, and use flutter web3 to send the transaction and broadcast it. (data is the only field I require from the SDK)
This tutorial reminds me, when I was having fun putting a whole dart app and turning it into a chrome extensions. Similar to like a metamask extension.
Hopefully, i can somehow preload a whole JS SDK into browser or something.
Yep, you sure can. Assuming its a browser based js SDK, just include it near the top of your index.html file. Then, you just need to following more or less what is shown in this video to create the bindings between dart and your global javascript. I've done this exact thing with a crypto library on a flutter web project. The biggest hurdle you will likely run into with crypto is ensuring whatever you make is browser based (and not just node). Many JS libraries don't actually work in the browser but you can use browserify to help with this. GLHF!
Turns out I can import then as cdn imports. It felt dirty to metamask connect via js instead flutter web3 packages lol.
Now I'm stuck on typescript package, cause that's different and needs to be complied before accessing and importing
@@Snggle Yeah, you'll need to compile it to plain old javascript and then just put it in your assets folder and load it in the index.html. Then you should be off to the races.