Changes

Page history
Update Project Installation authored by Doris Tam's avatar Doris Tam
Show whitespace changes
Inline Side-by-side
Project-Installation.md
View page @ aa4fa406
# 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)
- [Get logins](#get-logins)
......@@ -32,11 +31,11 @@ In order to test, make an account on a Mahara instance. In order to generate an
## 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
# Update package manager
......@@ -50,7 +49,6 @@ nodejs -v
# Verify npm installation
npm -v
```
### Install React Native CLI
......@@ -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.
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 :
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 :
1. Android SDK
2. Android SDK Platform
3. Android Virtual Device
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.
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**.
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`
-`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 the latest 30.x.x is selected.
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
# 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
### 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.
> 🌐 If you are a translator, the following steps are optional if you'd like to install the app to see your changes.
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.
> :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)
......@@ -174,7 +166,6 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork
```bash
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.
## Install and start the app (Android)
......@@ -184,9 +175,7 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork
```bash
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)
3. Alternatively, the same actions: to start the server running the app.
```bash
......@@ -215,7 +204,6 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork
#Loading dependency graph, done.
```
4. Next, on a new terminal tab/window. `cd` into the same directory as before.
## 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
# If you have not allowed USB debugging it will show
# 01234SDGESG567890 unknown
```
5. Run the app on the connected device with command:
```bash
......@@ -263,19 +250,17 @@ Make a [fork](https://docs.github.com/en/github/getting-started-with-github/fork
## Install and start the app (iOS)
In an macOS machine, open the .workspace file in XCode. Run npm install and pod install.
Select a virtual machine and build.
In an macOS machine, open the .workspace file in XCode. Run npm install and pod install. Select a virtual machine and build.
## 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.
# Contributing
Now that we have gotten Mahara mobile installed and ready to run, let's start contributing!
[Let's contribute!!! 💡](https://git.mahara.org/mahara-mobile/mahara-mobile-react-native/-/wikis/Contributing-to-Mahara-mobile)
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)
# Troubleshooting
......@@ -298,11 +283,9 @@ sudo chown $USERNAME /dev/kvm
```bash
sudo lsof -i :8081
```
- Kill those by
```bash
sudo kill -9 [insert PID]
```
- Try again
\ No newline at end of file