Moving to react from AEM and Sharepoint - reactjs

We have a main domain which is running on Adobe Experience Manager and a sub-domain on Sharepoint. To enhance user experience, we want to move all pages to React. The plan was to start with pages on a piece meal basis but it appears that React pages cant be hosted with AEM / Sharepoint.
Just wanted to check if there is any approach of using react with AEM or Sharepoint, as in react pages could be under a certain sub-directory or do we need to move the entire website to React at one go.
Regards,
GS
Built a React page on local mahcine but it appears it cant be hosted on Sharepoint / AEM website.

Related

is it possible to create react app and deploy in sharepoint online without creating as web part?

has anyone worked with react and sharepoint, please tell me, if there any reference for creating a react app and deploy in sharepoint online directly, many of the references are creating react app as web part, but I cant find what I looking for. please help
It actually depends on where you want your application to show up in the SharePoint.
In addition to the WebParts, there is AppCustomizer option that allows you to show your app in one dedicated the placeholder of the sharepoint site (top or bottom):
https://learn.microsoft.com/en-us/sharepoint/dev/spfx/extensions/get-started/using-page-placeholder-with-extensions
Other that, there is "single page part" option that allows you app to occupy all the space on the page, and to be the only thing the user gets basically:
https://learn.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/single-part-app-pages?tabs=pnpposh

Responsive Website both mobile and phone, mingle both Reactjs and React native

I want to the responsive web app on Mobile and Web page. I have built a website on React js. I have brought that website using a web view to React native and made it a mobile app. Now I need to direct my users depending upon the platform. If they are mobile users I need to direct them to React native app(live on the browser) and if they use the system they should be seeing the website I build. How can I do that? Is it possible? Suggest me a better Idea.
You can achieve this using your backend code by checking request user agent if you get mobile, you can redirect to some other url (Probably play store).
You can do the same via front end JS also (not advisable). You can use these methods to detect if the user is on mobile, based on that redirect it to play store.
Check if the navigator userAgent is mobile or not. If mobile add a links to your app or app store to download it.
if (/Mobi|Android/i.test(navigator.userAgent)) {
// if I'm here that mean I'm a phone
}

I have a angular website and want to use ionic to create the mobile apps. Whats the easiest way?

I have a website that is created in Angular 4 (with Lumen as the Rest API) that has a responsive design.
The website works on desktop & mobile browser fine but now I want to create the mobile applications.
What is the easiest way to wrap ionic around my existing Angular website to create the mobile applications? The mobile applications will need camera, location, bar-scanning, etc. So I cant just webkit or webview the mobile applications, I would need the plugins from ionic / cordova.
It depends if you want to use any Ionic Components, so if you want to make visual changes to your app, or not.
If you have already created your application and it works/looks fine on mobile, there is no need to use Ionic. Ionic provides visual components to build hybrid apps that look like native apps, but if you don't need them, there is no need to use Ionic. Instead you can just use cordova, which allows you to take your existing webapp and simply add the native features like camera, location, etc. to it.
If you want to change your app and give it a native feel with Ionic, then it really depends on what kind of app you have and how big it is. It's not an easy task to take your existing app and put it "inside" Ionic. It might be easier to just create a new project and copy over the logic, but rebuild everything UI related with Ionic Components.

Azure Mobile App and AngularJS responsive in same host space

Is it possible to get ride of "This mobile app is up and running" page and when user enters the sitename redirect/route him to sitename/app folder where I can pretty much create a AngularJS website in my project folder. FYI - I'm a Dev beginner
using Custom site URL in Azure: I tried this and working pretty like,
when I open the site (www.testsite.com) it's taking me to blue screen
when I go to (www.testsite.com/app) it displays my AngularJS app that I am trying deploy along with and in same mobile app serivce
REST API services and details under www.testsite.com/swagger
why I am trying this ?
On a typical note I want my app to serve all devices, web, mobile, tablet and I feel that mobile app solution is the only lean solution to do rapid application development but wondering how to reach web users without creating an other Web App services in Azure only for Views or web client which comes with cost. let us say if mobile service is just a backend stack and it doesn't allow it... I wonder why not ? by doing it, developers don't need to create 2 services in azure (1. mobile app, 2. web app)
Appreciate it.
found work around by adding MVC Razor Home controller and view for home landing page. more information in this link. this may be a temp solution to get ride of Blue screen and I am going to explore more in include AngularJS site and routing from angular too.
Since this solution works with only MVC style routing there will be a conflict between routing mechanics. will update as soon as I get something.
https://social.msdn.microsoft.com/Forums/azure/en-US/f23175db-2a83-489f-ac0c-f2abe9e48a76/default-document-for-the-mobile-app?forum=azuremobile
If Home view not showing up refer this link.
The view 'Index' or its master was not found

IBM Worklight - Using native pages in a mobile web application

In worklight we can use native pages in a Hybrid application. Similarly I want to use the native pages in a the Mobile Web environment.
Is there any possibility to do this?
Short answer: No.
Longer answer:
WL.NativePage.show is available, as the documentation states, for Android and iOS.
Mobile Web environment - a webpage that is served, loaded, displayed, ... in the device's mobile browser app.
Hybrid app - an app that is comprised of a native shell and a WebView inside it, allowing the ability to open a native page... you do not have that in a browser.
There is no such thing in mobile web. Mobile web is a web site and not an application. However, you can leverage url schemas supported in iOS/Android. e.g. create an app that will declare myapp:// schema support and then add a link to your mobile web site, e.g. myapp://doAction1?param1=someparam
The application will start and process the URL. You can get a lot of info about it on the internet, e.g. http://wiki.akosma.com/IPhone_URL_Schemes

Resources