I created my own widget in react (frentend) with my own oAuth2 system for authentication in php (backend), I wanted to know how I could integrate it into a symfony (frentend) project? Thank you.
To use React with Symfony, you'll have to integrate Webpack in your project: https://symfony.com/doc/current/frontend.html
Once you've enabled the React preset, you'll be able to integrate your components directly in your Twig templates.
I really encourage you to learn more about how Symfony integrates frontend frameworks with these resources:
https://symfony.com/doc/current/frontend.html
https://www.twilio.com/blog/building-a-single-page-application-with-symfony-php-and-react
https://auth0.com/blog/developing-modern-apps-with-symfony-and-react/
Related
We have a parent or host project which is on Angular JS and we are creating a new React app, and would like to integrate React app as MFE with the host project.
We would not like to make lot of changes in the host project but wanted to check if we can use webpack/webpack module federation in the Angular JS project to do the MFE integration.
Thanks in advance for any examples or suggestions that you provide
What you are trying to do is not possible with Webpack 4 (unless you use the Single SPA JS library to polyfill support for MFEs). You will need Angular version 11 or higher (but I'd recommend version 12, as Webpack 5 support is stable in that version).
Some examples and references:
https://javascript.plainenglish.io/create-micro-frontends-using-web-components-with-support-for-angular-and-react-2d6db18f557a
https://webpack.js.org/concepts/module-federation/
https://github.com/module-federation/module-federation-examples
https://github.com/manfredsteyer/module-federation-plugin-example-nx
https://www.angulararchitects.io/en/aktuelles/using-module-federation-with-monorepos-and-angular/
https://www.angulararchitects.io/aktuelles/multi-framework-and-version-micro-frontends-with-module-federation-the-good-the-bad-the-ugly/
I have started to learn React and now I am a bit confused about different parts of development and deployment.
Does all webpages are bild with frameworks like React or Anguler? Or they are used only for one page web applications? Can I serve React with nodejs server?
Does the method when you build static webpage with js, html, css and serving them with Apache web server is still used in modern world?
I would highly suggest using the React-Create-App utility. And yes, you can use Node.js. In fact, React doesn't force you to use any backend framework. I could pick ASP.NET MVC, Node, Spring MVC, Rails, etc.
https://github.com/facebook/create-react-app
But this tutorial will guide you through creating react apps in development and creating production builds.
When you build in production, you'll end up with a public folder with html files. But in React, you don't create html files, you create .jsx, which is a combination of html-like React tags with JavaScript. They will get transpiled to html, etc during the production build phase. You can then take the build folder and deploy it on an HTTP server, such as Apache.
I'd like to integrate/use an aspnet core 2 mvc app with react built using the react CLI "create-react-app".
I'd prefer to avoid all the boilerplate provide by SPA template.
Could you please me help to figure out all the steps required to integrate for. ex. gulp to code against the app created with the CLI in VS editor and see the result when I launch the website from VS and see the change while the website is running?
I am new for React -Redux.
For creating a project Is there any command available so that It's create default folder and file?
For Example:-
In Angular we can create project through Angular-Cli.
So, In React -Redux is there available something like that?
If you use create-react-app command this create form a structure like so:
Source
As React is a only a view library the official create-react-app cli doesn't provide redux with it.
But there are alternatives like:
https://www.reactboilerplate.com
Also: you could get a boilerplate project integrated with backend of your choice. Like:
https://github.com/geowarin/boot-react for Java Spring
dotnet new react-redux for .Net Core
Redux does not enforce any folder or file structure.
But there are some patterns and designs you can follow in React app.
Check the docs.
I am currently building a component based app using angular fullstack, and am having trouble installing an admin template like blur-admin (https://akveo.github.io/blur-admin/) inside my project.
How to install an admin theme easily inside my angular fullstack app??
Has anyone done this, or is it always done running the admin side separately and routing it on a subdomain?
Thank you :)