Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/hasanyahya101/brain_games_application
This Application is made using React Native to allow it to work on Android and IOS. You need several Node Modules to run this project. This project is a copy of Elevate App for Human Computer Interaction Course Project.
https://github.com/hasanyahya101/brain_games_application
elevate fast hci nuces
Last synced: 13 days ago
JSON representation
This Application is made using React Native to allow it to work on Android and IOS. You need several Node Modules to run this project. This project is a copy of Elevate App for Human Computer Interaction Course Project.
- Host: GitHub
- URL: https://github.com/hasanyahya101/brain_games_application
- Owner: HasanYahya101
- License: mit
- Created: 2023-12-24T05:34:08.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2023-12-25T11:11:33.000Z (12 months ago)
- Last Synced: 2023-12-26T07:44:43.112Z (12 months ago)
- Topics: elevate, fast, hci, nuces
- Language: JavaScript
- Homepage:
- Size: 6.13 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Brain Games Application (React Native using Expo Go)
This Application is made using React Native to allow it to work on Android and IOS. You need several Node Modules to run this project. This project is a copy of [Elevate App](https://elevateapp.com/) for Human Computer Interaction Course Project. However, i was unable to complete this project (with all features) in time. Therefore, this app only has a limited set of games. Similarly, the Assets in `assets` folder are not all used. But, i put them there just in case.
## Pre-Requisites:
You also, need `node` and `npm` installed as well as `npx`.To download `npm` use this [link](https://www.npmjs.com/package/download). To download `node`, use this [link](https://nodejs.org/en/download). However for `node`, i suggest using a version manager for `javascript`, such as `nvm` instead which you can get by following instructions given [here](https://www.freecodecamp.org/news/node-version-manager-nvm-install-guide/).
Also, you can also download `yarn`, instead of `npm`, by following instructions given [here](https://classic.yarnpkg.com/lang/en/docs/install/#windows-stable). However, i suggest using `npm`. To download `npx` enter this command in powershell or command-line after you have installed `npm`.
```cmd
npm install -g npx
```
However, if you are using `yarn`, instead of `npm`, you don't need to download `npx` as `yarn` is compatible with `npx`.
## How to Configure the Application:
Firstly, Download the Repository (you only need the `App.js` file and the `app` and `assets` folders). After that run the following command to create an expo starter project.
```
npx create-expo-app my-app // replace my-app with the name of your application
```
For example, if my app name is __BrainTrainRN__, then i will use the command:
```cmd
npx create-expo-app BrainTrainRN
```
After creating the Application Template. Go to it. For example:
```
cd my-app
// Or if you have named it something else use that name instead.
// For example, if the name is BrainTrainRN, then us this instead.
cd BrainTrainRN
```
After this run this command in the root folder to create the `node_modules` folder.
```cmd
npm install
```
Now, open the App.js in the newly created project and copy the code from `App.js` file in this Repository into it. After this copy the `app` and `assets` folders from this repositiry (with all contents) and paste them in the root folder of the newly created project. Root folder is the folder with `node_modules` folder and the `package.json` file.
After this you need to install some `npm` packages. To download them use the commands given below one by one.
```cmd
npm install @expo/[email protected]
npm install @react-native-async-storage/[email protected]"
npm install @react-native-community/[email protected]"
npm install @react-navigation/[email protected]"
npm install @react-navigation/native": "^6.1.9"
npm install @react-navigation/stack": "^6.3.20"
npm install expo
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install [email protected]
npm install react-native-web
npm install [email protected]
```
If you are using `yarn` you can download them using:
```cmd
yarn add [email protected]
```
After installing all of them check the compatibility using:
```cmd
npx expo-doctor
```
If there are any compatibility issues, uninstall the previous ones and install the new ones. For uninstalling using `npm`, use the `uninstall` command instead of `install`. For example:
```
npm uninstall package-name@version
// then install new one using
npm install package-name@new_version
```
Now, download the `Expo Go`, app on Android or use the camera app on IOS. Run the following command in Terminal:
```cmd
npx expo start
```
You can scan the given QR Code using the Expo app on android or the camera app on ios. Your app should run on your device.
## Preview:
This video is for the main Game (after logging in).
https://github.com/HasanYahya101/Brain_Games_Application/assets/118683092/03f5feb6-691a-4538-9db7-84b67947a6eb
This video is for the Authentication System. The video has been cut at parts that might contain any sensitive information.
https://github.com/HasanYahya101/Brain_Games_Application/assets/118683092/0a63a9a2-32c8-4330-a202-1baa32b90dfa