Should we integrate SpringMVC(Thymeleaf, Jsp) with Js frameworks (Reactjs, AngularJs,..) - javascript

I'm new to Js frameworks like Reactjs, AngularJs.
And I'm tasked by my customers with the responsibility of researching to integrate Thymeleaf with one of javascript framework to handle common components (commonality and componentization task) in my project.
But i'm wondering whether it's necessary to use a js framework along with SpringMVC and should we combine these technologies in java web application?
Thanks alot. I have searched for result for hours but no appropriate one found!

please refer blow 2 link,
https://github.com/noveogroup-amorgunov/spring-mvc-react
https://medium.com/#pietroghezzi/spring-and-react-js-the-easy-way-5abe8a529058
I develop differently these examples, first I develop frontend project and build. after creating an MVC project and moved my static build into the static folder. then build java project got a working project.

Related

Is it possible to use a frontend framework only on one page in an already finished project?

I'm working on a project where I need to make a dashboard as a homepage like this
https://www.grapecity.com/wijmo/demos/reference-samples/DynamicDashboard/angular/dist/
but in the project we don't adopt any frontend framework, only JavaScript and jQuery.
The project used Django as a backend.
If you just want a small piece of Vue somewhere in a project without managing a whole lot, you could probably use petite-vue.
This is somehow similar to Alpine and perfect if you want to add just a small piece of interactivity, while staying in the Vue ecosystem.

How to integrate an existing Angular 5 project with Apostrophe CMS?

I a have an Angular 5 project up and running, and I would like to add a CMS to allow admin control over content.
I would like to use something that works with NodeJS, ApostropheCMS state that any front-end application can integrate with their technology, but I can't find anything to help me understand how this is done.
I am Looking for help to understand the integration process, if possible at all !?
And if it isn't then what would be alternative solution considering the Angular 5 project.
Thanks in advance
you can do this using the apostrophe-headless module. In that configuration you could build a separate backend site just for editing the content and use the headless APIs from your angular site so you don't have to deal with any disagreements between them over frontend things.

How can I connect a Vue.js frontend with java backend?

I'm developing a project with a team in which we need to create a simple CRM. Some people recommended us Vue.js to create a great looking UI, but the problem is that with the team we mainly use java. So, we wanted to know if it's there a way in which we can connect a UI made with Vue.js with backend made in java. Any recommendations on how to do it? I've searched a bit and some articles say we can use java+tomcat to connect the Vue.js UI. We need to know if these kind of integration is possible before starting to spend time into making the UI in Vue.js if we can't connect it with our java backend.
Thanks.
I did an example of a project that integrates a java api (built with spring boot) and a vue.js frontend. It uses frontend-maven-plugin to build the frontend and copy it into the resources.
The source is in my github repo
Yes is possible, see this question
you will use your java application which is your "backend" as web service.

Integrating an Angular app with Vanilla JS webapp

I'm in need of your assistance.
Background
We have a legacy Vanilla JS webapp which we intent to replace with Angular. Due to time constraints we wish to do this gradually where we replace one isolated component at a time but also add new functionality as isolaed Angular apps.
The goals is of course to be able to completely move to Angular in a timeframe between 6-12 months.
Issue
I've been investigating how to seamlessly integrate an angular app with our vanilla js with webpack (which we are already using to build our app).
There has been no examples on how do this for Angular whereas I've seen examples for React.
The intention is to have a separate directory for the angular which is then bootstrapped when needed in the vanilla JS. We want to build the angular stuff alongside the rest in one aot js.
Consequences
The consequences I see is of course time to bootstrap the angular app but when using aot there should be not be much of an issue.
Solution??
This is where you guys come into play. How do we easily build the angular app together with the vanilla js app?
Ideally I want to somehow ng build --prod the angular app and then include the result in the vanilla js webpack dist.
Thanks in advance.
If I were you I would do the opposite : integrate the vanillaJS application into Angular.
As Lazar said, Angular is a platform. You code an application using Typescript.
The good news is, every valid JS code will be valid TS code. The opposite, on the other hand, isn't true.
So what I would do, is take my old application chunk by chunk, and put it in a new Angular application.
And I know you are using webpack and it might work great for you, but I highly recommend you to start from scratch with the CLI. Not only because it also uses Webpack, but because it represents 90% (arbitrary number, but not so far from it) of the Angular projects, meaning if you have any issue, there's a whole community that will be able to help you.
Without, of course, mentioning all the features such as i18n, server-side rendering, AOT ...

Create a plug and play plugin framework setup using Angular4

My application was in IBM WebSphere portal, where we have a centralized theme for all the portlets. We build individual portlets with the specific features which are then installed from a page into the portal like as shown below.
So altogether we build a portal with lots of portlets (individual web application). In the portal we creates pages and drag and drop each of these portlets as per the requirements.
Now the requirement was that we are moving everything to Micro service Architecture with Angular4 as the front-end. Currently I am having an angular4 application having many UI components and features. I am posting this question to get some ideas or possibility whether it is possible to create a portal like IBM WebSphere/ Liferay in Angular 4 with having the following basic features:
User/Team can create separate individual angular4 application, build and will be able to install/uninstall within the main application like porltets in portal (IBM WebSphere).
User will be able to view all the installed Angular4 application and can create pages, drag and drop those application within a newly created page.
Each separate Angular4 application (like portlets) installed will be using the main application theme.
Can anyone tell me whether this is doable. Do we have any framework setup in Angular4
One of the possible ways I can think of is using webpack(or any other module bundler) to handle the various angular application.
You can check out my answer here to get a brief overview of how you can configure webpack.
In the end, Angular compile to javascript only. So, It will be possible. But the effort needed to maintain and test the overall application might be huge.
When re-designing a system, it is best to think about the problem you are trying to solve and solve for that use case. It feels like you're trying to recreate the same bad interface with Angular. The code may be new, but the user interface problems will still be there.
I would recommend ditching the portlet idea and creating 1 app with many modules. Angular was designed to be very modular so different teams can work on separate modules. You could then have some sort of settings page where you can turn the modules on and off.

Categories