You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@doris.apache.org by GitBox <gi...@apache.org> on 2020/08/10 02:16:22 UTC

[GitHub] [incubator-doris] hf200012 opened a new issue #4308: FE frontend and backend separation

hf200012 opened a new issue #4308:
URL: https://github.com/apache/incubator-doris/issues/4308


   
   ## Status Quo and Motivation
   
   The current Doris FE module has a simple http server and UI built in. The UI currently has relatively simple functions and is only used for the display of some information.
   
   At present, Doris does not use a frontend and backend separation framework, resulting in a large amount of html and js code embedded in the FE module. When we want to modify some frontend elements, we have to update and upgrade the main code, which is expensive to maintain.
   
   At the same time, the current http server is written by Netty, which has relatively simple functions. If more advanced functions are needed, a large amount of additional code needs to be written. There are already many very mature web frameworks in the industry, and we should use them to simplify our development.
   
   ## Implementation
   
   `Spring` is a very mature open source framework in the industry. It is very convenient to build a complete Web application through SpringMVC and Spring Boot. We can also easily use the spring framework to complete a series of functions such as authentication, session, and cookie. At the same time, RESTful standard API can be developed quickly.
   
   The UI code is completely stripped from the FE module. The FE module only provides standard RESTful API. This allows more flexible use of the frontend framework to develop Doris's UI interface. Here I choose to use `Vue` as the frontend framework, and I will transplant all the functions of the current WebUI to the new framework. This UI may not be the final form of the UI, but I think it is a good start, and more extensions can be made under this framework in the future.
   
   ## How to submit my code
   
   There are many code changes this time. In order to ensure that the code can be merged without affecting the trunk code, I am going to submit the code according to the following steps.
   
   1. Submit the new version of the API document for the interface Review.
   
   2. Submit the UI part, which is completely independent and will not affect the existing functions of the main code. Before the new version of RESTful API is enabled, this part of the code will not take effect.
   
   3. Submit the new RESTFul API code. This part only adds files and does not modify existing functions. And this part of the function will not be enabled, so you can ensure that the trunk code can still run normally.
   
   4. Submit a new version of HttpServer, based on Spring. This part of the code will replace the old http server implementation before, and connect the new version of the RESTful API and the new version of the UI. After the code is merged, all new functions are enabled.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@doris.apache.org
For additional commands, e-mail: commits-help@doris.apache.org


[GitHub] [incubator-doris] morningman closed issue #4308: [Proposal][UI][HttpServer] FE frontend and backend separation

Posted by GitBox <gi...@apache.org>.
morningman closed issue #4308:
URL: https://github.com/apache/incubator-doris/issues/4308


   


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@doris.apache.org
For additional commands, e-mail: commits-help@doris.apache.org


[GitHub] [incubator-doris] colordove commented on issue #4308: [Proposal][UI][HttpServer] FE frontend and backend separation

