JHipster vs MEAN-Stack vs MERN-Stack - reactjs

I am familiar with developing AngularJS and Angular 2/4 UIs utilizing JHipster 4's JPA CRUD scaffolding but it feels unnatural. And I think developing MEAN-Stack UIs is the path of highest productivity.
How much refactoring is involved utilizing MEAN-Stack UIs with JHipster JPA (MongoDB) and Angular scaffolding?
Also, if using JHipster's new React support, how much refactoring is required to utilize MERN-Stack UIs with JHipster JPA (MongoDB) and React scaffolding?
Oh, I forget to mention my development target is PWAs (Progressive Web Apps) aka mobile first design.

You'll have to fork the jHipster generator, add your own templates for mongodb, express.js and nodejs.
The server side templates are mostly in generators/entity-server/templates, and generators/server/templates. These template files are written as EJS templates (EJS).
One of the steps during the app generation is to create JSON files from the JDL file. You can run just the json creation using a command like this:
yo jhipster:import-jdl jhipster-jdl.jh --db=mysql --json-only=true
The JSON files will get created in .jhipster folder (note the "." in front which makes the folder hidden) under your project.
Create your own sub-generators similar to the "server" and "entity-server" sub-generators, that use the generated JSON. The templates will have JavaScript that uses nodejs, express.js and mongodb, instead of Java with JPA, and Spring Boot.
This is not going to be easy, although you could follow the JHipster code and create the sub-generators.
I guess someone might have already done all this in one of the forks from JHipster, in which case you might want to start from there.

Related

How To Integrate ASP.NET MVC Backend To Existing React Frontend In Least Invasive Manner?

I recently joined a team with an existing React.js web project. We want to add a ASP.NET MVC backend to this application, but ideally, we want the option to complete the integration slowly without taking down the existing application for a full refactor.
My question is, what is the least invasive way to integrate this new backend, if our priority is to rewrite as little of the frontend as possible right off the bat?
I have seen a lot of information on using Babel to integrate the React.js frontend directly into the ASP.NET MVC file structure, but it might be ideal to keep them as separate projects for now. It does not matter that they compile and build together, we would be fine launching the backend and frontend separately starting out. Really, we would ideally just re-route traffic from our front end to our new backend without changing the front-end project at all.
What we have tried: We did get a ASP.NET MVC backend with a React.js frontend set up using Babel, but wanted to check to see if anybody here has done something similar before copying our entire file structure over.

Creating first angularjs SPA with VS2015

I am new to AngularJS and need some advice on how to structure a SPA with Web API for an external search application
Di I have to use
•MVC / razor views (leave all routing and rendering to Angular)? or just use 1 VS2015 app [use angularjs SPA template for VS2015 or just an empty web application with angular file and a webapi project under same solution?
any examples would be helpful to understand
For angular structure I am reading Google best practice and John Papa
Well, I think what you ran into now. I can suggest two of the ways you can choose.
If you want to keep your backend and frontend together you can go for angularjs SPA template for VS2015. It would come with the build pipelines, bundles and everything you'd need. Now you can choose to render your single page of angular to be rendered with a MVC razor view (if you want to have any mechanisms where you'd want to include your dependencies through the razor view) or just go with a blank html and web api controllers on the back. But you'd end up using one environment for all and I think that's best if you're building the full project.
Now, for the other way around, you can start with an web api project. You can instantiate your angular project with it or somewhere else. You can use yeoman or any scaffolding tool you like and use your own JS toolings you'd like to use. You can do the same in the VS project too but this approach is better if you want to keep the frontend and backend flavor separate.
And I'd suggest using typescript too.

Hibernate + Spring MVC + AngularJS - Do I need Maven?

I have to build an application for a course assignment, using Hibernate, Spring MVC and AngularJS. Almost all of the tutorials I found on the internet were presenting a Maven project.
My question is: Is it mandatory to create a Maven project, or is a Dynamic Web Project (Eclipse) enough?
I am not familiar with Maven, but I have created Dynamic Web Projects before (using Hibernate, JSP views, etc).
Thanks in advance!
The purpose of Maven (or Gradle) is to coordinate all the (JVM) dependencies and package everything correctly. It's much easier to let tools do tedious work (that's why you're using Hibernate and a database instead of inventing your own storage).
I recommend creating a Spring Boot project using Spring Initializr, which will set all of the build and launcher for you. Use m2eclipse (my preference) or the Gradle Eclipse Plugin to import the skeleton into Eclipse.

Where to install Ionic with a Laravel backend?

I have an existing webapp built on Laravel. I am moving to an Ionic build to create the native version.
How would you suggest I separate my views, and how do I call the routes? Has anyone any example.
Here is what I am about to do:
1. move all my views to the public folder
2. install Ionic in the public folder,
3. Using UI-route & Angular make $http calls to the backend.
Thanks for your input :-)
You can't simply do that.
If you have a "classic" Laravel app with blade templates, what you need to do is to expose an API from it.
Then you create an ionic app in a different directory (they are not related, so you don't have to mix them). You just need to develop your ionic app like any other ionic app. Then in your factories where you do the request to your API, you do something like:
$http.get('https://example.com/api/foo')
Where example.com is the domain of your Laravel application (You are going to need to activate CORS in it).
You just can't simply create an ionic app inside laravel, because that application will be built into an .apk to be installed on the phone and you can't add Laravel inside the package.
So the TL;DR is having your normal Laravel app where it lives, add it some public API so your ionic app can access it and then build an Ionic app from zero that will use that API.
It depends on you, but I prefer to keep the ionic project nested in /public, since I want a single-project app, the sources are clearly separated by being or not in the subfolder, but it helps your productivity, benefits are:
Single source control: Single source set for source version control (GIT, SVN, ...), so when I work I can do a single pull/checkout and push/checkin
Single app to deploy: Single domain, no cross-domain problems, single deploy via FTP is available, any standard php server can handle it with a single and standard account to handle
Coherent project without interdipendencies: I do not want to split logic dependencies of the same model between many projects, when I change something in backend or frontend that involve the other side, I want to have in the same project all the sources to update. It make not sense to have to go to a different project to adjust compatibility, it would be uselessy messy

Combining yeoman angular and jhipster generators

I would like to combine the two generators jhipster and angular.
The jhipster entity generator generates entities for both spring/JPA and angular route/view/controller.
A REST point is not always linked to a view, hence I would want to generate the java and angular parts separately. Are there common practices for these issues?
Have you tested out the JHipster framework itself? I hate to ask such a basic question, but if you look at the structure of what is being delivered by hipster, you'll notice that the Spring API controllers/endpoints are all going to be under your main/java/com/[projectname]/web/rest folder, and your Angular calls to those endpoints will all be mapped under the /webapp/scripts/ folder as part of your Angular services file. If you simply want to remove the Angular views and customize, it should be as easy as deleting those files from your project.
However, if you are looking for another form of REST scaffolding tool, my suggestion is to look up http://forum.spring.io/forum/spring-projects/roo if you want to go build based on your entities or DDL2HBM if you want to build based on an existing DB.

Resources