Understanding the front-end framework, nodejs, reactjs, angularjs, requirejs, seajs, and nodejsreactjs from the Java perspective

Source: Internet
Author: User

Understanding the front-end framework, nodejs, reactjs, angularjs, requirejs, seajs, and nodejsreactjs from the Java perspective
[Suddenly comprehend]

After reading reactjs today, I suddenly found that it is very similar to the macro of freemarker I have been using,

I suddenly learned a lot about the concept, framework, and close-up of the front-end hanging sky. I welcome criticism and correction.


[Nodejs]

Official Website: https://nodejs.org/

Introduction: a "framework" that is extremely important to the front-end is simply an open-source

Similar to Java: JVM

Details:

As far as the frontend is concerned, nodejs has epoch-making significance. nodejs has never been used as the frontend,

I have never heard of nodejs at the backend, or I have never heard of the advantages and disadvantages of nodejs and java, nor is it a qualified backend.


Nodejs is not a js framework. Do not think it is a framework similar to jquery,

Nodejs is the runtime environment of js. It is similar to jvm in java,

What is the beginning of java? No doubt it is jvm. Since jvm is available, java can boast that it is "one write and run everywhere ",

Regardless of whether you are windows or linux, you can run the. class file as long as the corresponding version of jvm is installed.


Similarly, nodejs serves the same role as jvm and is also the js runtime environment, no matter what operating system you are,

You only need to install the corresponding version of nodejs, then you can use js to develop background programs.


This is epoch-making, meaning that JavaScript code that can only be used in browsers for a long time can be used for backend development,

With nodejs, a large number of front-end developers who use js for background development have been created. This part of staff is the front-end "full-stack programmer ".


Remember, nodejs is a js runtime environment equivalent to jvm, opening the way for front-end personnel to move to the backend.



[Js mvc Framework]

Related frameworks: there are too many frameworks. For details, see the following two articles.

Http://www.csdn.net/article/2014-02-24/2818519-node-js-mvc-frameworks-for-javascript-developers

Http://www.csdn.net/article/2014-03-25/2818964-web-application-frameworks-for-node-js

Similar to Java: ssh1 (struts1 + spring + hibernate), ssh2 (struts2 + spring + hibernate), and ssm (springmvc + spring + mybatis)

Details:

As mentioned above, nodejs opens the door for front-end developers to develop the backend, and nodejs is similar to jvm,

So everyone who learns java knows what to learn after learning jvm (basic?

Right, framework,

Java frameworks, as mentioned above, ssh1, ssh2, ssm, etc,

These frameworks are all mvc frameworks.


Now that nodej is available and jvm is available, the next step is that the js master begins to encapsulate the mvc Framework, just as the java master begins to encapsulate the mvc framework,

Several frameworks are more popular than java, and nodejs has more mvc frameworks,

For more information, see the above two articles.


The most famous one is expressjs.


Remember, when you see these js frameworks, you smile and write the mvc Framework Based on nodejs: Sails. js, Total. js, Partial. js, Koa. js, Locomotive. js, Express. js, Flatiron. js


[Js modularization]

Related Concepts: commonjs, amd, cmd, umd

Related frameworks: commonjs, seajs, requirejs, and coolie

Similar to Java: import, or import ..

Details:

As mentioned above, when nodejs (jvm) and mvcjs (ssh) are available,

We can imagine how many js files will be contained in each mvcjs. At this time, js modularization will be useful,


When someone tells you how to modularize js and feels like they are hanging, just drop him and say, isn't it the import in java?

Yes, although it seems to the front-end how JavaScript modularization works, and how to handle it, java is the import.


However, there are many other specifications in the modularization of js, such as commonjs, amd, cmd, and umd,

In short, commonjs is running on nodejs, amd, cmd, and umd are running on browsers,

Its role is to import various js files and modularize js management, which can be understood as package management in java,

See this article for details: http://coolie.ydr.me/introduction/commonjs-amd-cmd-umd.html


Similarly, a single mvc and js framework can be made up of more than 10 types. It can be imagined that it is modularized, and js also corresponds to many frameworks,

For example, commonjs, requirejs, and seajs.


Remember, commonjs, requirejs, seajs, and other js modular frameworks follow various specifications (amd, cmd, umd, commonjs ), Similar to the import in java


[Reactjs]

Official Website: http://facebook.github.io/react/

Introduction: a framework not long ago developed by facebook, which attracts the public.

Similar to the macro of freemarker in Java.

Details:

Facebook recently developed a js framework, reactjs,

For a time, any front-end development that has used reactjs or heard of reactjs is superior to others,


So what is the framework? Let's take a look at an example on the official website:

Okay. It doesn't matter if you don't understand it. Let me say,

There is a piece of code on the left, and the effect of the Code on the webpage on the right,

The above section of the Code on the left is the definition, and the last sentence is the use,

The Code on the left is in reactjs format, and compiled js is the js compiled by jsx, Which is native js.


That is to say, you write a jsx file, compile it, and generate a js file. After this js file is run, it shows the effect on the right,

So what are the benefits?

Is encapsulation, a large js definition, and finally only one sentence of output, that is, a line of js Code corresponds to a ui component on the right.

The biggest role of reactjs is to develop ui components, such as this: http://material-ui.com/#/components/dropdown-menu

Cool effect: the webui component in the material ui style is developed based on reactjs.


I do not know whether I have used freemarker or freemarker for java. If I have used freemarker, I do not know whether I have used macros. Check the Code Section:

----------------------------------------------

-----------------------------------------------

------------------------------------

------------------------------------

In the first image, freemarker uses a macro to encapsulate the bootstrap button component,

The second image is bsbutton after the code is encapsulated,

The third image is the effect.


Has it found that it is very similar to reactjs, but reactjs is implemented at the front end,

Freemarker is implemented on the backend. The two are encapsulated and can pass parameters.


Remember, facebook's reactjs is a js framework used to develop the ui library. It features that it can encapsulate a large amount of code.


More

Npm vs maven

Angularjs vs freemarker (v)


More exciting: http://uikoo9.com/


Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.