I Have an angular Application build on 8+ now I have a requirement where I want to create react component and embed it in Angular Application.
How my Angular folder structure will be modified, is there any possible design pattern I have to follow while working both angular and react in one application?
I am not a guru of the frontend, as I know it is possible.
Interact through Web Component spec
Apply Microfrontend patterns to mix Angular/React in the sample application
Ionic team created a project named stencil which targets WebComponent development and conceptly it mixes the Angular and React good part in the same framework.
Related
I am building a small React app with the team which uses AngularJS 1.x version.
My approach was to embed build folder in one of the AngularJS templates where I expected to see a static generated website <ng-view id="ng-view-content"></ng-view> container.
I don't need to share states or components between, I am just looking for a solution for embedding React generated sites into Angular view.
Thanks in advance
I am starting a new project which is a hiring portal so it'll involve minimal business logic and more of forms, data storage and external services.
Considering the fact that I haven't done much with React other than creating a simple hello world app using create-react-app from npm, I was wondering if it would be better to have a separate frontend app that gets all the backend work done through APIs in my .net app, or to simply use React in my views with the necessary jsx files and NuGet packages.
My question is, can I use the react framework with #spartacus storefront? this is because our frontend application is developed in React and we want to use #Spartacus storefront to leverage advantages like decoupling front-end and Hybris build ..etc. but as it is developed on angular I am not sure whether it supports other frameworks like React within it.
There is some effort in making possible using web components as cms components, so you could use any technology to author them (including React), but it's still in the experimental phase (but works already).
More info is available in the docs:
https://sap.github.io/cloud-commerce-spartacus-storefront-docs/customizing-cms-components/#using-web-components-as-cms-components-experimental-support
And here you can find some example POCs for React, Vue, and Svelte:
https://github.com/dunqan/react-cms-web-component
https://github.com/dunqan/vue-cms-web-component
https://github.com/dunqan/svelte-cms-web-component
Spartacus needs Angular. So, I would say "NO", unless you want the complexity of integrating Angular with React.
For a project I am working on, there is a situation where I have to include and ReactJS app which is already compiled into an AngluarJS project. Chrome/Firefox Browser is the Enduser-Interface.
I know that this setup isn't the best, unfortunately I have to deal with both frameworks in this exact setup.
I am not allowed to use an IFrame neither.
I googled a lot, searching for wrapper, which exists but only if the react project isn't already built.
Does anyone have a solution for this?
I am not sure your requirement, as per my understanding, you can import the "ngmodule" to react component and render the angular script. In this case you can achieve it from server side rendering.
In our project, we have the common login module developed in Angular 1.x, we are rendering the angular module in React.
I have to develop an application using MEAN Technology in which i have to use:
Angular 2 For client ui
Angular material css
Mongoose for ORM for mongodb
Typescript for writing server-side and client-side code
gulp task runner.
How do i structure my application so that it will be modular and easily manageable and maintainable in Dev and production environment.
I created an application recently that uses angular1, but with MEAN and mongoose and everything else you describe here... https://github.com/tydanielson/ctas-done-better If you want to create the angular2 part I recommend using the angular cli that gets everything in place https://cli.angular.io/ Lastly material for angular2 is in alpha and doesn't have nearly all the features with material and angular1 so be careful with expectations.