This article is the continuation of A Functional Programming Primer, where we gently introduced the concept of functional programming. Composition and associativity are more advanced parts of functional programming. It might seem daunting at first, but as we dive further, it gets clearer. Composition can also be expressed as combination. It shows the directional flow of data in our declaratively written code by combining multiple functions in a h
A Functional Programming Primer
Functional programming (FP) has seen a rise in usage within the past half decade with the introduction of libraries like React. We get to use some of these libraries that encourage declarative programming and functional paradigm, yet many are intimidated by the term functional programming because it is often followed by jargon terminology like monads, functors, lambda calculus, currying, transducers... When the year started, we explored the state
Building User Experiences with Three.js
In a previous post, we covered the basics of Three.js and the concept of 3D on the web. If you have not already read that, you should. Some real-world examples of 3D on the web were shown in that post. Now, we will just try to get comfortable with building such experiences. I will start with the hello world of 3D design, which is making cubes. For you to build along, I have made a codepen template you can pick up from. Let us try to understand wh
Diving into 3D WebGL with Three.js
The web has been the most used platform for software development since the start of the 21st century as it transitioned from a document sharing platform to a home for scalable applications. We have had the animation and gaming industry also move from traditional and 2D graphics/animations to 3D. More recently, there has been much innovation around virtual reality (VR) and augmented reality (AR), and most of that is also coming to the web. As an o
5 React 16 Features You Can't Live Without
Is Fiber ready yet? Yes, it is. Getting a little late to the react scene, I found it weird that people anticipated a feature so enthusiastically. I kept asking why people are not happy enough about the state of React at 15. Why not embrace 16 when it comes without so much anticipation? But people wanted it like Yesterday before it even arrived. Little did I know that React 16 is indeed a pack of awesomeness worth the anticipation and it is a comp
Integrating React and Vue Components in One Application
The majority of software developers considers the co-existence of umpteen JavaScript toolings as a downside of the language and its community. Eventually, they get to pick a side on the tooling available for their work and start hating the others. These are people who think CSS-in-JS is a solution for people who do not understand CSS, people who think NPM is preposterous and only Yarn should be used simply because they never upgraded their NPM ve
Animation and Data Visualization with Vue
Animation can explain whatever the mind can conceive. When animation is functionally applied to a website or app, the event flow can easily map with the user's ability to navigate through the app. In the post Animating React Applications, we covered multiple ways to animate in React, including mounting and unmounting animations without explicitly using the lifecycle hooks. We were able to do this simply with ReactCSSTransitionGroup and better wit
Static Typing: Why Do It?
With the introduction of static typing to JavaScript through libraries like Flow.js and Typescript, some have found them totally unnecessary. Making the Angular2 docs default to TypeScript examples even caused more rage for people that wanted to use Angular and were not prepared to deal with a new technology or simply do not understand the benefits of static typing. There is also a tendency that you just like them without knowing why you use them
A Beginners Bible for Web Animations
There are various articles out there that index tools that can be used to perform animations on the web but they often just enlist tools without an explanation of why and when to use the listed tools. This is to serve as a guide and also a learning path for anyone looking to get into web animations the right way. You could slap redundant animations on existing websites and feel happy about that, but it usually would not give your users the best e
Animating React Applications
Animation is king in the 21st century. When you look around, you could almost see real world objects interpreting as digital animations. Ever noticed how futuristic movies have moving images in newspapers? Or the animated hologram commercials on streets? This is because businesses cannot and will not resist leveraging on the attention and attraction of humans to moving objects. Marketing has been the biggest income generator for businesses... The