https://github.com/lintangwisesa/react_rnative_express_mongodb
Simple GET & POST app using React, React Native, Express & MongoDB
https://github.com/lintangwisesa/react_rnative_express_mongodb
expressjs mongodb nodejs react react-native
Last synced: 8 months ago
JSON representation
Simple GET & POST app using React, React Native, Express & MongoDB
- Host: GitHub
- URL: https://github.com/lintangwisesa/react_rnative_express_mongodb
- Owner: LintangWisesa
- Created: 2018-08-01T07:53:54.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2018-08-08T03:49:07.000Z (over 7 years ago)
- Last Synced: 2025-04-04T10:37:10.802Z (9 months ago)
- Topics: expressjs, mongodb, nodejs, react, react-native
- Language: JavaScript
- Homepage:
- Size: 1.35 MB
- Stars: 34
- Watchers: 2
- Forks: 12
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
#

# React :heart: React Native :yellow_heart: Express :green_heart: MongoDB
[](https://www.youtube.com/watch?v=EZNLq3SVdv4)
## __1. Setup MongoDB Database__
- Activate MongoDB server, then create a __*dojo*__ database with a __*ninja*__ collection. Don't forget to create your database user:
```bash
$ use dojo
$ db.createUser({
user: 'your_username',
pwd: 'your_password',
roles: ['readWrite', 'dbAdmin']
})
$ db.createCollection('ninja')
```
- Insert some data, as initial data, into __*ninja*__ collection:
```bash
$ db.ninja.insert([
{nama: 'Andi', usia: 22},
{nama: 'Budi', usia: 23}
])
$ db.ninja.find().pretty();
```
- __Done!__ :thumbsup:
#
## __2. Setup Node.js Backend Project__
- Clone this repo, go to __*Express_Backend*__ folder then install all dependencies:
```bash
$ git clone https://github.com/LintangWisesa/React_RNative_Express_MongoDB.git
$ cd React_RNative_Express_MongoDB/Express_Backend
$ npm i
```
- Open __*app.js*__ & edit this line to configure your database:
```javascript
var url = 'mongodb://user:password@localhost:27017/dojo';
```
- Save it, then run your backend project. It will run at __*localhost:3210*__:
```bash
$ node app
```
- __Done!__ :thumbsup:
#
## __3. Setup React Frontend Project__
- Go to __*React_Frontend*__ folder, install all dependencies then run this project:
```bash
$ cd React_RNative_Express_MongoDB/React_Frontend
$ npm i
$ npm start
```
- It will run at __*localhost:3000*__ & open in browser automatically! __Done!__ :thumbsup:
#
## __4. Setup React Native Android Project__
- Activate your __*AVD (Android Virtual Device)*__. In this project, I'm using __*Genymotion*__. It's much lighter than Android Studio's AVD.
- Go to __*RNative_Mobile*__ folder, install all dependencies then run this project:
```bash
$ cd React_RNative_Express_MongoDB/RNative_Mobile
$ npm i
$ react-native run-android
```
- __Done!__ :thumbsup:
#
__See also:__
- [React :heart: React Native :yellow_heart: Express :green_heart: MongoDB](https://github.com/LintangWisesa/React_RNative_Express_MongoDB)
- [React :heart: React Native :yellow_heart: Express :green_heart: MySQL](https://github.com/LintangWisesa/React_RNative_Express_MySQL)
- [React :heart: React Native :yellow_heart: Express :green_heart: PostgreSQL](https://github.com/LintangWisesa/React_RNative_Express_PostgreSQL)
#
#### Lintang Wisesa :love_letter: _lintangwisesa@ymail.com_
[Facebook](https://www.facebook.com/lintangbagus) |
[Twitter](https://twitter.com/Lintang_Wisesa) |
[Google+](https://plus.google.com/u/0/+LintangWisesa1) |
[Youtube](https://www.youtube.com/user/lintangbagus) |
:octocat: [GitHub](https://github.com/LintangWisesa) |
[Hackster](https://www.hackster.io/lintangwisesa)