Adem Bilican is a native mobile developer based out of Zurich, Switzerland. He recently made the jump from Java and Objective-C to React Native, and shares his experience. We discuss the process of exporting custom Native Modules into your React Native project, and why that was particularly important to the apps he built that revolve around blockchain.
Follow Adem on Twitter, Instagram, and his personal site.
John: Welcome to the Duck Tapes, the podcast for duckheads. I’m your host John Haupenthal and joining me in the duck pond this week is Adem Bilican and today, he's going to talk about native modules in React Native. Adem, welcome, thank you for coming.
Adem: Hi John. Thanks for having me.
John: It's interesting you are now our third guest from Zürich, second French guest I guess from Zürich.
Adem: Indeed.
John: I guess we are getting a pretty big following over there. I wonder if I came to visit if I would need to hide from the paparazzi or is there a lot of talk on the street about Duck Tapes?
Adem: Yes, yes, definitely. You should come. We are all waiting for you here.
John: You'll be at the airport with a sign, I'm sure.
Adem: Yeah, definitely.
John: You contacted us on Twitter mentioning that you work with React Native often and that you had a background in native coding and so you wanted to discuss native modules. You also mentioned something that I think is true, which is that quite a few react native developers tend to just skip over dealing with native modules because it sort of seems scary. Why do you think that is?
Adem: Why it's scary you mean?
John: Oh, yeah. I guess why, because it's such a powerful tool but it does seem like many people don't know about it even.
Adem: Yeah, it's true. Actually, there is a nice sentence, even in the native module webpage from react native, it says, we don't expect it to be part of the usual development process, however it is essential that it exists. I really like that sentence and I think the reason why a lot of React Native developers don't know about native modules or don't use them is because most of the time they don't need it actually. They are actually using native modules without even realizing that you're using native modules but I had the chance to work on projects where it was required that I write myself my own native modules to work with.
John: What problem were you facing where you needed to use a self created native module?
Adem: It was mostly existing native code, native libraries in C or in C++ that we needed to use on the mobile site.
John: Mm-hmm (affirmative). Interesting. What is the first step? If you realize you're working on a project, on a React Native project and you realize that you're going to need to create a native module yourself because some bridge doesn't already exist, what's the steps you would take?
Adem: There are two ways I would say, the first one is if you already have an existing library you want to use in your React Native code, then you can start right away by opening your Xcode project or Android studio and just start creating your native code to begin with, or alternatively you can use a package that is called create-react-native-module that will let you create a module, a native module from scratch. The main advantage here is that you can then distribute your module via npm.
John: Oh, interesting. How much native coding knowledge would you need? Do you just kind of… because you have a background in those languages, it's a little easier for you. But for someone like myself, for example, who knows primarily Java script, is it just kind of piecemealing the little methods that you need together? I've only done one data module and it was for quite literally one function, so it was relatively basic, so I didn't need to really have much experience with Objective-C or Java. What would you say to developers that are just strict native developers?
Adem: Yeah. Okay, to be honest, it might be a tricky. The thing is sometimes it can even go beyond Objective-C or Java for the projects that I’m involved in.
John: Oh no.
Adem: Oh yeah. The projects I'm involved in, they have native libraries written in C and C++, on iOS it's really cool because you can use something that is called Objective-C++, in the city in the same file you can have Objective-C and C++ code combined. You don't need to separate them, whereas on Android it gets really tricky because with native modules you can only communicate between Java script and Java. But then you need to communicate between Java and C or C++, which requires something called JNI for Java native interface. There it gets really, really tricky, if you only need an increment function, of course just do it in JavaScript, don't go there native module way, but it can get tricky easily, even more so if you need to use native code. By native, I mean C++, not Objective-C Java, even if you have to go beyond this platform specific programming languages.
John: What challenges were you facing that you needed to go that deep into the native world? What type of app were you building?
Adem: Yeah, it all started with a blockchain project where they needed a mobile wallet and we've blockchain project. I think that's a typical example where one would need native modules because these projects, they have their own libraries usually written in C++ or they are also these days using Golang a lot because of all the cryptographic part. They have their own functions, their own signing functions, encrypting decrypting functions, and most of the time there is no existing JavaScript solution, you either-
John: Why would that be where there would be no existing JavaScript solution?
Adem: It's usually because it can be something very specific, there are two free big blockchain projects like Bitcoin or Ethereum, and then there're projects that are completely different and write their own blockchain from scratch. The blockchain itself is what we call a node, it has some specific functions and to interact with this node, there's strict rules that you have to follow. A specific signing method, encryption, decryption method that are very, very specific to that particular project, and that’s what makes this project so special. Actually, that's really all they need, if there is no existing libraries, except if the team itself created the JavaScript development libraries before.
John: Sure. Okay, I want to take a step back a little bit because I am very unfamiliar with blockchain and cryptocurrency and that whole world. I always hear the buzz words and see the articles, but I haven't taken a deep dive. I guess, could you maybe break down what blockchain is and what purpose it serves and why it is becoming so immensely popular?
Adem: Sure, with pleasure.
John: To someone that doesn't know because I definitely have no idea.
Adem: Yeah. Okay, by definition, Block chain, it's a chain of blocks, what are the blocks? The blocks are any kind of data, so that's also what we call a ledger, shared ledger. It’s keeping track of something and then being able to share this information with other people. A lot of people compare it to a database, but of course it's much more advanced than a simple database, the main principles of blockchain is that first of all, it's decentralized. Different peoples are running the blockchain on their computers so it cannot be controlled by a single entity, this is very important for blockchain project being decentralized.
Adem: The second one is that it's an immutable shared ledger, it's immutable because the chain is created by keeping track of the previous block, you always have a link between two consecutive blocks. Block two knows block one, block three knows two, four knows three and then it goes, at any time if there is someone trying to tamper with the data or to modify something, the chain is broken. You can verify this with hashing functions because hashing functions are very strict, you need the identical input to have the correct output. Even if there is a very tiny change in the input, the output of the hash is completely different and the chain is broken
John: It'll notice that what it's trying to match from the previous block is even in the slightest bit incorrect.
Adem: Exactly, exactly. That's correct. When the chain is broken, then there is no more consensus and then you know that something is wrong. It’s decentralized and public and the biggest example is of course, blockchain is used mostly for cryptocurrencies these days, but that's not the only use case. I think it makes a lot of sense in cryptocurrency, it goes back to 2009, the Satoshi Nakamoto paper about Bitcoin, where the idea was to make micro transactions easy and cheap so that I could send you a tiny amount of any cryptocurrency very easily and at a very low fee. These days it goes beyond because it's more done only for transactions, it's also used for as a shared ledger. You can keep track of everything into a blockchain, and the idea is that everybody can see what's happening, nobody can tamper with the data, and it's also a secure way of sharing all this information.
John: That is a good breakdown and interesting. With cryptocurrency, that's something else that I just can't wrap my head around. This might seem super naive and basic, but how does a cryptocurrency have value? I guess I don't even know how you would use it to pay for something. I don't understand. I'm so unfamiliar with this world.
Adem: Yeah. Okay. I don't think I will be of much help here because-
John: Okay, that’s fine.
Adem: ... it's also something. Yeah. In terms of finance, it's just the market. I mean, the demand and when the demand increases, the market follows and the price changes. That’s the only reason I can give you right now.
John: No. Yeah, that's fine. Every time I hear it I'm like, “Well, the idea sounds great, but I can't.” There's just some blocker in my head where I can't quite wrap my head around it. Okay. Then blockchain was the kind of catalyst to get you to start working with native modules in React Native, I'm curious why you came from building apps natively to working in React Native.
Adem: I started with native programming by chance, actually. It was a very simple game that I wrote for a lady here. She was writing books for kids and she wanted to digitalize it, to bring the books to the iPads and to have the book, the audio plus some additional games. She already started with a developer. He was working with native code and I just took the project over and continue with native programming. It was simple, Java for Android and Objective-C for iOS.
Adem: Then, in the meantime I just continued a bit into the animations and I used a bit Unity 3D and working with Advantage Realty. This was also something different, C-Sharp and it's also not properly native and then slowly switching to React Native. It was still very new and it all started with a startup idea we had with friends to build an on-demand laundry service, [inaudible 00:13:57]. We had two parts, the client and the service providers. At the time, I just started reading about React Native and I thought that it would be just a perfect excuse for me to try React Native and to see what I can really build with it because according to what I was reading, it was supposed to provide a faster development. For me, it was just because I needed to program two different apps. I thought, "Yeah, okay, let's give it a try." That was my really first jump into React Native.
John: What was that experience like after having to build two separate code bases for, say the book app, jumping to React Native? I mean, obviously, it probably was efficient, but were there any things you felt like you could have done better natively that React Native rendered you from doing?
Adem: I think, I always have this question in my mind and I'm still trying to find a proper answer to it, maybe I'm biased. The fact that I am so used to Native Modules for both platforms, I feel like I am not blocked by anything. I mean, I would-
John: Interesting.
Adem: ... Even without really thinking too deep, whenever I have an idea of an app or I'm just starting to get involved into a new project, I don't even ask myself, "Should I go native or React Native?" I'm just like React Native in it or some project and then start and then really think a bit later on. I usually find a solution that I can create either myself or take an existing library and play a bit with the native code so that I can make it really fit my own need. I might be biased on that situation, but I would usually by default start with React Native.
John: That's great to hear. I feel like maybe some native developers that maybe haven't tried out React Native are a little bit skeptical of how powerful it can be. Maybe, because it had sort of a rough beginning as many libraries do, but I feel like now, like you're saying, I haven't run into anything that I purely truly cannot do with some sort of thing React Native.
Adem: Yeah, not totally.
John: Then even for the one Native Module that I had to build, we just had a client who wanted to integrate with sales force and there was something that they had in a native library like you said that we needed to expose. Initially, I was petrified thinking there's no way that I could deal with Java or with Objective-C, but a couple hours later and it was working fine with React Native. It’s not that scary once you kind of dive in there and dig around.
Adem: No, no, it's amazing. Even more so, compared to other solutions like Ionic, Cordova, Flutter, I think we have this advantage that it's just clear this link between React Native and Native has never been so clear. It’s just like you can just combine both. You can use one more than the other. There is just one project where I am pure React Native and this is the starter project I mentioned, but for most of the other projects, at some point I have to deal With Native Modules and I feel comfortable with it. I don't see any way that would really stop me.
Adem: Recently, I had to use Stripe and they have this new legislation where you have this 3D secure system and there is an existing NPM library, but it's not officially supported by Stripe, it's your own risk to use it or you use their own native iOS or Android SDK. For me, it was just obvious. I just took it. I had a bit of work to do to integrate the views into the native part, but in the end it worked fine. I think for me I feel more secure in a sense that I used it the proper way I was supposed to use it instead of… I didn't do any trick or anything like that. It just works as it would work on a native project.
John: Yeah, and I think that's a good point is that sometimes you can find React Native libraries that do kind of use a little manipulation or tricks to get around, get around requirements of large corporation libraries in it. Yeah. You had to go in and actually use what they are telling you to use is great. Was that very time consuming building those native modules for Stripe or was it relatively straight forward?
Adem: No, no. For Stripe, it was even easier because you don't really build something. You really need to make the link correctly between React Native and native so that you can call UI view properly without disrupting the normal use of the app because the idea is that you just lounge an alternative screen so that you can verify your 3D code and then it comes back to the app. This one was quite easy. It was much more work for the blockchain, the cryptographic part of the project that I had.
John: Sure. How did that app turn out with the books and the stories? Did that end up coming to React Native eventually or still does it exist as a native project?
Adem: No, unfortunately not. She gave up because she had other projects going on and then she had to stop.
John: Oh, no
Adem: I loved these apps. I don't have kids yet, but I loved the apps because she was really into putting a lot of translations, you had these 10 different languages. It was really good. I loved them, but unfortunately she had to stop the project.
John: Oh no, because that, yeah. That's another one that sounds ideal for React Native as well. It’s kind of like you said, I can't think of a project where my initial reaction, gut reaction would be, "Oh this won't work in React Native." It really feels like if anything that opens doors, anything seems possible and we bring it up on the show a lot, but particularly with the reanimated library because for a while animation seemed like what was really holding React Native back because of the communication between the native thread and the UI thread. Now, that that's there and available, there's just not much that we can't do.
Adem: Yeah, no. Clearly, we see what William is doing with it.
John: He seems like he's on kind of on the bleeding edge every time. Sometimes I watch his videos and he goes so fast and I'm like, “What are you doing?”
Adem: What happened?
John: Yeah.
Adem: Those are the two things that… sorry, not that makes me wonder, but two things that I would have loved kind of, an improvement would be first of all. Some small performance issues or in general like the app size at the end, you end up off, it's not bloated, but you know this node modules I would like to sometimes to install the package you completely forget that. You don't even use it in the end, you have to clean. This kind of small things, but I think these are also getting the attention to the core team. I know and it's clear that they are working on this and it's even not a proper issue. These are just small things I would say.
John: Yeah, they're just nice to have, but yeah. When they started splitting out a lot of those libraries like AsyncStorage and kind of putting it out to the community and just making the core project a lot more lean. I think that that's helping. It feels like this next year is going to be pretty massive for the library. It seems like they have a lot of plans. They’re finally improving the docs which I am very excited about. I keep seeing the tweets about they're requesting help to go and rewriting a lot of their docs which is awesome because those have been sort of a sparse for a while. Well, you'll go to look something up and there's properties missing or just weird examples. Have you worked a lot in React Native apps with gesture handling and animations or has that been an issue for you at all?
Adem: No, usually my go-to library is just react-navigation and it was an enough for the projects I was involved in. I never had to do advanced animations or UI, UX things that would require to use a specific libraries. Even into reanimated, I'm not very comfortable yet with reanimated. Usually, I just have a different screen and it's a simple navigation that I'm used to having in these apps.
John: Even the vanilla animated library that ships with react native, that's still pretty powerful if you're just doing a simple animation. It's kind of, surprising what you can do sometimes. The only thing if we were speaking about I guess, small improvements that the responder system that comes with React Native. The pan responder is one that I am not a fan of just because if you're doing anything else while you're interacting with the gestures. If you're doing any other calls in the app icon, it kind of falls apart. That’s my one complaint, react native but gesture handler takes care of it.
Adem: If you hear it.
John: Yeah. Yeah, if anybody's listening to this. I remember seeing some talk where they were… I don't know where it is in the roadmap but there were some big improvement were going to have between the Native thread and the JavaScript thread interaction. I'll try to link it in the show notes but there was some, kind of, exciting news coming down the pipe so that should be interesting. What do you have? What are you working on now? Blockchain stuff pretty much all the time?
Adem: Yes, yes, yes. I'm really into the combination, blockchain plus React Native and this is also something really cool. There are a lot of big companies that are into blockchain that are using React Native for their production apps. This is something that clearly shows us that there is no more proper distinction or... we are talking about projects that needs to be highly secure, we are talking about people's money, the storage they use, the iOS keychain or the Android shared preferences with encryption, decryption. This is very important finger, touch ID, face ID for security. That’s really what also still keeps me working with react native because it's just, clear. I mean, people in this topic, in the blockchain domain, they're using React Native more and more.
Adem: What I am doing, my daily tasks, usually I'm working on different projects. I am a freelancer on different blockchain related projects and for most of them, it's mobile wallets that lets users send and receive the cryptocurrency of the project. Plus, I also worked with a social media platform that was using the blockchain. It’s called Sapia Network and it's a pretty cool project where you use the blockchain not only for transactions. They also have their own token, a utility token that you can kind of collect. If you create good content, you collect from this token which makes you a good content creator and the whole system helps to control trolls and also fake news. Just, this system of using the utility token is really powerful for this social media networks.
John: That's an interesting use case for blockchain. I never would have considered that. Speaking of social media, your Instagram feed, those pictures are straight out of a catalog.
Adem: Oh, wow. Thank you.
John: They're so nice looking. Every time I look at your feed, I want to buy a new monitor or a plant for my desk or something. They look like they're professionally shot. That’s a checkout.
Adem: Oh, thank you.
John: We'll link to your feed too. Yeah. I was surprised that you obviously put a lot of care into that. When you are working with your blockchain and React Native consulting, have you considered creating your own library that exposes some of that stuff or is it all so specific to the app that you're making that that wouldn't make any sense?
Adem: It is very specific. I mean, for example, I'm involved in the QRL project. It’s the Quantum Resistant Ledger project where the ID is to create this blockchain that is quantum resistant. Even there, the library of the project is called QRL Lib. The library itself is very specific to the project itself and that's what makes the project so special. It's the library and that's what I meant also earlier where there is no existing JavaScript solutions because this project really invented this type of combination of cryptographic algorithms to make this project real and working. There are existing JavaScript libraries for Bitcoin, Etherium, the big ones because these are now considered standards so you can already install them. I think it's called Bitcoin JS, NPM install BitcoinJS and then you can start using it out of the box but it's not the case for the project I'm involved in.
John: What does quantum resistant mean? It sounds like it's from the future.
Adem: It is. It is.
John: Yeah. I guess that's true. It'll be out soon. Yeah, that that sounds so interesting.
Adem: The idea is that for Bitcoin and most of the blockchain technologies out there, they are using the ECDSA algorithm. It’s elliptical curve algorithm that creates from random numbers, you get a private key and then you can generate a public key out of it. There is no way to go back from the public key to the private key. The private key is really what you have to keep secret. With normal computers these days, you cannot go back. You cannot find out what was the public private key associated with this public key. The idea is that with quantum computers, you'll be able to break this algorithm. This is also true for HTTPS, for a lot of things that we use daily not only blockchain because quantum computers use qubits instead of bits.
Adem: You have this 01 and you have a 01 state combined, that’s what makes them really powerful. They’re still lab level computers, you cannot use them at home. I mean, they really need a lot of care attention but it's coming. Recently, Google announced they reached quantum supremacy meaning that they were able to beat a normal computer in a specific algorithm with a quantum computer but we are still far from using quantum in our daily lives, that’s clear.
John: Yeah. Quantum supremacy sounds like a sci-fi horror movie.
Adem: Yeah, yeah, yeah, it is. It really sounds like it.
John: That is so funny. Let's see if I have any other blockchain or... I think that is it. We do have a new popular segment on the show. It's been around now for just two episodes. It’s gaining popularity called quack, quack, give me a track, which is where you need to give me one song to put on the official duct tapes playlist that is coming to Spotify. By the time this episode comes out, it'll be on Spotify. If you had to give me one song and you can send it. Well, it'd be nice if you had the title now. You can send it later if you like but what would you choose?
Adem: One song that would come out in the podcast [crosstalk 00: 00:30:52].
John: It's going to-
Adem: I missed that.
John: No, we're going to add it. We're going to, sorry. Yeah. We’re going to start a playlist on Spotify and then every guest is going to add a song to it.
Adem: Oh, okay. Let's go for Tarkan. You know Tarkan?
John: What is it? I don’t, no. Who's this?
Adem: It's a very cliché Turkish, he's a Turkish singer, very, very famous actually, well, apparently not that famous but he's-
John: Well, I might not be that worldly. I think that's the answer here.
Adem: At some point, it was very cliché. Every Turkish people in Europe we're just called Tarkan. Maybe we can go with a Tarkan song.
John: Okay. Yeah, yeah. Send me the song that you want to put on and then we're going to have the link to the playlist and all the show notes. I really appreciate you coming on. Where would you like to send people? Where should they follow you? Where can they find you?
Adem: Yeah. I'm trying to be quite active on social media. As you said, on Instagram and also on Twitter. I have the same username sites, ademcan_ net.
John: That's Adem with an E?
Adem: Yes, correct. A-D-E-M-C-A-N. I'm trying to share a lot of sites. I have a blog, ademcan.net where I'm trying to share, not as often as I would like to. Actually, writing some blog post about React Native, some tips and tricks. For example, I'm writing a blog post about this Stripe and how I use the Stripe 3DS in React Native because I couldn't find anything. I had to do it ourselves. I thought it would also be very helpful for other developers.
John: Absolutely, I think so.
Adem: And then, I'd be happy to-
John: All right. We'll follow you there on Twitter, on Instagram, definitely check out Adem's Instagram guys because it's like an IKEA Catalog and then ademcan.net. Follow me or follow the Duct Tapes, ducktapesfm, Instagram and Twitter. When we started this podcast, I found it much more challenging than I'd anticipated to consistently put out posts on social media. I thought it would be nothing but finding things that are kind of relevant and interesting to say. At least for me, it has been more of a challenge than I expected.
Adem: Yeah, I know. I do have this exact same struggle. I feel like I have so many things I could share. Then, when you're in front of your Twitter or Instagram, you're like, “Oh, what am I going to say or share?”
John: Yeah, yeah.
Adem: Is it what you're worth?
John: I have already said this 1000 times or should I? Am I just repeating myself now?
Adem: You’re just going to check your own profile to be sure that you're not saying it again and again.
John: Yeah. I just retweet myself. That's all I do. All right, Adem. We really appreciate you coming on.
Adem: Thank you very much.
John: I'll send you some notes about when this is coming out and we'll have all. Everything we've talked about will be linked in the show notes, everybody check that out.
Adem: Thank you very much.
John: I really appreciate it.
Adem: Thanks. Thanks for having me.
John: All right, thanks. Talk to you later.
Adem: Thank you.
John: All right.
Speaker 3: Powered by Vincit, quack, quack.
