In this channel, I share my learnings from Webdev to Mobile application Development to 3D to Interview Preparation to XR(AR/VR/MR) to .......
As you might have noticed, the topics are quite broad and since it is not feasible to create all videos at the same time, I like to focus on creating videos on topics which I have interest in in the present time and also videos which have more active comments, since comments give me clarity on the interest in those topics.
So, if you want me to focus on particular topics, do comment on those videos.
I have a Topmate profile. You can check my available times for having a call. topmate.io/mohit_kumar_toshniwal . Otherwise I am mostly available through my LinkedIn and X handles.
thank you sir, this was very helpful! any idea on how theming is done for these webviews? I'm displaying my webview in a different modal within vscode which I modified the source code (from the vscode open source fork). So when displaying in modal the background is just white, similar to browser
Hey can you please tell me , is it possible to place multiple items through web xr like if i create a sidenavbar where i can switch and place multiple items
Easiest way would be to deploy to vercel and whenever you make changes just redploy otherwise you can do usb debugging as well. I think I have shared the link on how to do usb debugging with mobile in the video description.
@@mohitkumartoshniwal I have deployed on vercel and now using my mobile Now with my mobile when I click on enter AR Nothing happens but in my laptop browser it opens I want to see real demo that you showed in the starting in the video you played. I want to see real demo with my mobile
The live link which I had shown in the video is r3f-fiber-draft.vercel.app/xr-hit-cube. If this works, then cross check your project's package dependencies versions with the GitHub repository one and if this doesn't work in your mobile then I am not aware of what might be the issue other than webxr not being compatible with your mobile.
Very Nice Video Brother, Lots of Learning. Further I want to add a feature of Excalidraw where a user is able to type anywhere he clicks on the screen. Help me.
Thank you so much for the video Sir! I got an urgent task to create a vscode extension and this video happened to be a life saver actually. Pls do more such videos. Thanks again!!!
Sorry but I am not able to understand the point you have raised. If its about event bus, it has been deprecated in Vue 3 and if you are talking about emitting the event from a child to a parent then yes you can do that. It is a trade-off one needs to make with regards to the data flow.
If you are talking about those animation buttons, then I am using Dom overlay api for it. You can get more clarity in the playlist which I have created.
Hi Mohit , How do we store this structure and how to retrieve for doing further changes ? I am looking convert this to some thing similar to sequence flows ..any idea on how to do that ? Thanks in advance !
I have not explored it much with regards to saving and retrieving but I believe it should be somewhat similar to storing data in the form of a json and when the application loads up, we can use that json to load up the previous state. For some more reference, you can check out the server driven ui in my RU-vid channel.
Can you clarify if you had placed the cubes while in the AR scene, then you had exited the scene? If that is the scenario then extra handling needs to be done using isPresenting from react-xr to show a different component when you are in a webxr session and another component normally so that both of them don't interfere with each other.
@@mohitkumartoshniwal Yes, I have placed the cubes in the AR Scene and exited the scene. I have the below code const placeCube = (e: XRInteractionEvent) => { const position = e.intersection?.object.position.clone(); if (position) { setCubePosition(position); } }; return ( <> <OrbitControls /> <ambientLight /> {isPresenting && cubePosition && <Cube position={cubePosition} />} {isPresenting && ( <Interactive onSelect={placeCube}> <mesh ref={reticleRef} rotation-x={-Math.PI / 2}> <ringGeometry args={[0.1, 0.25, 32]} /> <meshStandardMaterial color="white" /> </mesh> </Interactive> )} {!isPresenting && <Cube />} </> ); Note that cubePosition is not an array in my case
Honestly speaking, No difference with regards to the features as such instead JSON Crack has a lot more features. Planning to add some of them as I go along. And technically speaking JSONLens uses Reactflow and JSON Crack uses something else, can't recall it correctly right now.
A data structure needs to be maintained and whenever any changes are made by the user that data structure needs to be updated and stored in some storage. When the user reloads the site the next time, then the data structure is parsed and the GUI elements are added in the viewport. If you are interested in diving more deep, I would suggest you to checkout excalidraw's blogs. They have explained their architecture in depth and from there you can take references to go forward.
Impressive! How did you set up the entire environment? Could you provide a tutorial on creating such an impressive and reliable setup, similar to what you've already accomplished?
@@mikemixsosa4264Well those were created by electron-vite itself. It takes care of the scaffolding aspects of the project and I would suggest you to check out its documentation in the meantime. Maybe when making future videos on electron, I will consider explaining those as well.