Skip to content

Commit 92b18aa

Browse files
committed
initial commit
0 parents  commit 92b18aa

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

57 files changed

+3006
-0
lines changed

.DS_Store

6 KB
Binary file not shown.

.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
node_modules
2+
yarn.lock

.npmignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
node_modules
2+
yarn.lock

README.md

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
### [React Native Web](https://github.com/necolas/react-native-web) Project Generator
2+
3+
This app works on React Native (iOS, Android, AppleTV) and web.
4+
5+
## To get started, install the create-rn-web-app cli globally
6+
```
7+
npm i -g create-rn-web-app
8+
```
9+
10+
## To create a new React Native Web app
11+
12+
1. Run create-rn-web-app <projectName>
13+
```
14+
create-rn-web-app MyProject
15+
```
16+
17+
18+
![cli](https://i.imgur.com/tjpjUlU.jpg)
19+
20+
21+
### To run on web:
22+
23+
1. Run npm run web
24+
```
25+
npm run web
26+
```
27+
28+
This starts the webpack server.
29+
30+
2. Open localhost:8080 in your browser to view the app.
31+
32+
### Building for React Native (iOS, Android, AppleTV)
33+
34+
iOS: Run react-native run-ios
35+
```
36+
react-native run-ios
37+
```
38+
39+
This start the packager as well as the iOS simulator.
40+
41+
Android: Run react-native run-android
42+
```
43+
react-native run-android
44+
```
45+
46+
This start the packager as well as the Android emulator.
47+
48+
Use the command line, Xcode or Android Studio to build and deploy the native app code just like you would with any other React Native project.

bin/build.js

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
#!/usr/bin/env node
2+
3+
require('shelljs/global');
4+
const paths = require('path');
5+
const fs = require('fs');
6+
const figlet = require('figlet');
7+
const chalk = require('chalk');
8+
const execSync = require('child_process').execSync;
9+
const spawn = require('cross-spawn');
10+
11+
function shouldUseYarn() {
12+
try {
13+
execSync('yarnpkg --version', { stdio: 'ignore' });
14+
return true;
15+
} catch (e) {
16+
return false;
17+
}
18+
}
19+
20+
const installPackages = () => {
21+
console.log(chalk.white.bold('Installing Packages'));
22+
return new Promise((resolve, reject) => {
23+
let command;
24+
let args = ['install'];
25+
26+
if (shouldUseYarn()) {
27+
command = 'yarn';
28+
} else {
29+
command = 'npm';
30+
}
31+
32+
const child = spawn(command, args, { stdio: 'inherit' });
33+
child.on('close', code => {
34+
if (code !== 0) {
35+
reject({
36+
command: `${command} ${args.join(' ')}`
37+
});
38+
return;
39+
}
40+
resolve();
41+
})
42+
})
43+
}
44+
45+
const build = (appName) => {
46+
cp('-r', __dirname + '/../src/.', appName);
47+
console.log('----------------------------------------------------------');
48+
figlet.text('React Native Web', {
49+
horizontalLayout: 'default',
50+
verticalLayout: 'default'
51+
}, function(err, data) {
52+
if (err) {
53+
return;
54+
}
55+
console.log(data);
56+
console.log('----------------------------------------------------------');
57+
console.log(chalk.cyan.bold('Welcome to React Native Web'));
58+
console.log('----------------------------------------------------------');
59+
cd(appName);
60+
installPackages().then(() => {
61+
console.log(chalk.white.bold('Let\'s get started'));
62+
console.log(chalk.cyan('cd into the newly created ' + appName + ' directory'));
63+
console.log('----------------------------------------------------------');
64+
console.log(chalk.white.bold('For Web'));
65+
console.log(chalk.cyan('Step 1. npm run web'));
66+
console.log(chalk.black.bold('This starts the webpack dev server and serves up index.web.js'))
67+
console.log(chalk.cyan('Step 2. Open localhost:8080 in your browser to view the app.'));
68+
console.log('----------------------------------------------------------');
69+
console.log(chalk.white.bold('For React Native'));
70+
console.log(chalk.cyan('iOS: run react-native run-ios'));
71+
console.log(chalk.black.bold('This starts the packager and runs the iOS simulator.'))
72+
console.log(chalk.cyan('android. run react-native run-android'));
73+
console.log(chalk.black.bold('This starts the packager and runs the android emulator.'))
74+
console.log('----------------------------------------------------------');
75+
})
76+
.catch(error => {
77+
console.log(chalk.red('An unexpected error occurred'))
78+
console.log(chalk.red(error));
79+
});
80+
});
81+
}
82+
83+
module.exports = build;

bin/cli.js

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
#!/usr/bin/env node
2+
3+
const program = require('commander')
4+
const spawn = require('child_process').spawn;
5+
const package = require('../package.json');
6+
const chalk = require('chalk');
7+
8+
const build = require('./build');
9+
10+
program
11+
.version(package.version)
12+
.usage('<keywords>')
13+
.parse(process.argv);
14+
15+
if (program.args.length > 0) {
16+
spawn(build(program.args[0]), { shell: true, stdio: 'inherit' });
17+
} else if (program.args.length < 1) {
18+
console.log(chalk.red('Please supply a name for your new React Native Web app.'));
19+
}

bin/npm-debug.log

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
0 info it worked if it ends with ok
2+
1 verbose cli [ '/Users/naderdabit/.nvm/versions/node/v6.9.1/bin/node',
3+
1 verbose cli '/Users/naderdabit/.nvm/versions/node/v6.9.1/bin/npm',
4+
1 verbose cli 'publish' ]
5+
2 info using [email protected]
6+
3 info using [email protected]
7+
4 verbose publish [ '.' ]
8+
5 silly cache add args [ '.', null ]
9+
6 verbose cache add spec .
10+
7 silly cache add parsed spec Result {
11+
7 silly cache add raw: '.',
12+
7 silly cache add scope: null,
13+
7 silly cache add escapedName: null,
14+
7 silly cache add name: null,
15+
7 silly cache add rawSpec: '.',
16+
7 silly cache add spec: '/Users/naderdabit/opensource/create-xp-app/bin',
17+
7 silly cache add type: 'local' }
18+
8 error addLocal Could not install /Users/naderdabit/opensource/create-xp-app/bin
19+
9 verbose stack Error: EISDIR: illegal operation on a directory, read
20+
9 verbose stack at Error (native)
21+
10 verbose cwd /Users/naderdabit/opensource/create-xp-app/bin
22+
11 error Darwin 16.4.0
23+
12 error argv "/Users/naderdabit/.nvm/versions/node/v6.9.1/bin/node" "/Users/naderdabit/.nvm/versions/node/v6.9.1/bin/npm" "publish"
24+
13 error node v6.9.1
25+
14 error npm v3.10.8
26+
15 error code EISDIR
27+
16 error errno -21
28+
17 error syscall read
29+
18 error eisdir EISDIR: illegal operation on a directory, read
30+
19 error eisdir This is most likely not a problem with npm itself
31+
19 error eisdir and is related to npm not being able to find a package.json in
32+
19 error eisdir a package you are trying to install.
33+
20 verbose exit [ -21, true ]

package.json

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
{
2+
"name": "create-rn-web-app",
3+
"version": "0.0.1",
4+
"description": "react native web project generator",
5+
"main": "index.js",
6+
"bin": {
7+
"create-rn-web-app": "bin/cli.js"
8+
},
9+
"scripts": {
10+
"test": "echo \"Error: no test specified\" && exit 1",
11+
"build-source": "node build.js"
12+
},
13+
"author": "Nader Dabit",
14+
"license": "ISC",
15+
"dependencies": {
16+
"figlet": "^1.2.0",
17+
"shelljs": "^0.7.7",
18+
"chalk": "^1.1.3",
19+
"commander": "^2.9.0",
20+
"cross-spawn": "^5.1.0"
21+
}
22+
}

src/.DS_Store

6 KB
Binary file not shown.

src/.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
node_modules

0 commit comments

Comments
 (0)