This post outlines the use of Google’s diff-match-patch library to generate patches that can be translated to operations against an AutoMerge.Text CRDT for situations when deriving the operations directly from user interactions is cumbersome.
Continue reading Integrating Google diff-match-patch with AutoMerge.Text
Category: Web Development
Uploading files to MongoDB GridFS via Apollo powered GraphQL API
GraphQL multi-part request spec outlines a specification for multipart form requests in GraphQL. Jayden Seric, the author of the spec, has also authored two libraries apollo-upload-client and apollo-upload-server which makes it effortless to integrate file uploads in Apollo Server.
GridFS is a simple file system abstraction on top of MongoDB. This facilitates storage of large files (beyond BSON document size limit) in mongo database.
This post outlines the minimal integration required to save the files uploaded through the GraphQL API to GridFS.
Continue reading Uploading files to MongoDB GridFS via Apollo powered GraphQL API
Integrating Next.js, Apollo Server and Koa
It is fairly straightforward to add a GraphQL API powered by Apollo Server to a Next.js application through a koa middleware.
The abbreviated snippet below summarizes the setup along with the libraries involved:
Exposing slots in layout containers through shared refs in React
React refs are generally considered an anti-pattern as their usage typically encourages patterns which go against declarative compositon and top down flow of data.
This post explores a somewhat uncommon use case where refs can be used to expose layout slots in parent components to nested components.
Continue reading Exposing slots in layout containers through shared refs in React
ReasonML vs TypeScript – First impressions
This post summarizes preliminary observations while comparing ReasonML and TypeScript during selection of a reasonably (pun-intended) type safe language for frontend development. The observations here are somewhat biased in favor of experienced javascript developers and focusses primarily on frontend development workflow and does not take into account the (primary) native backend of Reason.
While this post primarily compares Reason and TypeScript, much of what is outlined about TypeScript equally applies to flow as well.
A Vagrant+Docker based workflow for clojure web development
This post outlines a container based development workflow using Vagrant and Docker.
Many common docker tutorials (eg. the official node tutorial) suggest a workflow where projects source is copied onto the image, which is then built and run through docker. This approach is not really practical for clojure development as normal clojure programming leans heavily on rapid prototyping and REPL driven development.
The setup below utilizes Vagrant and docker volumes to setup a development environment which ensures reproducibility and container isolation while retaining the short feedback cycle which clojure developers take pride in.
Continue reading A Vagrant+Docker based workflow for clojure web development
Redux-loop: A better solution for managing asynchronous operations in redux
The lack of support for asynchronous operations in redux core has spawned a whole ecosystems for managing side-effects [1] in Redux.
This post argues that the redux-loop library (1.5 k ★ as of this writing) is a much better solution for this job than other more popular alternatives like redux-sagas (11.8 k ★) and redux-thunk (7.8 k ★).
As has always been prevalent in frontend ecosystem, popularity does not necessarily translate to better suitability.
Continue reading Redux-loop: A better solution for managing asynchronous operations in redux
Reducing BEM boilerplate through HAML extensions
A hack which makes the HAML parser BEM aware and helps reduce some of the repetitive boilerplate associated with specifying BEM compliant class names in templates.
Decoupling your frontend development with gulp and http-proxy
In past developers have often relied on backend-specific toolchains for web application frontends. Some examples would be Rails asset pipeline or the legacy ant based toolchain for YUI. However recently node.js based tooling support for frontend technologies has significantly evolved and it is quite viable to use a node.js based toolchain for managing your frontend projects, even if the backend is not node.js, thus keeping the workflow decoupled from the backend.
Sharing Jade templates between Node.js server and client
One of the biggest promises of Node.js is code re-use across client and server – this post focusses on reusing server side templates on client as well for dynamic rendering.