Project React Native App 📱

In this week's project, you'll be building your first mobile application with React Native!

It's time for your creative juices to flow like the Niagara Falls!

This week's project is a very free one. Your only restrictions are that it should be a mobile app created with React Native and using styled components. Also, the app it self should either be:

using one of the sensors of your mobile phone such as the camera, accelerometer or voice assistance etc.
using an external API to fetch something to your app and then interact with it.
a multiscreen app by using React Navigation.
a useful app such as a calculator, a stopwatch or a compass.

Other ideas that you could build 💡

step counter
photo booth
some kind of game based on shakes/tilts on the phone
camera app
a bubble level
Or maybe you remember this game!?
Fetch a bunch of cute dog photos from an api and use the share method to share it with your friends.

What you will learn 🧠

How to use React Native to create a mobile app
Practice using Styled Components for your styling.

How to get started 💪🏼

Fork this repo
Clone this repo into your projects folder on your computer
Open up VS Code
In the terminal, run npm install to install the dependencies needed
Run the react native development server by running npm start or expo start
Make sure that you have signed up to expo.io and downloaded the app to your phone.
Scan the QR code to open upp the app on your phone. Make sure that your phone and your computer is connected to the same network.

Hints and tips to complete the project 🤓

Start by investigating the React Native documentation and see what components there are and what else you can do in React Native such as making the phone vibrate, copy something to clipboard, use popup alerts.

Once you have your idea, start by sketching out what your app will look like and how you'd like to use components. Now we're using styled components, but you can still break things into small, manageable components.

After that, think about how the logic should be divided up. Are you using an API? What component should handle the fetch. Are you building a compass, how should you structure you files?

Then you're ready to start working on the project. This project has a base of what you need to get started, but if you want to use some extra libraries or packapages, such as React Navigation, you need to install it like this:

npm install --save react-navigation

When starting to write your code, try to work on the project in small chunks rather than taking on too much at once.

Requirements 🧪

You should use Styled Components.
Code follows Technigo’s code guidelines.
Contribute by helping others with this project on Stack Overflow.
Demo your app for your team.

How to hand in the code 🎯

When you’re finished with the project, push your code to GitHub with these commands:
```
git add .
git commit -m "your commit message"
git push origin master
```
Navigate to your repo and create a Pull Request into the Technigo repo
Wait for the code review from your teachers

How to get help 🆘

Ask for help and share your knowledge about this project with the 'project-react-native-app' tag on Stack Overflow. Talk to your team on Slack and help each other out. Do some research about your problem, you are surely not the first one with this problem, Google is your friend 🙂. And you can of course also book a tech call.

Stretch Goals 🏃‍♂

Make sure you've commited and pushed a version of your project before starting with the stretch goals.

Add multiple screens to your app

Add some kind of navigation in your app, either with bottomtabs or navigation backwards and forwards between screens.

Add some animations to your app

Either have a look at panResponders or take a look at how to implement animations with the help of Lottie

tehvicke / project-react-native-app Goto Github PK