I have recently been working on small example application using three.js and react-three-fiber. In the first two iterations, I first developed a simple draggable shape floating in space and then supported multiple shapes that can be moved on a physical plane. In this post, I am going to be extending the example to support camera … Continue reading Camera Movement with Three.js
Category: JavaScript
Create and Drag Shapes with Three.js, React and Cannon.js
Following up from my article published a few days ago, I have now extended and improved the simple WebGL application that I originally developed using Three.js and react-three-fiber. Version 1 of the application allowed dragging a simple shape around on the screen: App: https://react-three-fiber-draggable.surge.sh/ Source Code: https://github.com/mxro/threejs-test/tree/master/test1 Version 2 combines this basic premise with the … Continue reading Create and Drag Shapes with Three.js, React and Cannon.js
Creating a Draggable Shape with React Three Fiber
I recently became interested how to render 3D graphics in the browser. I think WebGL is an extremely powerful technology and may one day become an important way of rendering content on the web. There are various frameworks and tools available to use WebGL such as Babylon.js and three.js. To me, three.js looks the most … Continue reading Creating a Draggable Shape with React Three Fiber
Medooze Media Server Demo
I've recently done some research into WebRTC and specifically on how to stream media captured in the browser to a server. Initially I thought I could use something like Kinesis Video Streams and have AWS do the heavy lifting for me. Unfortunately this turned out way more complicated than I had anticipated so I started … Continue reading Medooze Media Server Demo
Advantages of Using React Hooks
I always had the feeling that React is just a bit to complex, a bit to 'heavy' to be a truely elegant solution to the problem of building complex user interfaces in JavaScript. Two issues, for instance, are the general project setup, exemplified by the need to have create-react-app, and class-based components, with all their … Continue reading Advantages of Using React Hooks
Deploy Lambda using SAM and Buildkite
One of the many good things about Lambdas on AWS is that they are quite easy to deploy. Simply speaking, all that one requires is a zip file of an application that then can be uploaded using an API call. Things unfortunately quickly become more complicated, especially if the Lambda depends on other resources on … Continue reading Deploy Lambda using SAM and Buildkite
Setting up Continuous Deployment with Lerna and Buildkite
Buildkite is a great tool for running multi-step build and deployment pipelines. Lerna is a tool for managing multiple JavaScript packages within one git repository. Given that both Lerna and Buildkite are quite popular, it is surprising how difficult it is to set up a basic build and deployment with these tools. It is very … Continue reading Setting up Continuous Deployment with Lerna and Buildkite
Testing Apollo Client/Server Applications
Following up on the GraphQL, Node.JS and React Monorepo Starter Kit and GraphQL Apollo Starter Kit (Lerna, Node.js), I have now created an extended example which includes facilities to run unit and integration tests using Jest. The code can be found on GitHub: apollo-client-server-tests The following tests are included: React Component Test This tests asserts … Continue reading Testing Apollo Client/Server Applications
GraphQL, Node.JS and React Monorepo Starter Kit
Following the GraphQL Apollo Starter Kit (Lerna, Node.js), I wanted to dig deeper into developing a monorepo for a GraphQL/React client-server application. Unfortunately, things are not as easy as I thought at first. Chiefly the create-react-app template does not appear to work very well with monorepos and local dependencies to other packages. That's why I … Continue reading GraphQL, Node.JS and React Monorepo Starter Kit
GraphQL Apollo Starter Kit (Lerna, Node.js)
In many ways developing in Node.js is very fast and lightweight. However it can also be bewildering at times. Mostly so since for everything there seems to be more than one established way of doing things. Moreover, the right way to do something can change within 3 to 6 months, so best practices documented in … Continue reading GraphQL Apollo Starter Kit (Lerna, Node.js)
