I have 2 angular micro frontend apps residing in different repository
Angular shell app -- Repository 1
Angular Micro frontend app1 -- Repository 2
Angular Micro frontend app2 -- Repository 3
Is there any way to share data between shell app and micro frontend apps
Iam using #angular-architects/module-federation for creating micro frontend apps
By using new CustomEvent() we can send messages and using fromEvent() we can receive the messages
Related
I have an Angular app that connects to several Nodejs apps. Each of these apps are in different repos.
Frontend
/ \
Backend1 Backend2
In the Angular app we have a typical environment.ts and several environment.<env>.ts In each of these files we have the URLs to the different backend services that we make calls to.
I would like to setup the heroku preview app for each repo when we make a new Pull Request in any repo(I think). In many usecases I have the normal preview apps working fine.
✓ Make style changes in the angular app
✓ Make a change to the computation of data in one of the back end services
✘ Format data in a new way to display in a new component
This example creates a new change in the Backend1 service and the Angular App
The preview environment for Angular app will use the normal Backend1 URLs and not get the changes from the new Backend1 Preview app.
Somehow the environment.ts needs to change or a environment.<preview_id>.ts needs to be created and used in the build.
Is there any configuration for this or am I looking at some heavy devops work?
I'm absolutely new to Azure, CI, and CD.
I have an app consisting of a frontend developed under React + Typescript which sends CRUD requests to a typescript backend. Both front and end are NPM projects.
I've no idea on how to step from development environment to production, deploying to Azure.
Should I create two separate AppServices, one for each project?
If that's the case, how do I then connect them?
Do I just need to change the URL the server listens to?
As you can see I've no idea of what I'm doing but I'm eager to learn so any feedback is much appreciated
The most common approach is
Deploy frontend app ( react ) in one app service.
Backend nodejs app on a different app service.
Then, call the api of the nodejs app from the frontend.
Or,
Set up and run the client and server on the same server using a gulp file and deploy that project on an app service. In that case, there is no cross-site communication. This is the most preferred one.
Using the same app service for both front end and back end application. Refer nodeexpress-backend-with-angular-front-end-in-a-single-azure-web-app.
Using Cors to connect front end and backend Check here
Refer SO Link 1 & Link 2
And You can use deploy staging slots in app service to use different environment like (test/dev, Production).
I have a react native app that I'm building using expo. For the backend, I am using node.js and Express.
My app hierarchy is such that I have a frontend folder and a backend (server) folder. For example,
Root
|
|Frontend
|Various screens & associated files
|Server
|Routes & other files
For my project, is it possible to just host the backend and not the rest of the app? Such that when I fetch data in the frontend using HTTP requests, instead of routing through localhost (http: //RandomIP:PORT/route) I would use the heroku address as the routing address. I would also host the SQL database along with it.
I tried to follow along with the Heroku documentation, but it seemed like that was for hosting the entirety of the app / web apps instead of mobile, and I ran into constant errors.
I would like to point out that, unlike web pages, mobile apps cannot be hosted on the server and fetched on-demand. In other words, do not try to upload your react-native code to Heroku instead just upload your backend only and then make HTTP requests through the URL provided by Heroku after you have deployed your code.
Therefore go into your backend codebase, initialize a git repository and just deploy that Heroku. Also, you will need to host your SQL database on another service such as Google's Cloud SQL or Amazons AWS Database Services.
I have frontend and backend both are using nodejs. Frontend is exposed and every request for api goes through the proxy module in the frontend, and both frontend and backend communicate on different modes.
Is there a way to deploy the above module, using code pipeline onto the Elastic Beanstalk platform ?
Why not deploy the front end on Amplify AWS?
AWS Amplify is a set of tools and services that can be used together or on their own, to help front-end web and mobile developers build scalable full stack applications, powered by AWS.
You just need to link your Repo and select your branch and everything will be deployed and generate also a random free domain or you can set your domain from the domain management section
I am new to Azure and cannot find any resource on the Internet on this, although I would think this is a common task.
I have a Vue.js frontend and Spring Boot backend. Auth using JWT. Front and back are two separate projects in separate repositories.
Now, I want the whole deployed on Azure, preferably via some Azure release pipelines triggered by Azure repos.
In what Azure products should I deploy these two projects? Should they be both in a separate VM? Also, how do I configure the frontend to use the correct base url of the backend so that it can fetch data?
Your frontend should be deployed to Azure Storage:
https://medium.com/#matthewleak/deploying-a-static-website-to-azure-storage-using-azure-devops-fa0bed457d07
Your spring boot can be deployed on App Service:
https://medium.com/microsoftazure/the-power-of-azure-devops-projects-for-java-apps-cda6c69bef0e