I read from react-primitives readme https://github.com/lelandrichardson/react-primitives#readme, stated that we need to install target platform library to use react-primitives. For windows there is this react-native-windows. If I develop app that uses react-primitives on ElectronJS, is it possible?
I want to develop multi platform app that runs on windows, linux, macOS, android, iOS, and web with one codebase.
Electron is basically a browser. So if you follow the web setup guide for react-primitives it should work perfectly fine.
From the installation follow :
web:
npm install --save react-dom react-native-web react-art
This also means you can have one config for all your needs.
Related
I created my app in react native using Expo but when i run the npm start command its showing me this:
running metro bundler on port 8081
and then
loading dependency graph, done
and never end. what to do?
Here is the complete console output.
First of all if you have a bundler like the one that you have used then it would suggest that you have used react-native init to create you application, instead of expo.
Expo bunders look like this:
If you have created a react-native init and as it suggests in your screenshot that you are building the app on a Windows machine, that means you will be developing on Android.
The instructions for using Android and running react-native are quite long and complicated, they can be found here. For the sake of brevity I am not going to repeat them here asyou can just follow this link. Make sure to choose Building Projects with Native Code -> Development OS: Windows -> Target OS: Android to find the instructions that are pertinent to your situation.
https://facebook.github.io/react-native/docs/getting-started.html
If you are planning on developing on an emulator then you will need to make sure that you have one installed (the link above has all the info that you need). Also you need to make sure that you launch your emulator before running react-native run-android if you do that then it should load on to the emulator and you should be able to see what you are developing on.
If you want to run on your own Android device then you should follow the instructions on this page https://facebook.github.io/react-native/docs/running-on-device (again choosing the options for your situation).
Expo
If this feels like too much effort, you can always try Expo. It doesn't require you to be able to deal with native code. And depending on your use case can be a better option than creating a project with react-native init, plus you can always eject from the expo project and turn it in to a full fledged react-native app.
You install the expo-cli with
npm install -g expo-cli
Then download the expo app from the App Store or the Google Play Store (depending on the mobile that you are using).
Then you can use
expo init
to create your application
Check out the expo documentation for more information https://docs.expo.io/versions/v32.0.0/workflow/up-and-running
Well, Nice question, First of all, I totally understand what's exactly your problem is, let me give you a solution in a very appropriate way.
Basically, there is two way to install and setup React Native Project on your mac and windows machines
1st React Native (native) Method: (That's basically you're using right know
Note: If you're using Apple product - Like MacBook then you can do IOS and Android both platform by using this method, if you're using Windows or Linux you can only do this part for Android platforms
In this method, we have to follow these simple steps
Download Nodejs from Offical website link here
Installing the React Native Cli
npm install -g react-native-cli
If you get an error like Cannot find module 'npmlog', try installing npm directly: curl -0 -L https://npmjs.org/install.sh | sudo sh.
(Only for mac)
Install the Xcode from Appstore (Only for Mac user/macos users)
otherwise
download and install the Android Studio (Stable version) from the official website of Android studio
Setup Xcode (Simulator) or Setup Android Studio for Android devices use (emulator)
by learn and guide from this link here
Note: Basically in your scenario, I'm pretty sure you didn't set up your emulator for android and simulator for IOS that's why you didn't see anything after
2nd React Native with Expo Method: that's you're not using a loading dependency graph
Use
For Android
react-native run-android
For IOS
react-native run-ios
2nd React Native without Expo (that's not your case):
In this method, we have to follow these simple steps
Download Nodejs from Offical website link here
installing expo cli
npm install -g expo-cli
expo init yourprojectname
cd yourprojectname
npm start
Note: Simulators and emulators way same for both
I found this question Cordova with Create-react-app.
Am I able to achieve live-reloading while I'm in development mode and app is running in android emulator? I'm scared that I have to build the app everytime I wanna to see changes.
Is cordova able to watch react-app which run in development mode and read source from index.js listening for changes?
Let's say that I want to achieve something like this:
create cordova project.
create react project inside of /www folder (or any other folder that will work with my use-case...).
run cordova run android from root to run application in Android Simulator and npm start from /www directory.
cordova should be able to listen for changes and live-reload react app inside Android emulator.
I need to able to access cordova instance inside react code to use plugins, etc.
I've found some webpack-server-dev (using webpack v1...) related solutions but none of them seems to be working and I need to restart cordova run android command to see changes in the code. Otherwise these templates doesn't provide functionality to enable access to the cordova plugins instance during development mode
So is really npm build followed by cordova run android only way to develop cordova + react app??
Note 1: I would like to use SQLite cordova plguin so development in browser-only mode and then building the application for android/ios once its done is not my case I think. Do you have any suggestions please?
Note 2: I can't use react-native as I need to use openlayers maps lib.
Thanks you so much for your answers!
Run webpack-dev-server with --host 0.0.0.0 to make it accessible from outside
Change your config.xml and make <content src="..." /> point to your local-IP address and your dev-port, e.g. <content src="http://192.168.0.2:3000/" />
Add a whitelist entry (refer to cordova whitelist-plugin documentation for more details): e.g. <allow-navigation href="http://192.168.0.2:3000/*" />
If you need native functionalities via cordova, you need to make all cordova and cordova-plugin javascript files available in your dev-server. Please check this answer as well (symlink part): https://stackoverflow.com/a/46545408/1930339
I am a newbie to React Native and I have just started leaning it. During its installation, came across the following commands
npm install -g create-react-native-app
npm install -g react-native-cli
It says that the first one is the easiest way to start building a new React Native application, where as the second is from older mode of installation. How these two ways differ from each other? Which one should be selected especially as a beginner like me to learn React Native? Which one is the best way to install React Native?
The create-react-native-app package is a community-driven package that gives you a basic template for React Native so you can start right away instead of having to set up Babel, Expo (which allows for cross-platform development), etc. It's a great way to start with React Native without having to set up any boilerplate or have an Apple machine for iOS projects. It's a CLI that generates a project for you to start without any hassle.
But create-react-native-app has its limitations. The tradeoff is out-of-box ease for less customizability. That's where react-native-cli comes in. This is the CLI that is used to create new pure React Native projects, run them, etc. This does not include Expo which does not allow for the ease with CRNA nor cross-platform development (you'll have to use an Apple machine for iOS). But with a pure React Native project, you can add native libraries and APIs for your project, which is not possible with CRNA. You can achieve a pure React Native project from a CRNA project by ejecting down the line.
I would suggest CRNA as a starting point because it allows you to use Expo to demo your apps on devices quickly and has support for both Android & iOS, regardless if you have Xcode or not -- without any configuration hassle. But it comes with limitations which you can alleviate with ejecting (but will lose other capabilities).
I am native android application developer working on java and android api's with android studio, recently i got a requirement to build a hybrid app with ionic, cordova and angularJs, i spent 5-6 hours and dig google to get some tutorail to setup a project structure of hybrid app in andorid studio, but haven't found anything.
I know how to use ionic, angular and cordova but don't know about the project structure and setup compiling and how to run.
so, i want you guys to post links of such tutorails (If you have any).
Have a look over cordova CLI mode. In this see specific for Android Platform for that you first need following pre-requirement to use:
Android Studio.
Android SDK.
Node.js
Git Client
After installing Node.js Open it's terminal and follow command to create Cordova project with different platform. These steps are already mentioned in official documentation.
Once you have created executed cordova build androidcommand then browse to your project directory. In that you will find that there's a directory named platforms in that you will see Android, now open your Android Studio in that select Select Import Project (Eclipse ADT, Gradle, etc). when you create a new project from there browse to Android directory. That's all you need to do for cordova
Official documentation and referrals links:
http://ionicframework.com/docs/overview/#download
https://cordova.apache.org/docs/en/5.1.1/guide/platforms/android/index.html
https://cordova.apache.org/docs/en/5.1.1/guide/cli/index.html
https://docs.angularjs.org/misc/started
Hello try to reefer this articles on mcgivery blog.
http://mcgivery.com/100-ionic-framework-resources/
I'm ionic dev and if you want to use good IDE use WebStorm :)
I'm using it on EAP version.
first of all you have to install 1)node.js 2)apache ANT 3) Java JDK &
JRE 4) Android SDk & Eclipse and then after all installation you have
to set this all software path into environmental- variable. and then
fire your npm install -g ionic. without this all software
installation and there path setup your ionic application will not
created. and still you have any confusion and any question related
software installation and there path setup then again tell me i will
help you.
I am trying to build PNaCl for use in CEF. I have managed to build the PPAPI examples as defined here:
1. Build CEF3/Chromium from source code as described at https://code.google.com/p/chromiumembed ... ndBuilding.
2. Edit C:\chromium\src\build\some.gyp, add '../ppapi/ppapi_internal.gyp:ppapi_example_paint_manager' in the 'dependencies' section.
3. Run `gclient runhooks` from the chromium src directory to update the build files.
4. Open C:\chromium\src\build\some.sln (on equivalent on other platforms) and build the ppapi_example_paint_manager target to create ppapi_example_paint_manager.dll.
How do i configure gyp for building a PNaCL/NaCl plugin that i can load into CEF?
Loading a NaCl or PNaCl plugin into CEF will be no different than loading it into Chrome. As such, you can use the standard build tools for building Native Client plugins. Start with the Native Client SDK, and try building the demos and examples there.
You won't typically use gyp for building PNaCl/NaCl plugins. Using gyp is difficult because it requires manually setting up the Native Client toolchains as the build target. The Native Client SDK includes a set of Makefiles that do this for you automatically.
You may also want to take a look at naclports. This repository has ports of many open-source libraries to Native Client, which may help you in porting your application.