DEV Community

Harshal Gangurde
Harshal Gangurde

Posted on • Updated on

I built my first React Native app

Hello Developers,

This is my first post on Dev.to and it's about a very first app I developed using React Native. It's a simple and basic calculator app which does, yes you guessed it right, simple calculations.

What I learned:

Well, this is just a basic app so I did not learn React Native in much depth. But this app helped me learn things like,

  • React Native syntax
  • A different way to style components (without using CSS files)
  • How to pass values between two different components
  • How to set component state

What I missed from the web development world:

I really missed a simple way to style buttons using React Native. React Native Button component does not have style property of its own.

(Although, I learned that you can always create a custom button using TouchableOpacity)

If anybody is interested please check out this cool calculator app here

GitHub logo zerosand1s / ReactNative-Calculator

A simple and basic calculator app using React Native

Calculator

A simple and basic calculator application using React Native.

Run the application using react-native run-ios

Check out the application images on different devices

iPhone SE

iPhone X




And this is what my calculator app looks like

iPhones SE

iPhones X

Discussion (10)

Collapse
andresefr24 profile image
andresefr24

I really recommend to use styled components. Makes styling a walk in the park, and with its theme provider you con centralize every major style statement. The syntax is good ol' css and it's plug n' play.
Give it a shot.
If you wanna get more experimental with it, i suggest that you make the provided theme a state that can be managed.

Collapse
islamgamal88 profile image
Islam Gamal

Could you please mention a good tutorial to learn styled components? And if you think it's better than css modules?

Collapse
garethbrown82 profile image
Gareth Brown

I would also recommend styled components. The getting started page on the styled components home page is a good place to start! styled-components.com/docs/basics#...

Thread Thread
zerosand1s profile image
Harshal Gangurde Author

I appreciate your recommendation Gareth. Thanks.

Collapse
kayis profile image
K (he/him)

I use glamorous-native, but I think for the next project I would stop using styling libraries all together.

I just don't have the feeling they add much value.

Collapse
zerosand1s profile image
Harshal Gangurde Author

Thanks for the recommendation, @andresefr24 . I will surely check out styled components.

Collapse
ben profile image
Ben Halpern

Congrats!

Collapse
zerosand1s profile image
Harshal Gangurde Author

Thanks, Ben.

Collapse
the24thds profile image
David Sima

Congratulations! It looks really good. I have a question about React Native. Can you use it to also build a Windows application?

Collapse
zerosand1s profile image
Harshal Gangurde Author

Thanks, David. I am not 100% sure but a quick Google search showed me this repo github.com/Microsoft/react-native-.... Check it out.