Posted by GitBox <gi...@apache.org>.
colordove commented on issue #4308:
URL: https://github.com/apache/incubator-doris/issues/4308#issuecomment-671784028


   > Nice Job!
   > 
   > Just have had a quick tour of the code, and some tips here could be of help:
   > 
   > * Precompiled css frameworks like `sass` `stylus` `less` might be better for a theme customization?
   > * Replace some `px` with `rem` might be better for the future responsive development?
   > * Use `mixin` for all pages that have a paginated table, instead of setting the same code in every page?
   > * A more detailed `eslint` configuration file?
   > * Using `jwt` or `session` instead of `basic auth` as an authentication method?
   > * Currently lack of multi-languages neither in the frontend nor the backend?
   > * Make an integration with `Swagger` to have a better API document maybe?
   > 
   > Actually there is a nice frontend template that we can refer to [vue-element-admin](https://github.com/PanJiaChen/vue-element-admin)
   
   Thank you for your advice! We were really inspired by it. But I don't understand what is lack of multi-languages means. Why we need multi-languages?
   
   And we have plans to rewrite the frontend page in the future. We will use React instead of Vue. 
   **Here are some reasons.**
   
   - Vue3.x is at release candidate stage. It has a lot of breaking changes from the 2.x,  If we use Vue 2.x, We have to rewrite it again in the future which is we don't want to do.
   
   - Our team uses React, So we hope to use common skillset.
   
   **Here is the skillset will looks like**
   - React
   - TypeScript
   - Less
   - Eslint
   - Webpack
   - RxJS
   - Antd
   
   Other Info
   - `rem` or `px` is ok
   - Paginate related code will be a `react hooks`, like `usePaginate`.
   - OAuth and Swagger are great ideas. We will consider whether to add them to our code.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@doris.apache.org
For additional commands, e-mail: commits-help@doris.apache.org


[GitHub] [incubator-doris] colordove commented on issue #4308: [Proposal][UI][HttpServer] FE frontend and backend separation

Posted by GitBox <gi...@apache.org>.
colordove commented on issue #4308:
URL: https://github.com/apache/incubator-doris/issues/4308#issuecomment-671800696


   > > Why we need multi-languages?
   > 
   > multi-languages is required. And default should be English.
   
   Get it!, Definitely it is required!


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@doris.apache.org
For additional commands, e-mail: commits-help@doris.apache.org


[GitHub] [incubator-doris] morningman commented on issue #4308: [Proposal][UI][HttpServer] FE frontend and backend separation

Posted by GitBox <gi...@apache.org>.
morningman commented on issue #4308:
URL: https://github.com/apache/incubator-doris/issues/4308#issuecomment-671137010


   Nice Job!
   I followed this feature for a while before, and it looks good to me.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@doris.apache.org
For additional commands, e-mail: commits-help@doris.apache.org


[GitHub] [incubator-doris] colordove edited a comment on issue #4308: [Proposal][UI][HttpServer] FE frontend and backend separation

Posted by GitBox <gi...@apache.org>.
colordove edited a comment on issue #4308:
URL: https://github.com/apache/incubator-doris/issues/4308#issuecomment-671784028


   > Nice Job!
   > 
   > Just have had a quick tour of the code, and some tips here could be of help:
   > 
   > * Precompiled css frameworks like `sass` `stylus` `less` might be better for a theme customization?
   > * Replace some `px` with `rem` might be better for the future responsive development?
   > * Use `mixin` for all pages that have a paginated table, instead of setting the same code in every page?
   > * A more detailed `eslint` configuration file?
   > * Using `jwt` or `session` instead of `basic auth` as an authentication method?
   > * Currently lack of multi-languages neither in the frontend nor the backend?
   > * Make an integration with `Swagger` to have a better API document maybe?
   > 
   > Actually there is a nice frontend template that we can refer to [vue-element-admin](https://github.com/PanJiaChen/vue-element-admin)
   
   Thank you for your advice! We were really inspired by it. But I don't understand what is lack of multi-languages means. Why we need multi-languages?
   
   We have plans to rewrite the frontend page in the future. We want to use React instead of Vue. 
   **Here are some reasons.**
   
   - Vue3.x is at release candidate stage. It has a lot of breaking changes from the 2.x,  If we use Vue 2.x, We have to rewrite it again in the future which is we don't want to do.
   
   - Vue2.x is not working very will with TypeScript, TypeScript is important and it's future.
   
   **Here is the skillset we want to looks like**
   - React
   - TypeScript
   - Less
   - Eslint
   - Webpack
   - RxJS
   - Antd
   
   In my opinion
   - `rem` or `px` is ok
   - Paginate related code could be a `react hooks`, like `usePaginate`.
   - OAuth and Swagger are great ideas. I think we can consider whether to add them to our code.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@doris.apache.org
For additional commands, e-mail: commits-help@doris.apache.org


[GitHub] [incubator-doris] colordove edited a comment on issue #4308: [Proposal][UI][HttpServer] FE frontend and backend separation

Posted by GitBox <gi...@apache.org>.
colordove edited a comment on issue #4308:
URL: https://github.com/apache/incubator-doris/issues/4308#issuecomment-671784028


   > Nice Job!
   > 
   > Just have had a quick tour of the code, and some tips here could be of help:
   > 
   > * Precompiled css frameworks like `sass` `stylus` `less` might be better for a theme customization?
   > * Replace some `px` with `rem` might be better for the future responsive development?
   > * Use `mixin` for all pages that have a paginated table, instead of setting the same code in every page?
   > * A more detailed `eslint` configuration file?
   > * Using `jwt` or `session` instead of `basic auth` as an authentication method?
   > * Currently lack of multi-languages neither in the frontend nor the backend?
   > * Make an integration with `Swagger` to have a better API document maybe?
   > 
   > Actually there is a nice frontend template that we can refer to [vue-element-admin](https://github.com/PanJiaChen/vue-element-admin)
   
   Thank you for your advice! We were really inspired by it. But I don't understand what is lack of multi-languages means. Why we need multi-languages?
   
   We want to rewrite the frontend page in the future. We want to use React instead of Vue. 
   **Here are some reasons.**
   
   - Vue3.x is at release candidate stage. It has a lot of breaking changes from the 2.x,  If we use Vue 2.x, We have to rewrite it again in the future which is we don't want to do.
   
   - Vue2.x is not working very well with TypeScript, TypeScript is important and it's future.
   
   **Here is the skill set we want to looks like**
   - React
   - TypeScript
   - Less
   - Eslint
   - Webpack
   - RxJS
   - Antd
   
   In my opinion
   - `rem` or `px` is ok
   - Paginate related code could be a `react hooks`, like `usePaginate`.
   - OAuth and Swagger are great ideas. I think we can consider whether to add them to our code.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@doris.apache.org
For additional commands, e-mail: commits-help@doris.apache.org


[GitHub] [incubator-doris] hffariel commented on issue #4308: [Proposal][UI][HttpServer] FE frontend and backend separation

Posted by GitBox <gi...@apache.org>.
hffariel commented on issue #4308:
URL: https://github.com/apache/incubator-doris/issues/4308#issuecomment-671760831


   Nice Job!
   
   Just have had a quick tour of the code, and some tips here could be of help:
   
   - Precompiled css frameworks like `sass` `stylus` `less` might be better for a theme customization?
   - Replace some `px` with `rem` might be better for the future responsive development?
   - Use `mixin` for all pages that have a paginated table, instead of setting the same code in every page?
   - A more detailed `eslint` configuration file? 
   - Using `jwt` or `session` instead of `basic auth` as an authentication method?
   - Currently lack of multi-languages neither in the frontend nor the backend?
   - Make an integration with `Swagger` to have a better API document maybe?
   
   Actually there is a nice frontend template that we can refer to [vue-element-admin](https://github.com/PanJiaChen/vue-element-admin)
   


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@doris.apache.org
For additional commands, e-mail: commits-help@doris.apache.org


[GitHub] [incubator-doris] morningman commented on issue #4308: [Proposal][UI][HttpServer] FE frontend and backend separation

Posted by GitBox <gi...@apache.org>.
morningman commented on issue #4308:
URL: https://github.com/apache/incubator-doris/issues/4308#issuecomment-671792496


   > Why we need multi-languages?
   
   multi-languages is required. And default should be English.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@doris.apache.org
For additional commands, e-mail: commits-help@doris.apache.org