React Native Hackathon
To ship your first app, you should have completed all the previous challenges: foundations, data management, ecosystem, navigation and releases.
Today's challenge is to build an application. You can use an external API, which you can find in the resource section, or use local data (e.g. a music player with a
Here is a list of ideas for inspiration:
- Rick and Morty episode tracker with rickandmortyapi
- A video game collection companion app with igdb
- A weather application called "Umbrella or Not" with the api open-meteo
And some working examples:
- Product Hunt clone with Hasura by @MatthysDev
- Machine Learning mobile application by @flexbox
Getting Started on the Hackathon day
Don't jump into coding right away; take 30 minutes to an hour to plan what you need to accomplish by the end of the day. At the end, you should have a functioning application. Keep it concise.
Focus on one feature, but make sure it's done well 😀.
- Choose a UI framework
- Select an external API
- Open excalidraw to assemble a plan of your screens
React Native UI frameworks
Time to code
Now that you have a plan, it's time to start coding. You should have a basic understanding of the React Native library. Good luck and have fun!
- Run the CLI
# Vanilla React Native npx react-native init awesome-app npx ignite-cli new awesome-app # Expo-powered yarn create expo-app --template npx create-react-native-app npx ignite-cli new awesome-app --expo # Scaffold React Native libraries npx create-react-native-library react-native-awesome-lib
- Use a
curlto save local
.jsondata (to render simple components if you encounter issues to connect the api.)
- Fetch data over the network with
- Before the end of the day, ship your app to your expo account with
Hint: If you want to know how to add and API with an auth token, have a look at this PR to add
.env and Authorization token with
🚀 Spread The World
Once you have a functioning application, it's time to share it with the world. You can do this through online platforms like GitHub, Expo, and other app stores. You can also share it with friends and family, or use it for yourself.
The fastest way for now is to use the expo Go feature
expo login expo publish
Sharing your app is an essential step for any developer, so don't forget to take the time and make sure it's done correctly.
If you want guidance and feedback on your app, I would be more than happy to provide it live on my Twitch channel. I stream every week. To schedule a session, contact me on Twitter or send me an email.
Feel free to open a pull request! Edit this file with your app example on the Ideas section.