react native web setup - react native app for Web /android/ios - how to run react native app on web

React Native for web setup-
1. Install new dependencies to support react native for web
2. include some new files to run react native app on web
4. Start the app on web as well as android emulator
-----------------------------
Step -1
2. npx react-native run-android
Step - 2

1. npm install react-dom react-native-web --legacy-peer-deps

2. npm install --save-dev babel-plugin-react-native-web babel-plugin-module-resolver --legacy-peer-deps

3. npm i -D babel-plugin-react-native-web webpack webpack-cli webpack-dev-server html-webpack-plugin react-dom babel-loader url-loader @svgr/webpack --legacy-peer-deps

"jest": {
"preset": "react-native-web",
"moduleFileExtensions": [
"ts",
"tsx",
"js",
"jsx",
"json",
"node"
]
}

5. include these four files in root folder(project folder) of your project

7. you are all set and now run the app on web with this command
npm run web

#reactnativeweb

build website with react native
react native for web
react native for browser
make a website with react native
single code for three platform web android ios
react native web
react native setup for web

[hungnguyen-drmr]

very thank you, I spent hours to find to how build simple react native web. and finaly made it work!

[techvented]

Your video helped me a lot although had to do some minor error search for fixes but the guide helped me for like 95%. You are wonderful

[soumyaranjan]

Thank You So much for this video now my app run successfully both mobile app and web browser.

[gauravpanwar]

Your video is so helpful for me because of this I am able to setup react native project on my local. Thanks for your hard work 🙏

[sagarkhatri]

Great Video. I was looking exactly something like this. I tried the same but using react-scripts as it has some built in feature we can use. and it worked well in dev mode as well. But while I try to build using `react-scripts build` it doesn't work. Do you recommend using react-scripts instead?

[maidaye]

Hello, I'm new to React Native. I want to create an inventory management system project for the website, iOS, and Android. Can I just use the same code in React Native to build it? Because I will publish the website online, the website will be the main part, and the mobile app will be used for other functions that don't exist on the website. (For example, open the camera on the app to scan the QR/Barcode...)

[harathiteja]

Your video helped me a lot and it's working fine we want further videos we want to know how to render app.tsx file content on the web also, how to do that mam, please make a video.

[yogesh-gupta]

Hello, can we have repo link for this demo project. That will be more helpful.

[TarunKhatri-lekq]

Everything is working but third party npm packages are not working I tried many but none of them are working for web (working on Android)

[gnanaprakash]

I used Image component. The image is rendering perfectly in android but not in web. when console the element, it says the div tag not a image tag

[mayurkode]

have you done react native web with react native paper
?

[lakshmansri]

Kindly share video for react native web navigation configuration

[villagevantalutelugu]

react-native-vector-icons not showing in web view
please help me

[my-buddy]

Can you please publish the video about rooting for the web part? it might help a lot for us.

[jegatheeshselvam]

Please explain how to setup SSR in react-native-web 😅

[FarhanKhan-tocq]

Do you have repo link ? It will definitely gonna help

[Desireanshu]

Is there any way without using webpack?

[shashikumar]

I have added custom fonts in react native project.They are working fine on Mobile but on Web no font is applicable. Can you please share info, how to add custom font for web and during sharing builds for testing. Thanks in advance

[hassamshamas]

I'm having a Issue, can you help me please?

[AbhishekYadav-qror]

Finally mam got password of her ACCOUNT