Spring boot admin add custom tab












0














I am looking to add a custom tab to spring boot admin server following the documentation at http://codecentric.github.io/spring-boot-admin/2.1.1/#customizing-custom-views-instance



However the documentation and the sample project https://github.com/codecentric/spring-boot-admin/tree/2.1.1/spring-boot-admin-samples/spring-boot-admin-sample-custom-ui do not seem to help understand how to go about it.



My understanding from reading the documentation and the example is that the ui is a separate module.



The pieces I seem to be missing are how do I bundle them ui module and spring boot admin server and serve them.



This is what I have tried thus far: https://github.com/anandsunderraman/custom-spring-boot-admin/tree/master










share|improve this question





























    0














    I am looking to add a custom tab to spring boot admin server following the documentation at http://codecentric.github.io/spring-boot-admin/2.1.1/#customizing-custom-views-instance



    However the documentation and the sample project https://github.com/codecentric/spring-boot-admin/tree/2.1.1/spring-boot-admin-samples/spring-boot-admin-sample-custom-ui do not seem to help understand how to go about it.



    My understanding from reading the documentation and the example is that the ui is a separate module.



    The pieces I seem to be missing are how do I bundle them ui module and spring boot admin server and serve them.



    This is what I have tried thus far: https://github.com/anandsunderraman/custom-spring-boot-admin/tree/master










    share|improve this question



























      0












      0








      0







      I am looking to add a custom tab to spring boot admin server following the documentation at http://codecentric.github.io/spring-boot-admin/2.1.1/#customizing-custom-views-instance



      However the documentation and the sample project https://github.com/codecentric/spring-boot-admin/tree/2.1.1/spring-boot-admin-samples/spring-boot-admin-sample-custom-ui do not seem to help understand how to go about it.



      My understanding from reading the documentation and the example is that the ui is a separate module.



      The pieces I seem to be missing are how do I bundle them ui module and spring boot admin server and serve them.



      This is what I have tried thus far: https://github.com/anandsunderraman/custom-spring-boot-admin/tree/master










      share|improve this question















      I am looking to add a custom tab to spring boot admin server following the documentation at http://codecentric.github.io/spring-boot-admin/2.1.1/#customizing-custom-views-instance



      However the documentation and the sample project https://github.com/codecentric/spring-boot-admin/tree/2.1.1/spring-boot-admin-samples/spring-boot-admin-sample-custom-ui do not seem to help understand how to go about it.



      My understanding from reading the documentation and the example is that the ui is a separate module.



      The pieces I seem to be missing are how do I bundle them ui module and spring boot admin server and serve them.



      This is what I have tried thus far: https://github.com/anandsunderraman/custom-spring-boot-admin/tree/master







      user-interface spring-boot-admin






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Nov 21 '18 at 20:46







      Anand Sunderraman

















      asked Nov 21 '18 at 19:08









      Anand SunderramanAnand Sunderraman

      3,3232667130




      3,3232667130
























          1 Answer
          1






          active

          oldest

          votes


















          1














          Did a successfull try to add custom tab in Spring Boot Admin Server.



          Pre Requisites :




          • Must have npm/node installed and added to $PATH

          • Node version must be > 8.0.0.

          • If not then download the latest Node from NodeSite

          • Spring boot Admin version 2.1.1

          • A admin/client in working condiition.


          Followed these steps(Generate-build the custom UI/Integrate Custom UI in server/Implement Endpoint at client side) :



          Generate/build the custom UI:




          1. Checked out the spring-boot-admin-custom-sample-ui locally. I am taking sample one as an example

          2. cd <spring-boot-admin-custom-sample-ui-directory>

          3. Run the command npm install


            • Above command will install all package. You may get few warnings(for peer dependencies) so try to resolve them as well via installing(npm install package-name@version-number) peer dependencies manually. These are npm package depdencies.



          4. Import the project in Intellij and Run the maven install command.


            • This will execute exec-maven-plugin and a target/dist directory would be created. If any error comes then try to resolve that. I was getting few errors like Node Version issue/vue-template-compiler not found.

            • In case of vue-template-compiler not found error comes then execute npm install vue-template-compiler@2.5.16

            • Once maven install completes the it should be done with generating the UI required for new custom tab. Now this needs to integrated in Admin Server. Maven install will install spring-boot-admin-sample-custom-ui on local repo as well.




          Integrate custome UI in Admin Server





          1. Just add new properties in application.properties(In order to inject new UI):



            spring.boot.admin.ui.cache.no-cache=true



            spring.boot.admin.ui.extension-resource-locations=file:spring-boot-admin-sample-custom-ui-directory-path/target/dist/



            spring.boot.admin.ui.cache-templates=false



          2. Add the dependency for spring-boot-admin-sample-custom-ui in server pom.xml. This was built on step 4.


          3. Start the Admin Server.



          Implement Endpoint at client Side :





          1. Add the below endpoint :



            @Endpoint(id = "custom")
            public class CustomEndpoint {
            @ReadOperation
            public String getHello(){
            return "Hello" ;
            }
            }



            @Bean
            public CustomEndpoint customEndpoint()
            {
            return new CustomEndpoint();
            }



          2. Start the client. You should see something like below on Server :
            Newly Added Custom Tab



          This was all about a sample end point. You can write your own View and follow the similar steps. The views must be implemented as Vue.js components.



          Hope this will ease down the process to add new custom tab in spring boot admin.






          share|improve this answer























            Your Answer






            StackExchange.ifUsing("editor", function () {
            StackExchange.using("externalEditor", function () {
            StackExchange.using("snippets", function () {
            StackExchange.snippets.init();
            });
            });
            }, "code-snippets");

            StackExchange.ready(function() {
            var channelOptions = {
            tags: "".split(" "),
            id: "1"
            };
            initTagRenderer("".split(" "), "".split(" "), channelOptions);

            StackExchange.using("externalEditor", function() {
            // Have to fire editor after snippets, if snippets enabled
            if (StackExchange.settings.snippets.snippetsEnabled) {
            StackExchange.using("snippets", function() {
            createEditor();
            });
            }
            else {
            createEditor();
            }
            });

            function createEditor() {
            StackExchange.prepareEditor({
            heartbeatType: 'answer',
            autoActivateHeartbeat: false,
            convertImagesToLinks: true,
            noModals: true,
            showLowRepImageUploadWarning: true,
            reputationToPostImages: 10,
            bindNavPrevention: true,
            postfix: "",
            imageUploader: {
            brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
            contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
            allowUrls: true
            },
            onDemand: true,
            discardSelector: ".discard-answer"
            ,immediatelyShowMarkdownHelp:true
            });


            }
            });














            draft saved

            draft discarded


















            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53418992%2fspring-boot-admin-add-custom-tab%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown

























            1 Answer
            1






            active

            oldest

            votes








            1 Answer
            1






            active

            oldest

            votes









            active

            oldest

            votes






            active

            oldest

            votes









            1














            Did a successfull try to add custom tab in Spring Boot Admin Server.



            Pre Requisites :




            • Must have npm/node installed and added to $PATH

            • Node version must be > 8.0.0.

            • If not then download the latest Node from NodeSite

            • Spring boot Admin version 2.1.1

            • A admin/client in working condiition.


            Followed these steps(Generate-build the custom UI/Integrate Custom UI in server/Implement Endpoint at client side) :



            Generate/build the custom UI:




            1. Checked out the spring-boot-admin-custom-sample-ui locally. I am taking sample one as an example

            2. cd <spring-boot-admin-custom-sample-ui-directory>

            3. Run the command npm install


              • Above command will install all package. You may get few warnings(for peer dependencies) so try to resolve them as well via installing(npm install package-name@version-number) peer dependencies manually. These are npm package depdencies.



            4. Import the project in Intellij and Run the maven install command.


              • This will execute exec-maven-plugin and a target/dist directory would be created. If any error comes then try to resolve that. I was getting few errors like Node Version issue/vue-template-compiler not found.

              • In case of vue-template-compiler not found error comes then execute npm install vue-template-compiler@2.5.16

              • Once maven install completes the it should be done with generating the UI required for new custom tab. Now this needs to integrated in Admin Server. Maven install will install spring-boot-admin-sample-custom-ui on local repo as well.




            Integrate custome UI in Admin Server





            1. Just add new properties in application.properties(In order to inject new UI):



              spring.boot.admin.ui.cache.no-cache=true



              spring.boot.admin.ui.extension-resource-locations=file:spring-boot-admin-sample-custom-ui-directory-path/target/dist/



              spring.boot.admin.ui.cache-templates=false



            2. Add the dependency for spring-boot-admin-sample-custom-ui in server pom.xml. This was built on step 4.


            3. Start the Admin Server.



            Implement Endpoint at client Side :





            1. Add the below endpoint :



              @Endpoint(id = "custom")
              public class CustomEndpoint {
              @ReadOperation
              public String getHello(){
              return "Hello" ;
              }
              }



              @Bean
              public CustomEndpoint customEndpoint()
              {
              return new CustomEndpoint();
              }



            2. Start the client. You should see something like below on Server :
              Newly Added Custom Tab



            This was all about a sample end point. You can write your own View and follow the similar steps. The views must be implemented as Vue.js components.



            Hope this will ease down the process to add new custom tab in spring boot admin.






            share|improve this answer




























              1














              Did a successfull try to add custom tab in Spring Boot Admin Server.



              Pre Requisites :




              • Must have npm/node installed and added to $PATH

              • Node version must be > 8.0.0.

              • If not then download the latest Node from NodeSite

              • Spring boot Admin version 2.1.1

              • A admin/client in working condiition.


              Followed these steps(Generate-build the custom UI/Integrate Custom UI in server/Implement Endpoint at client side) :



              Generate/build the custom UI:




              1. Checked out the spring-boot-admin-custom-sample-ui locally. I am taking sample one as an example

              2. cd <spring-boot-admin-custom-sample-ui-directory>

              3. Run the command npm install


                • Above command will install all package. You may get few warnings(for peer dependencies) so try to resolve them as well via installing(npm install package-name@version-number) peer dependencies manually. These are npm package depdencies.



              4. Import the project in Intellij and Run the maven install command.


                • This will execute exec-maven-plugin and a target/dist directory would be created. If any error comes then try to resolve that. I was getting few errors like Node Version issue/vue-template-compiler not found.

                • In case of vue-template-compiler not found error comes then execute npm install vue-template-compiler@2.5.16

                • Once maven install completes the it should be done with generating the UI required for new custom tab. Now this needs to integrated in Admin Server. Maven install will install spring-boot-admin-sample-custom-ui on local repo as well.




              Integrate custome UI in Admin Server





              1. Just add new properties in application.properties(In order to inject new UI):



                spring.boot.admin.ui.cache.no-cache=true



                spring.boot.admin.ui.extension-resource-locations=file:spring-boot-admin-sample-custom-ui-directory-path/target/dist/



                spring.boot.admin.ui.cache-templates=false



              2. Add the dependency for spring-boot-admin-sample-custom-ui in server pom.xml. This was built on step 4.


              3. Start the Admin Server.



              Implement Endpoint at client Side :





              1. Add the below endpoint :



                @Endpoint(id = "custom")
                public class CustomEndpoint {
                @ReadOperation
                public String getHello(){
                return "Hello" ;
                }
                }



                @Bean
                public CustomEndpoint customEndpoint()
                {
                return new CustomEndpoint();
                }



              2. Start the client. You should see something like below on Server :
                Newly Added Custom Tab



              This was all about a sample end point. You can write your own View and follow the similar steps. The views must be implemented as Vue.js components.



              Hope this will ease down the process to add new custom tab in spring boot admin.






              share|improve this answer


























                1












                1








                1






                Did a successfull try to add custom tab in Spring Boot Admin Server.



                Pre Requisites :




                • Must have npm/node installed and added to $PATH

                • Node version must be > 8.0.0.

                • If not then download the latest Node from NodeSite

                • Spring boot Admin version 2.1.1

                • A admin/client in working condiition.


                Followed these steps(Generate-build the custom UI/Integrate Custom UI in server/Implement Endpoint at client side) :



                Generate/build the custom UI:




                1. Checked out the spring-boot-admin-custom-sample-ui locally. I am taking sample one as an example

                2. cd <spring-boot-admin-custom-sample-ui-directory>

                3. Run the command npm install


                  • Above command will install all package. You may get few warnings(for peer dependencies) so try to resolve them as well via installing(npm install package-name@version-number) peer dependencies manually. These are npm package depdencies.



                4. Import the project in Intellij and Run the maven install command.


                  • This will execute exec-maven-plugin and a target/dist directory would be created. If any error comes then try to resolve that. I was getting few errors like Node Version issue/vue-template-compiler not found.

                  • In case of vue-template-compiler not found error comes then execute npm install vue-template-compiler@2.5.16

                  • Once maven install completes the it should be done with generating the UI required for new custom tab. Now this needs to integrated in Admin Server. Maven install will install spring-boot-admin-sample-custom-ui on local repo as well.




                Integrate custome UI in Admin Server





                1. Just add new properties in application.properties(In order to inject new UI):



                  spring.boot.admin.ui.cache.no-cache=true



                  spring.boot.admin.ui.extension-resource-locations=file:spring-boot-admin-sample-custom-ui-directory-path/target/dist/



                  spring.boot.admin.ui.cache-templates=false



                2. Add the dependency for spring-boot-admin-sample-custom-ui in server pom.xml. This was built on step 4.


                3. Start the Admin Server.



                Implement Endpoint at client Side :





                1. Add the below endpoint :



                  @Endpoint(id = "custom")
                  public class CustomEndpoint {
                  @ReadOperation
                  public String getHello(){
                  return "Hello" ;
                  }
                  }



                  @Bean
                  public CustomEndpoint customEndpoint()
                  {
                  return new CustomEndpoint();
                  }



                2. Start the client. You should see something like below on Server :
                  Newly Added Custom Tab



                This was all about a sample end point. You can write your own View and follow the similar steps. The views must be implemented as Vue.js components.



                Hope this will ease down the process to add new custom tab in spring boot admin.






                share|improve this answer














                Did a successfull try to add custom tab in Spring Boot Admin Server.



                Pre Requisites :




                • Must have npm/node installed and added to $PATH

                • Node version must be > 8.0.0.

                • If not then download the latest Node from NodeSite

                • Spring boot Admin version 2.1.1

                • A admin/client in working condiition.


                Followed these steps(Generate-build the custom UI/Integrate Custom UI in server/Implement Endpoint at client side) :



                Generate/build the custom UI:




                1. Checked out the spring-boot-admin-custom-sample-ui locally. I am taking sample one as an example

                2. cd <spring-boot-admin-custom-sample-ui-directory>

                3. Run the command npm install


                  • Above command will install all package. You may get few warnings(for peer dependencies) so try to resolve them as well via installing(npm install package-name@version-number) peer dependencies manually. These are npm package depdencies.



                4. Import the project in Intellij and Run the maven install command.


                  • This will execute exec-maven-plugin and a target/dist directory would be created. If any error comes then try to resolve that. I was getting few errors like Node Version issue/vue-template-compiler not found.

                  • In case of vue-template-compiler not found error comes then execute npm install vue-template-compiler@2.5.16

                  • Once maven install completes the it should be done with generating the UI required for new custom tab. Now this needs to integrated in Admin Server. Maven install will install spring-boot-admin-sample-custom-ui on local repo as well.




                Integrate custome UI in Admin Server





                1. Just add new properties in application.properties(In order to inject new UI):



                  spring.boot.admin.ui.cache.no-cache=true



                  spring.boot.admin.ui.extension-resource-locations=file:spring-boot-admin-sample-custom-ui-directory-path/target/dist/



                  spring.boot.admin.ui.cache-templates=false



                2. Add the dependency for spring-boot-admin-sample-custom-ui in server pom.xml. This was built on step 4.


                3. Start the Admin Server.



                Implement Endpoint at client Side :





                1. Add the below endpoint :



                  @Endpoint(id = "custom")
                  public class CustomEndpoint {
                  @ReadOperation
                  public String getHello(){
                  return "Hello" ;
                  }
                  }



                  @Bean
                  public CustomEndpoint customEndpoint()
                  {
                  return new CustomEndpoint();
                  }



                2. Start the client. You should see something like below on Server :
                  Newly Added Custom Tab



                This was all about a sample end point. You can write your own View and follow the similar steps. The views must be implemented as Vue.js components.



                Hope this will ease down the process to add new custom tab in spring boot admin.







                share|improve this answer














                share|improve this answer



                share|improve this answer








                edited Nov 25 '18 at 10:24

























                answered Nov 24 '18 at 21:04









                bittubittu

                332110




                332110






























                    draft saved

                    draft discarded




















































                    Thanks for contributing an answer to Stack Overflow!


                    • Please be sure to answer the question. Provide details and share your research!

                    But avoid



                    • Asking for help, clarification, or responding to other answers.

                    • Making statements based on opinion; back them up with references or personal experience.


                    To learn more, see our tips on writing great answers.





                    Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


                    Please pay close attention to the following guidance:


                    • Please be sure to answer the question. Provide details and share your research!

                    But avoid



                    • Asking for help, clarification, or responding to other answers.

                    • Making statements based on opinion; back them up with references or personal experience.


                    To learn more, see our tips on writing great answers.




                    draft saved


                    draft discarded














                    StackExchange.ready(
                    function () {
                    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53418992%2fspring-boot-admin-add-custom-tab%23new-answer', 'question_page');
                    }
                    );

                    Post as a guest















                    Required, but never shown





















































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown

































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown







                    Popular posts from this blog

                    404 Error Contact Form 7 ajax form submitting

                    How to know if a Active Directory user can login interactively

                    TypeError: fit_transform() missing 1 required positional argument: 'X'