Skip to main content

Posts

Showing posts from June, 2021

Achieving the iOS “glass” blur with React Native

Written By: Aryan Mittal Perhaps the most common component in every mobile app is the header. It tells your user where they are in your app, and it’s at the very top of the screen. So, it’s crucial to have a polished and native-feeling header in your React Native apps. I use the React Navigation library for Voluntime ’s mobile app, and I wanted to achieve the iOS “frosted glass” blur effect that Apple is known for. Most of Apple’s iOS apps utilize the blurred header, including Settings, the App Store, Notes, and Reminders. It gives the user a hint about what’s hiding behind the header, and it makes the app feel polished and thought out. Since I was using React Navigation, I started by searching for “react navigation blurred header” on Google. The results recommended writing your own custom header or installing additional libraries to achieve the blur effect. This wasn’t something I wanted to do for such a small change, so I dug deeper into React Navigation’s documentation. Finally, aft

React - Uncaught TypeError: destroy is not a function

Written by Aryan Mittal While experimenting with useEffect hooks in React and React Native, I came across the following error: Uncaught TypeError: destroy is not a function and my app was unable to run. After debugging and searching around, I found the cause and how to solve it. A simplified version of my code looked like this: The key here is that myFunction is async and the shorthand arrow function syntax I used. The reason the simple code above was crashing my app is due to how the useEffect hook, async functions, and the shorthand arrow function syntax works. One feature of the useEffect hook is a cleanup function. If you return anything from the useEffect hook function, it must be a cleanup function. This function will run when the component unmounts. This can be thought of as roughly equivalent to the componentWillUnmount lifecycle method in class components. In JavaScript, functions marked with the async keyword enable the use of the await feature, which lets developers paus

AWS vs. Google Cloud Services: Which one should you use?

Which is the better option?  Written by Siddhanth Kumar The database is a crucial component of most modern software applications. A database allows you to store and manage information in a table format. Moreover, database systems can be hosted on dedicated servers in the cloud, allowing anybody to access them from their local machine. A cloud database can open up opportunities for account systems due to user information being associated with their credentials rather than being stored locally. Luckily, developers are in luck! Big tech companies have created cloud-based database services to allow developers to use databases without too much hassle and personal setup. For developers currently looking to use a cloud database service, two major options exist Google’s Firebase and Amazon Web Services (AWS) DynamoDB. In this article, I’ll be reviewing 3 of the most database-related tasks necessary for most modern applications and compare AWS services against Google Cloud Services. User A

What’s New in React 17: No New Features?

  What’s New in React 17: No New Features? Written by Aryan Mittal Over two years after React 16 was launched, the long-awaited React 17 was released in October 2020. While the update introduced numerous great changes as always, this release is unique because it contains no new developer-facing features. While React 16 added significant features like Hooks and the Context API, React 17 is mostly considered a stepping stone to ease the transition to future releases. More specifically, the primary purpose of the update was to enable gradual React upgrades. When you upgrade from React 15 to 16 (or, this time, from React 16 to 17), you would usually upgrade your whole app at once. This works well for many apps, but it can get increasingly challenging if the codebase was written more than a few years ago and isn’t actively maintained. And while it’s possible to use two versions of React on the page, until React 17 this has been fragile and caused problems with events. The React team has fix