search

Malawi-DCCMS / weather-app

An app to show the weather.
0 stars 0 forks source link

readme

Weather App

This is a React Native project, bootstrapped using @react-native-community/cli.

Getting Started

Note: Make sure you have completed the React Native - Environment Setup instructions till "Creating a new application" step, before proceeding.

Install at least version v20.9.0 of node before proceeding.

Step 0: Download the code

git clone git@github.com:Malawi-DCCMS/weather-app.git
cd weather-app

Step 1: Start the Metro Server

First, you will need to start Metro, the JavaScript bundler that ships with React Native.

To start Metro, run the following command from the root of your React Native project:

# this will take a long time when starting from a newly cloned repo
npm install
npm start

Step 2: Start your Application

You can now press i or a to run the app in a simulator OR run the simulator in a separate terminal, like so:

Let Metro Bundler run in its own terminal. Open a new terminal from the root of your React Native project. Run the following command to start your Android or iOS app:

For Android

npm run android

For iOS

npm run ios

If everything is set up correctly, you should see your new app running in your Android Emulator or iOS Simulator shortly provided you have set up your emulator/simulator correctly.

This is one way to run your app — you can also run it directly from within Android Studio and Xcode respectively.

Step 3: Modifying your App

Now that you have successfully run the app, let's modify it.

  1. Open App.tsx in your text editor of choice and edit some lines.

  2. For Android: Press the R key twice or select "Reload" from the Developer Menu (Ctrl + M (on Window and Linux) or Cmd ⌘ + M (on macOS)) to see your changes!

    For iOS: Hit Cmd ⌘ + R in your iOS Simulator to reload the app and see your changes!

Congratulations! :tada:

You've successfully run and modified your React Native App. :partying_face:

Now what?

Troubleshooting

If you can't get this to work, see the Troubleshooting page.

Building your app

Build a debug APK

First:

npx react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

For immediate app testing and debugging, you can build a debug APK. The debug APK is signed with a debug key provided by the SDK tools. Open your project in Android Studio and follow these steps:

  1. Click Build > Build Bundle/APKs
  2. In the dropdown menu select Build APK(s)

Android Studio will start the build task and take a moment. After it is done you'll get a notification. You can now found the built apk at app/build/outputs/apk/debug/app-debug.apk

To learn more about building APKs using Android Studio please go here.

Building for release

  1. Make sure you don't have any garbage in the android folder.
  2. Update versionCode in android/app/build.gradle.
  3. Click Build > Generate signed bundle/APK - and follow instructions.

Make sure to test everything on a physcal phone before you release to the public!

Learn More

To learn more about React Native, take a look at the following resources: