Navigation in react application - javascript

Once i tried to create a react native application, but I find it vey hard and not suitable for my needs.
Then i immigrate to react, i kind of begginner in web programming and I remember in react native was a term called 'navigation' and alot of libraries that gives you ability to navigate between screens in alot different ways, stack navigator and etc...
Now i came to react and I started to work with material-ui, but I cant find anything about navigation its seems everything with navigation is related to react native (and I dont sure i can use it in react, at least i didnt find any refrence to that)
Maybe there is another term for navigation in react applications? I saw react-router-dom videos but I dont want to play with the url, its going to be phonegap application using react with webpack...
Any directions for libraries or things i need to read and learn?
Im sorry if this question is very basic, Thanks alot!

You could try the StaticRouter in React Router. https://reacttraining.com/react-router/core/api/StaticRouter
It can load different components based on the path, but won't change the URL. It's usually used for Server-side Rendering.
Although I suspect what you'd really like is to use routerHistory in React Router. Take a look at this example, https://stackoverflow.com/a/42716055/1248811.

react-native targeting mobile app while reactJS targeting Web. They are similar but not the same.
i kind of begginner in web programming and I remember in react native was a term called 'navigation'
Web programming has nothing to do with react native, react native has nothing to do with browser nor web.
I saw react-router-dom videos but I dont want to play with the url,
Sounded like you wanted to visit www.facebook.com, in a browser, without using url? No it's not how it works. Browser will need a URL to render any webpages that you wished.

Related

Is it worth to use MUI/ChakraUI with NextJS?

I am quite new to NextJS and I were developing apps using React and Django before. So please correct me if I am miss understanding some points. I have some questions about NextJS, however I searched a lot but couldn't find my clear answers and they confused me.
1- Is NextJS really suitable for backend? I searched about this; there are two answers (yes it is full-stack/No, better to use other backend specific frameworks)
2- Doesn't using MUI/ChakraUI breaks the NextJS concept? because when the site is based on MUI every component is a client component right? So, what ever I am going to show the user is a client component that it becomes something like pure react.

Is there a way to make ReactJs SEO friendly without using Next or Gatsby?

Is there a way to make ReactJs SEO friendly without using Next or Gatsby? Because I already made a project and it's difficult to dismantle it to use next or gatsby,
and I just got in trouble when I deployed the project, it's not very SEO friendly.
Thanks
Without using next or gatsby, it is a tedious task to make a pure react based application SEO friendly as it would involve a lot of time as you would have to create an isomorphic app Isomorphic apps with react, you can also look at this great article for better view Building search friendly Javascript applications with React.js
As stated in a previous answer, in order to make a React application SEO-friendly you would have to build an isomorphic application. Currently, the most popular frameworks for developing isomorphic applications are Gatsby and Next.js. This isn’t to say that creating an isomorphic application without them is impossible, but you’re looking at a lot more man-hours. That being said, if you're still struggling to make React SEO-friendly, take a look at this article to get a better understanding of How to Build Search-Friendly Pages in React.

How to Navigate from React Native Component to Native iOS UIViewController

I've integrated React Native into an existing native Objective-C iOS app. I need to navigate from a React Native Component to a native UIViewController, and back.
I'm currently trying to get a Native Module to work but, while my Native Module is called from the Javascript, pushViewController and presentViewController do nothing when called.
I have also looked into NavigatorIOS, but I don't see anything in the documentation that shows how to navigate from React Native to native. The same goes for React Navigation.
I've also looked into React Native Navigation, but still don't see a way to navigate to native view controllers.
Can anyone point me in the right direction?
No official documents said anything about navigating back from RN to native.
Native Module is the correct approach.
I think you could revisit your Native Module code and debug any potential issue there.

Using pspdfkit in electron (React)?

I would like to use pspdfkit with React in electron. I am not sure how I could do this. I know there is a React native wrapper available, but I am not sure whether this is of any use to me, since I am not using React native, but React & electron.
On the other hand, there seems to be a web version available, but the only example given on their website is with docker. I would like to integrate it into my React / electron app, not have it run on localhost:XXXX in a browser.
Any advice on how I could approach this, generally speaking?
PSPDFKit Founder and CEO here.
What you are looking for is an Offline-Version of PSPDFKit for Web. This is a separate framework that works standalone and doesn't need a Server-Component to render PDF documents. We're already working on that. Stay tuned!
Happy to discuss this more: peter at pspdfkit dot com
Edit: https://pspdfkit.com/guides/ios/current/other-languages/electron/

How to reuse the React JS component in React Native

I am new to React JS. I am trying to build a web application which should also work on mobile (Android and IOS) so thought of using react js for web application and created few components. so is it possible to use the React js component in React native.
It's good that you plan in advance. 100% matching between JS and Native won't be possible, but with careful planning, you could get to reuse a good deal.
You may want to take a look at React Native Web project that mirrors Native-specific components for Web (e.g. View, Image, Text, etc).
I suggest building a simple prototype in React JS and then in React Native so you get some understanding of the differences in the two ecosystems. Having a hands on experience will prove more beneficial than any writeup :)
ReactNative is a set of real native Components like View, TextInput TouchableHighlight and more. It is also a platform which let you run javascript code to control these.
There is no WebView like in Cordova, what you get is a native App with native views.
But that means, that you can still have some or your domain logic written in JS which you can use the same way in your Web App.
For example you have a Login Screen for iOS, but all the necessary stuff for your server calls, can go into a separate module e.g. api/auth.js, which is shareable between web, ios, android, iot.. what ever.

Categories

Resources