We are going to try build an app with react-native for the first time.
We are getting design resources from a different team and they don't have experience with react-native either.
Is there a something that we should request for react-native design resources?
Can you make native app(swift/java based) or react-native app using the same design resources?
I'm not sure this is stackoverflow-ish question, but very real question that I need answer for.
edit
I removed the question over (psd+guide vs image slices)
Related
I have recently been learning Next.js for React and I like the routing system a lot more than react navigation. Now I am about to start a react native frontend and I was wondering if you can utilise Next.js's routing system in react native as well as it's other benefits. I know that you can use it with expo but I am a little confused as to how it all works and I am starting to wonder if the Next only works on the web side of things..
Does anyone have any experience with this? Any information would be much appreciated.
Thanks!
Unfortunately you can't do such thing, due to the fact that the views of react native are Equivalent to native views in Java or Objective C. When you get build version of react native , you are receiving Java or Objective C native views thank to react native's RN bridge. Meanwhile, when you get build version of your Next.js project, you are going to receive HTML, CSS, JS and these codes are not familiar to native platforms.
However, you can use your Next.js backend as your endpoints and fetch data in react native via calling this endpoints.
UPDATE Oct_2022:
there seem to be a new tool created for this purpose , called solito. I haven't used it personally but it might meet your needs.
UPDATE Jan_2023:
It looks like there are more Tools being created for Both web and native platforms , check react-native-web
You can check out Tauri. With that you can create from Next.js, React, Svelte etc. cross-platform native Apps. Currently, Windows, Mac and Linux are supported stable. Android & iOS is currently in Alpha
The magic behind Tauri is, that they provide around your Frontend library/framework a Rust layer with that you can interact with platform native APIs. They call it Commands.
You can find the guide for Next.js here.
Also, if it's not exactly answering the question - "Is it possible to use Next.js in React native?" - I hope that it's helping everyone who is searching for a solution to use Next.js as Cross-Platform Frontend Framework
I read a thread on ycombinator on this where Solito was mentioned and tried it out. In the comments I found this, which suited my needs best :
https://github.com/mlynch/nextjs-tailwind-ionic-capacitor-starter
Solito looks nice but the all in one repo was using Expo, which I did not like because it installs an extra app. I would check it out for yourself and look at the repo above too, which is using Capacitor and is aimed at having one codebase for the two apps.
Both examples worked well. For Tauri I could not find the mobile support so I didn't try it. I would be interested to read more about people's experience with running a minimum stack for cross platform development.
Note : Solito uses React Native, the repo uses Capacitor instead, which may also suite your needs because it works on both iOS and Android.
There's a lot of support now for this tech stack. Besides solito, which is already mentioned, there is also https://tamagui.dev/ which tries to solve all the issues with react-native-web and Next.js along with Solito.
While they currently recommend a monorepo (which adds a lot of complexity in my opinion), I'm playing around with a vanilla React Native + Next.js here: https://github.com/criszz77/luna
This command should get you started to play around:
npx react-native init MyAppName --template #criszz77/luna
I'm just learning development and recently, I finished a MERN stack course.
Now I'm wanting to build my second Commercial App for the company where I am working.
At first, I was only considering responsive web platform but now, I can't deny the necessity of functionality on ios and Android.
Thus, I did my own research on which framework or method I will have to use to minimize my production time rather than using react web and react native separately.
It seems like Expo Web and React Native Web will be the closest solution I can think of.
I'm not sure if I'm trying to take things too easy, but if someone can enlighten me with suggestions on how to approach this dillema, that will be greatly appreciated.
In Short.
What is better? Expo Web or Native Web and best way to learn..
When using Expo, you're building the same app for iOS, Android, and Web at the same time.
Building an app with Expo CLI will provide a 100% code base across the 3 platforms. Because the Expo SDK covers most, if not, all the tools you need to build a simple application without touching native code.
Expo also offers you the possibility to eject from it, if by any chance you need to change native code.
I would suggest that you start with Expo CLI, because of how rich its SDK is and how easy it is to get started with it. And if later in time you wanna modify native code, you can eject from it.
I am working on a project that needs to be cross platform for web and mobile. Currently the website is being developed using ReactJS and cordova is being used to make it available on mobile.
But I was wondering if it would maybe be a better choice to use ReactNative for the mobile version because cordova might be more of a hassle than ReactNative is. I dont know if this is true tho.
I know this is kind of an open question that tends to be opinionated but i'd still like to hear some thoughts on this from you guys because its bugging me and I dont have the knowledge and experience of working on both these platforms (cordova and reactnative) to have an educated opinion.
React Native is an abstraction to write native UIs for Android and iOS. Your JS code runs in a JS runtime on the OS, but the UI is rendered as native components. This makes it very different than Cordova.
With React Native, you can use the standard platform components such as UITabBar on iOS and Drawer on Android. This gives your app a consistent look and feel with the rest of the platform ecosystem, and keeps the quality bar high. These components are easily incorporated into your app using their React component counterparts, such as TabBarIOS and DrawerLayoutAndroid.
Also you can find differences here:
https://www.toptal.com/mobile/comparing-react-native-to-cordova
Phone gap vs React Native
http://noeticforce.com/mobile-app-development-cordova-vs-react-native-vs-xamarin
I have an app based on the create-react-app starter kit and need to switch to universal/server rendering due to SEO issues.
Is there an easy way or example of taking the create-react-app teamplate and adding or modifying it to support universal rendering?
A lot of the examples I see for universal are overly complex for my needs and I prefer to keep it very clean and simple, if possible.
Thanks.
EDIT: FYI,
I found this medium post which points at this repository.
Seems simple enough, but since I'm a newbie on all webpack/react/node related stuff, if anyone thinks it's the wrong approach, would love to know...
There was a proof of concept of adding server rendering in this PR.
I can’t speak to how good it is but it’s something you could start with.
You may also look at some of the alternatives.
A few of them provide server rendering out of the box.
I've just created react universal (server-side rendering) starter used recommendations from redux and react-router v4. Fill free for feedback
https://github.com/gzoreslav/react-redux-saga-universal-application
You can take your app (bootstrapped with Create React App) to the next level by replacing react-scripts with a slightly altered version - react-app-tools, which allows adding server-side code to your project (e.g. for server-side rendering purposes and/or implementing an API endpoint). It will allow compiling and running your app using normal Create React App pipeline, using a single instance of Webpack, on the same HTTP port.
You can find more info by visiting React App SDK.
(Disclaimer: I'd have asked this question in a forum but the react-native website encourages us to ask it on SO.)
Is there a known tool to visually preview xml layouts in a browser? I'm developping a scaffolding tool to generate basic templates so I can prepare applications for customers quicker, and I'd like it to be a web app. Since the layout is very similar between react-native and reactJS, I'd think the effort to show a react-native layout as a reactJS layout is minimal?
A framework for building web apps with React Native compatible API
https://github.com/taobaofed/react-web