I have a react js app built long time ago that uses 3rd party libraries and APIs, now I want to add this app to saleforce. Is there a way to add the existing react js app or do I have to build a new app using the saleforce development tools? Any advise and help is appreciated.
Can you live in an iframe? There's lightning:container tag that could help you. Search questions or blogs that mention it, on SO and on dedicated https://salesforce.stackexchange.com/. Iframe sounds meh but there are ways for it to communicate with parent ("canvas apps" in documentation - and it has nothing to do with <canvas> tag), silently log in to SF, use REST API...
You could try to rewrite your app to native Aura/LWC but you won't be able to call APIs directly from JS. You'll have to pass through SF server-side language called Apex. Which is doable but more for you to learn. There are some more restrictions, although light DOM and LWS help with these, many things Locker service blocks are OK in LWS.
There's also hybrid approach with loading your app as a library?
Related
I made a progressive web app with Create React App.
The user shall be able to make data available offline by clicking i.e. a button. Is there a convention or best practise to do that?
I have read this awesome documentation, that helps to make your PWA work offline
Part 1
Part 2
Have a look at workbox. It's used in Create React App as well as Next.js.
The actual answer to the question can be found in section Access Caches from Your Web App's Code.
I have a generated Zoho CRM webform for Contact us. I need to integrate that form into my react application and submit user inputs. I can get the iframe version, javascript version, and HTML/CSS version of the generated code. I want to know which one is best for the Reactjs PWA application and can we use this directly with react. Can someone help me with this?
I would suggest avoiding iframe altogether. You might find a lot of issues when dealing with cross-domain artifacts and policies. If you want to customize the look and feel of the form, better go ahead with the HTML & CSS version. JavaScript file will be an external dependency. It also would be a hacky / non-react way.
This is a high-level question and I'm looking for directional guidance before I dive deeper.
I have a web app written in react. My next step is to develop a mobile app across iOS/Android, and my original plan was to learn React Native and rewrite my app. However, learning RN will take time, and re-writing the app in RN completely will definitely take significant amount of time and effort.
My plan is to do so eventually, but my priority is speed over quality for now, and I was wondering if there is a much faster way to ship. So, is there a way to create a mobile app wrapper around my entire web app, similar to what Cordova does?
I am wondering if something like creating tag wrapper in App.js and then load my web app inside it using web view. (New to programming. Don't be too harsh. :)) Any advice will be welcome. Thanks!
Yes, you can use : react-native-webview or react-native-htmlview, depend on what you need.
But rumors says it will be block by app stores if there was web-views which using for SEO faking requests and etc, i don't know.
I'm looking into building a very simple CRUD web application fetching data from and sending data to a RESTful API backend.
Since I have a good experience with Gatsby JS and most of the features it ships are very useful, would you recommend using it instead of the more vanilla create-react-app? Are there any drawbacks that I should know of?
I've been searching the web for info and showcases but there's not much around on the topic of Gatsby JS used for web apps.
Thanks a lot.
That depends on requirements to your application. If you need static rendered pages, Gatsby JS is ok. If your application is not needed it, but you need any server side live rendering, maybe you should look on something like nextjs. If it doesn't require anything of that, using of Gatsby may be overwhelmed and unnecessary and create-react-app will be enough.
We have huge enterprise application written in angularjs.
Now we have to migrate to angular, so we have ruled out an option of hybrid approach angular suggests using "ngUpgrade".
So now we are creating a new application in angular, which means we have 2 applications "angularjs(old)" and angular(new).
So to switch between these two applications can be done without refresh using angular-spa.
I was trying to find if there is another framework, where navigating between two apps happens without refreshing(without refreshing entire page by navigating to new html).
Possible solution:
Use a new Angular application as a wrapper, then just use iframe to show the application you want depends on the context - old or new. The issue you might face is changing the iframe, but I guess you can use postMessage to communicate between the apps.
A bit more sophisticated:
Use Angular Elements to create your hybrid app.
I really recommend you to watch Erin talks from the last Angular connect about how Google made the migration from js to Angular.
I've recently tried the micro-frontend architecture described here:
https://www.martinfowler.com/articles/micro-frontends.html
Each app on different code repository, runtime build and quite easy to implement. Take a look :)