Update Project Installation authored by Doris Tam's avatar Doris Tam
# Getting setup on Linux # Getting setup on Linux
> *Already have Mahara mobile environment installed? **[Contribute!](#contributing) ✨*** > _Already have Mahara mobile environment installed? _[**_Contribute!_**](#contributing)**_ :sparkles:_**
- [Getting setup on Linux](#getting-setup-on-linux) - [Getting setup on Linux](#getting-setup-on-linux)
- [Get logins](#get-logins) - [Get logins](#get-logins)
...@@ -32,11 +31,11 @@ In order to test, make an account on a Mahara instance. In order to generate an ...@@ -32,11 +31,11 @@ In order to test, make an account on a Mahara instance. In order to generate an
## Installing dependencies ## Installing dependencies
Install *Node*, the *React Native command line interface*, a *JKD*, and *Android Studio*. Install _Node_, the _React Native command line interface_, a _JKD_, and _Android Studio_.
### Install Node 15 or newer ### Install Node 18 or newer
Follow the [installation instructions for your Linux distribution](https://nodejs.org/en/download/package-manager/) to install Node 15 or newer. Follow the [installation instructions for your Linux distribution](https://nodejs.org/en/download/package-manager/) to install Node 18 or newer.
```bash ```bash
# Update package manager # Update package manager
...@@ -50,7 +49,6 @@ nodejs -v ...@@ -50,7 +49,6 @@ nodejs -v
# Verify npm installation # Verify npm installation
npm -v npm -v
``` ```
### Install React Native CLI ### Install React Native CLI
...@@ -102,32 +100,25 @@ Note: you may need to run `sudo apt-get install -y libfuse2` ...@@ -102,32 +100,25 @@ Note: you may need to run `sudo apt-get install -y libfuse2`
Setting up your development environment can be somewhat tedious if you're new to Android development. If you're already familiar with Android development, there are a few things you may need to configure. In either case, please make sure to follow the next few steps carefully. Setting up your development environment can be somewhat tedious if you're new to Android development. If you're already familiar with Android development, there are a few things you may need to configure. In either case, please make sure to follow the next few steps carefully.
1. **Install Android Studio** 1. **Install Android Studio** [Download and install Android Studio.](https://developer.android.com/studio/index.html) Choose a "Custom" setup when prompted to select an installation type. Make sure to check the boxes next to all of the following :
[Download and install Android Studio.](https://developer.android.com/studio/index.html) Choose a "Custom" setup when prompted to select an installation type. Make sure to check the boxes next to all of the following :
1. Android SDK 1. Android SDK
2. Android SDK Platform 2. Android SDK Platform
3. Android Virtual Device 3. Android Virtual Device
2. **Install the Android SDK** 2. **Install the Android SDK**
Android Studio installs the latest Android SDK by default. Building a React Native app with native code, however, requires the Android 11 SDK in particular. Additional Android SDKs can be installed through the SDK Manager in Android Studio. Android Studio installs the latest Android SDK by default. Building a React Native app with native code, however, requires the Android 11 SDK in particular. Additional Android SDKs can be installed through the SDK Manager in Android Studio.
The SDK Manager can be accessed from the "Welcome to Android Studio" screen. Click on "Configure", then select "SDK Manager". The SDK Manager can be accessed from the 'Welcome to Android Studio' screen. Click on 'Configure', then select 'SDK Manager'.
> The SDK Manager can also be found within the Android Studio "Preferences" dialog, under **Appearance & Behavior** → **System Settings** → **Android SDK**. > The SDK Manager can also be found within the Android Studio "Preferences" dialog, under **Appearance & Behavior** → **System Settings** → **Android SDK**.
Select the "SDK Platforms" tab from within the SDK Manager, then check the box next to "Show Package Details" in the bottom right corner. Look for and expand the Android 11 entry, then make sure the following items are checked: Select the 'SDK Platforms' tab from within the SDK Manager, then check the box next to 'Show Package Details' in the bottom right corner. Look for and expand the Android 11 entry, then make sure the following items are checked:
- `Android SDK Platform 30` -`Intel x86 Atom_64 System Image` or `Google APIs Intel x86 Atom System Image`.
- `Android SDK Platform 30` Next, select the 'SDK Tools' tab and check the box next to 'Show Package Details' here as well. Look for and expand the 'Android SDK Build-Tools' entry, then make sure that the latest 30.x.x is selected.
-`Intel x86 Atom_64 System Image` or `Google APIs Intel x86 Atom System Image`.
Next, select the "SDK Tools" tab and check the box next to "Show Package Details" here as well. Look for and expand the "Android SDK Build-Tools" entry, then make sure that latest 30.x.x is selected. Finally, click 'Apply' to download and install the Android SDK and related build tools.
3. **Configure the ANDROID_HOME environment variable** The React Native tools require some environment variables to be set up to build apps with native code.
Finally, click "Apply" to download and install the Android SDK and related build tools.
3. **Configure the ANDROID_HOME environment variable**
The React Native tools require some environment variables to be set up to build apps with native code.
```bash ```bash
# Check which bash file you are using with # Check which bash file you are using with
...@@ -163,8 +154,9 @@ Setting up your development environment can be somewhat tedious if you're new to ...@@ -163,8 +154,9 @@ Setting up your development environment can be somewhat tedious if you're new to
### Forking the GitHub repository (community contributors) ### Forking the GitHub repository (community contributors)
Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork-a-repo) of <https://github.com/MaharaProject/mahara-mobile-react-native> to your own GitHub account. Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork-a-repo) of https://github.com/MaharaProject/mahara-mobile-react-native to your own GitHub account.
> 🌐 If you are a translator, the following steps are optional if you'd like to install the app to see your changes.
> :globe_with_meridians: If you are a translator, the following steps are optional if you'd like to install the app to see your changes.
### Clone project into your local directory (maintainers) ### Clone project into your local directory (maintainers)
...@@ -174,7 +166,6 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork ...@@ -174,7 +166,6 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork
```bash ```bash
git clone https://git.mahara.org/mahara-mobile/mahara-mobile-react-native.git git clone https://git.mahara.org/mahara-mobile/mahara-mobile-react-native.git
``` ```
3. If you execute the command: `ls`, you should be able to see there is a `mahara-mobile-react-native` folder there. 3. If you execute the command: `ls`, you should be able to see there is a `mahara-mobile-react-native` folder there.
## Install and start the app (Android) ## Install and start the app (Android)
...@@ -184,9 +175,7 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork ...@@ -184,9 +175,7 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork
```bash ```bash
cd mahara-mobile-react-native/MaharaMobile/ cd mahara-mobile-react-native/MaharaMobile/
``` ```
2. Follow through steps in [README](https://git.mahara.org/mahara-mobile/mahara-mobile-react-native/-/blob/main/README.md) 2. Follow through steps in [README](https://git.mahara.org/mahara-mobile/mahara-mobile-react-native/-/blob/main/README.md)
3. Alternatively, the same actions: to start the server running the app. 3. Alternatively, the same actions: to start the server running the app.
```bash ```bash
...@@ -215,7 +204,6 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork ...@@ -215,7 +204,6 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork
#Loading dependency graph, done. #Loading dependency graph, done.
``` ```
4. Next, on a new terminal tab/window. `cd` into the same directory as before. 4. Next, on a new terminal tab/window. `cd` into the same directory as before.
## Run the app on a device/emulator ## Run the app on a device/emulator
...@@ -253,7 +241,6 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork ...@@ -253,7 +241,6 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork
# If you have not allowed USB debugging it will show # If you have not allowed USB debugging it will show
# 01234SDGESG567890 unknown # 01234SDGESG567890 unknown
``` ```
5. Run the app on the connected device with command: 5. Run the app on the connected device with command:
```bash ```bash
...@@ -263,19 +250,17 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork ...@@ -263,19 +250,17 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork
## Install and start the app (iOS) ## Install and start the app (iOS)
In an macOS machine, open the .workspace file in XCode. Run npm install and pod install. In an macOS machine, open the .workspace file in XCode. Run npm install and pod install. Select a virtual machine and build.
Select a virtual machine and build.
## React native ## React native
Follow official docs: <https://facebook.github.io/react-native/docs/getting-started.html>. Follow official docs: https://facebook.github.io/react-native/docs/getting-started.html.
This is because the installation process changes a lot, and we can't keep these docs up to date. This is because the installation process changes a lot, and we can't keep these docs up to date.
# Contributing # Contributing
Now that we have gotten Mahara mobile installed and ready to run, let's start contributing! Now that we have gotten Mahara mobile installed and ready to run, let's start contributing! [Let's contribute!!! :bulb:](https://git.mahara.org/mahara-mobile/mahara-mobile-react-native/-/wikis/Contributing-to-Mahara-mobile)
[Let's contribute!!! 💡](https://git.mahara.org/mahara-mobile/mahara-mobile-react-native/-/wikis/Contributing-to-Mahara-mobile)
# Troubleshooting # Troubleshooting
...@@ -298,11 +283,9 @@ sudo chown $USERNAME /dev/kvm ...@@ -298,11 +283,9 @@ sudo chown $USERNAME /dev/kvm
```bash ```bash
sudo lsof -i :8081 sudo lsof -i :8081
``` ```
- Kill those by - Kill those by
```bash ```bash
sudo kill -9 [insert PID] sudo kill -9 [insert PID]
``` ```
- Try again - Try again
\ No newline at end of file