Hi guys, hope you are doing well with all this unprecedented situation we are living over the past months. In this post I want to discuss my thoughts and feelings that emerged through the coronavirus situation, the mandatory quarantine, and the change of our daily (and not only) lives.

How it started for me — way before the quarantine

It’s still 2019 and I’m hearing about a new virus that has emerged in China; a virus that belongs to the category of Severe Acute Respiratory Syndrome (SARS). As a films and documentaries’ aficionado, I had recently watched an episode of a known TV network where the interviewed experts including Bill…


React Native articles are back!

Hi friends! And welcome back to the continuation of the technical React Native articles! Unfortunately I ’ve been away from posting new articles for quite some time now as I was bootstrapping my own services company. But this is about to change today onwards!

Also, within the next weeks/months, we will be publishing quite some content on both technical and non technical subjects under our new Medium publication! I’m excited to be back on writing articles and I really hope you will enjoy them as well! As always if you have suggestions, shoot an email at social@codedlines.com or post at…


This story is part of a series where I am sharing my experiences on React Native, hoping it will prove useful to the React Native community and provide helpful insights. For app development enquiries check us out or contact me here.

Image 1: Abstract smartphone image that changes orientation gradually

Why lock application orientation mode?

Many applications have their User Interface (UI) designed to contain a lot of elements. To have these applications change their orientation (i.e. from portrait to landscape), it would mean that users will have a bad UI experience and also a lot of scrolling to deal with. A typical example of that case is games.

In these cases, app creators…


Image 1: Abstract image with React logo

If you are new to the React Native world, there are some pitfalls that you probably want to avoid while in some other cases you will have to make choices upfront maybe without knowing how important they are.

Below I have compiled a list of best practices from my personal experience, which I hope you will find useful :-)

Use Expo-Kit only if you know exactly what you are doing

Expo is a free and open source tool-chain for React Native. It’s probably the best kit out there for React Native apps, but it comes with limitations.

Use Expo:

  • If you want a quick playground and not to build your app’s repository. …


Image 1: Abstract image of mobile apps’ launch icons

Launch icon! A simple task, that can become a painful problem/challenge if we don’t know exactly what to do. What we need to implement here, is a two step process for each one of the native platforms:

  1. Prepare launch icons with proper dimensions for all the possible screen sizes (i.e. iPhone SE, iPhone 7, iPhone X etc)
  2. Place them inside the native app folder and replace the existing default ones.

And of course repeat both steps for the remaining native platform (i.e. Android)

But well, if it is your first React Native app and you come from a web developer…


This story is part of a series where I am sharing my experiences on React Native, hoping it will prove useful to the React Native community and provide helpful insights. For app development enquiries check us out or contact me here.

Season 2 is here!

Hi friends! And welcome back to the 2nd season of building with react native series! During this season we will explore together more parts of our beloved technology, while occasionally I will write posts in React Native Training publication as well.

Navigation options in React Native

Image 1: Abstraction about navigation in React Native apps

Navigation is a chapter that has “troubled” RN developers for some time now. Actually, it still troubles us.


Image 1: Preparing for an in-app purchase

In-app purchases! A way, among others, to make money from your mobile application. Probably not the cheapest option out there, in terms of 3rd party commission, but it stands out as a native option for your apps.

Let’s get started

In order to make payments work there is a 2 step process we need to follow:

  1. Configure the in-app product in Google Play Developers’ Console and choose the type of charge (one time fee or recurring subscription) along with its cost.
  2. Code it inside the app with the help of a bridge package like react-native-billing

Let’s move on and see how to configure…


This story is part of a series where I am sharing my experiences on React Native, hoping it will prove useful to the React Native community and provide helpful insights. For app development enquiries check us out or contact me here.

Season Finale

Today I am posting my final article for this season. I really enjoyed writing React Native related articles during the past 5 months and I will return in September with more posts!

What would you like to see next? More React Native posts or something new? How about something not so technical? Maybe talk about the problems that arise…


Image 1: The multiple screen sizes that a responsive design should cover

Responsive UI is definitely an important part of web and mobile development. When I started working with React Native more than a year ago, I discovered the hard way that there is no functionality out of the box to support responsiveness.

The goal of this article is to show a complete solution that scales RN UI to all sizes and types of screens (phones, tablets etc) and also supports UI scaling even when the app changes orientation.

How React Native works and what are the problems

React Native style properties accept either percentage or independent pixel (dp) values.

Percentage

Percentage is what we know from “normal” web development. The problem…


This story is part of a series where I am sharing my experiences on React Native, hoping it will prove useful to the React Native community and provide helpful insights. For app development enquiries check us out or contact me here.

What is AsyncStorage

Image 1: mobile and tablet devices powered by React Native

AsyncStorage is React Native’s API for storing data persistently over the device. It’s a storage system that developers can use and save data in the form of key-value pairs. If you are coming from a web developer background, it resembles a lot like localStorage browser API.

AsyncStorage API is asynchronous, so each of its methods returns a Promise object…

Tasos Maroudas

❤ React Native. Part time blogger. CTO & Founder of Coded Lines Ltd

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store