Learning React Native: Week 1
When I started learning React for front end web development, I thought the abstraction towards components would confuse me and it did. For a while, it was hard to comprehend the idea of writing code for one component, and yet that component would be made n number of times. As I practiced, it became easier and I understood the in and outs of my app.
A previous coworker of mine recently connected with me because of her interest in UI/UX. Now I don’t know much about it except for the fact that most software engineers think they do the same thing as frontend engineers. Till this day, I’m still not to sure if they do BUT she provided me with an idea for an app. She wants a mobile app that she’s thought of that could be of use during this pandemic. I haven’t practiced my React.js skills in about a month and it proved to be challenging to do things I use to do but with this new challenge comes new opportunities. Nonetheless, React is not new to me but mobile app development is. So, lets give this a shot. React Native, here we go!
First thing that caught my attention is the way in which the app is ran. It’s either done on a real phone or on a simulator. Secondly, the core components differ from what I know. Instead of using “div” or “p” elements, react native replaces them with “view” and“text”.
I’ve also noticed a huge difference in styling. Things I’ve never considered before like “Is this app open to different orientations?”. Now I have to consider how my styling changes when my phone is in landscape mode and portrait mode. Also, I’ve been using flexbox to make things a bit easier but as you can see, I still need to work on honing that skill. Today was the first day I’ve actually started building out this app, just the front end.
Things I’m looking forward to explore are:
- Are there any differences with how Router Components work?
- Is there an equivalent Component for Switch and Fragment?
- Are life cycle hooks any different from React.js?
- Are controlled forms similar to those of React.js?
- What other difference I can expect? (i.e onClick == onPress)
- How do I integrate FaceID into the app?
I don’t have a set timeline as to when this should be completed but we’ll take it a day at a time. So far, I really enjoy how similar native is to react because it’s familiar. It doesn’t feel like I need to spend too much time researching documents to build out this app but I’m sure I’m speaking prematurely on that.
As always, happy coding!
