Our brain thinks of animations imperatively. For example, to show a container (div), we want to expand the container from zero size to its full dimensions. And when we hide the container, we want to collapse the container from its full dimensions to zero size. The way we describe animations is imperative. How do we translate this to declarative way of writing code in React?…
React navigation is the suggested community package for navigation in React native apps. It has three navigators: Stack navigator, Tab navigator and Drawer navigator. There are quite a few configuration options. Overall, I find it quite useful for my needs. But, there is one area that requires a bit of work. It is about sharing data between the navigation buttons and the main app view.…
Async / await in JavaScript makes async programming look synchronous. The code for importing a row of data using async / await pattern looks like below.
async function validateAndImportRow(row) {
const isValid = await validateRow(row);
if (isValid) {
await import(row);
}
return isValid;
}
I am a late adopter of almost everything. For example, it was not until 2003 when I got my first mobile phone.…
Styled components is the new rage in the world of React. It allows to define components with accompanying style like below.
const Button = styled.a` display: inline-block; border-radius: 3px; padding: 0.5rem 0; margin: 0.5rem 1rem; width: 11rem; background: transparent; color: white; border: 2px solid white; `
The above code defines a Button component which is styled based on a link element.…
For the last 18 months, I am working from home as a professional freelancer. I have put together a mini-guide on how to become a professional freelancer in 7 steps.
Step 1: Choose a technology
Not all technologies are suitable for freelance positions. Java, C, and C# have a huge following. But most enterprises which use these programming languages prefer to do it onsite.…
CodePush is a service from Microsoft that helps improve the deployment experience of your React Native apps. React Native code has a native part (written in Objective-C or Java) and a JavaScript part (the code we write). Normally, when deploying an app to the App Store, the JavaScript code is bundled together with the compiled native code.
If there is a minor JavaScript code change, the app is recompiled and submitted to Play Store or App Store for rollout.…
Sometimes, life is not easy. And DevOps can be a pain. Strangely, it was Docker that was causing it.
Recently, I set up Jenkins for continuous integration on DigitalOcean. There are so many ways to do the same thing. And if something does not work, you try to tweak some settings to get it to work. Thankfully, there is a standard way to do things.…
Running MySQL in a Docker container is a fairly straight-forward task. In this article, I will take an opportunity to use this task to explain a few basic concepts about how Docker works.
Docker machine
The first step is to create a droplet in DigitalOcean. And then install Docker engine in it. Thankfully, docker-machine does both with a single command.
docker-machine create --driver digitalocean --digitalocean-access-token <accesstoken> mysql-droplet
We specify the driver as DigitalOcean to create our droplet.…
And why it matters to you?
Disqus comments works better than WordPress comments. It allows you to comment without having to type in your name or email. If you are like me who comments regularly, you are already logged-in to Disqus. And there is no need to login more than once. Disqus authenticates with social providers like Facebook or Gmail. So, this should look familiar to most people.…
Redux is a state management library for JavaScript apps. The core Redux library implements the flux pattern. In this post, I won’t be writing about the Redux library but the react-redux library which has the plumbing code to integrate Redux into React apps. When we use react-redux library, the plumbing code that makes it work is hidden from us. Without knowing how it works, we may not know how to optimize our apps.…