How can I develop a plugin for Kibana? - reactjs

I am really a beginner in ELK stack. I want to learn a plugin building for Kibana. I see their documentation for plugin building (https://www.elastic.co/guide/en/kibana/current/development-plugin-resources.html)
But the thing is, it's not enough for me or I can't understand it properly. I want to customize the Kibana dashboard with some other functionalities I want. I want to build the plugin by ReactJs in front-end. If anybody has any resource or any example codes to share it would be a great help for me. I am using Kibana and ElasticSearch both version 7.4.2

This might be an old question, but since I am facing the same issue, so maybe someone else could use this answer.
I found this presentation by Elastic for how to build you own Kibana plugin, it is an old one, they are working on Kibana 5 I guess, but could be a good starting point for someone.
https://www.elastic.co/elasticon/conf/2016/sf/how-to-build-your-own-kibana-plugins
I have also found this article that is more recent and the author uses ELK 7
https://chunkbytes.com/how-to-create-a-plugin-for-kibana/

Related

Integrating React Build file inside Django project

I have been building web apps using NextJS and Django for some time. But recently, my boss gave me the requirements for using ReactJS and using the build files inside Django as templates. Now, I have never tried it before, but according to this Tutorial, it is possible.
But my question is, should I do it? Would I face any performance issues in the future if I do this? Or will there be any bugs or issues related to routing?
I know I can try it myself, but I am looking for some expert advice from senior developers.

How can you build React on top of Drupal?

I've never used Drupal, but have been looking up tutorials online. My client would really like the adaptability of React and to have more flexibility in terms of design. I could make my own database and React app, but I have not studied security (I'm a team of one, so no one for security on my end, either). Security and access to a content management system was the main reason we decided to go with Drupal. However, I would still like to be able to code in React/something I'm familiar with to produce a site I am proud to say I made.
I've been Googling and Youtubing tutorials and help, but not having anyone to ask specific questions is making this difficult.
If anyone knows of a relatively easy way to build a React app on Drupal, I would really appreciate the advice. Or if there is a better way I should go about beginning a project as I've briefly mentioned above, I would also be open to that. Thank you in advance and sorry for the long message!
What you are asking is quite broad in concept and not easy to answer in just one answer post. Try to look for Headless / Decoupled Drupal.
https://www.acquia.com/drupal/decoupled-drupal
What this essentially means is that all the services and the content management are handled by Drupal while the core user experience or the way the site is displayed in a browser is controlled via a JavaScript framework such as React.js or backbone.js. This is achieved via Drupal’s RESTful API service.
Hope this helps.

How to integrate airbrake my project?

My project written with Node and AngularJs, I want integrate Airbrake, searched a lot but still can't imagine how. I see ways by do this using node, angular directive, express. Wiche one I must use? or maybe all together? Can someone explain me whole logic of this and show example. Thanks)
You can install the same airbrake-js library in both applications, since airbrake-js supports Node and browser applications. The README explains more and the examples directory is a good place to start: https://github.com/airbrake/airbrake-js

Front end material design stack with angular.js

I am trying to get better at coding and am trying to figure out exactly what front end stack I need. I have red a lot and about a lot of tools but it is too much and I don't know which ones work good together or not.
Currently my idea is to do a web app with the design principles of Material Design from google and use angular for the logic of the front end.
I have red about and used these tools: Angular.js, Material Design Lite, Angular-material, polymer, ionic, bootstrap, Materialize and other various material design frameworks.
I am playing with this demo that I wanted to try out Material Design Lite but went too further and ended up needing Polymer for some input drop-down components. Playing further more with MDL I found out that it is not sufficient as bootstrap as I am used to work and would like to have this in it, but don't get me wrong I like MDL.
ionic has some good features for the local server and easy set up of template app as well other nice things like export to ios,android app, push notifications, but I ended up deleting ionic.css cause it was interfering with MDL and Polymer
I am asking some more experienced web app developers to help me out with this stack dilemma. I would like to get this out of my mind so I can be free and develop more.
Also tools like GRUNT, BOWER and so on? which one is the best in my case?
note: if u got interested the back end would be cakePhP and Mysql and the data type is going to be JSON (angular will send json to php into DB).
It can be overwhelming trying to learn all the tools and using them at the same time. My advice is to just use the tools when you need to.
If your web app is simple you may not even need a framework like angular. If you want to play with material design, you can do that with the css classes that MD lite offers no matter if you use angular / polymer / or plain javascript. ( If you want to use Polymer you already have some material design styles included. )
Some people prefer starting with the most simple solution and keep adding more sophisticated tools gradually. Others prefer starting with a more complex solution that has integrated the best practices, and in that case using a "Starter kit" may be useful.
Regarding Grunt/gulp... etc. You could worry about that later when you need to have a "build system" to do tasks like compressing files, optimising images and other things that are important for publishing.
After years doing frontend development i realised that is not possible to master all the tools available ( and having a life outside code ). You eventually settle for some tools (everybody have different preferences) and the important experience comes with solving real problems.
i would recommend you to use angular-material for your project if :
you have good knowledge of angularjs or if you find it interesting to learn
you have gone through google design and you want to implement it in angularjs way
try implementing missing features or take online help
Angular-material team is working on adding more and more features as already build in directives and services. Check releases on github page & demo guide
( Drop downs are already there in latest version as menu)
Few points
Google has an awesome open source guide for design.
Angular-material is a framework that helps you implement and follow that design language and principles using angularjs.
Bootstrap is just a framework which gives implementation of css, js related to front end work. Look and feel will be entirely different from google design.
Ionic is again a completely different framework which provides implementation and guide for mobile app development.
You can read about diff in angular-material/bootstrap/ionic in my post here
Bower/Grunt
bower ( package manager) and grunt ( task runner) are tools which work in node environment.
if your development environment is nodejs you should use them to get work done quickly and efficiently.
Check there sites for more information.
cakePhp/mySql
If your backend runs on these and you have angularjs in frontend.
Angularjs can make restfull calls in JSON to your api and it would all work good.

Gulp unbuild from salesforce org

I am actually developping an application in a salesforce environment using MavensMate and Sublime Text 3, built with Gulp, in AngularJS from Yeoman.
I managed to connect my built application to salesforce thanks to CodeScience gulp angular tutorial on youtube, and can now develop my application locally, test it, build it, and finally send it to our org.
Right now i'm asking myself a question:
How can another person unbuild the metadata and static resources that I have built with Gulp after retrieving them using MavensMate ?
Isn't there any way to do it just so that we can work on different stuff on the project at the same time ?
That would be truely awesome, I haven't found a way to do it yet but will keep this post updated if I do.
Thanks for any help you might be able to provide.
I am the Director of Engineering at CodeScience. I'm glad you've had success with the Yeoman generator for our local SFDC UI stack. We use it a great deal internally to rapidly build SPAs in Salesforce. If I understand your question correctly, you are asking how to share code from a single or multiple SPAs (single page apps) with another developer. A better solution than sharing code through the static resource would be to use a version control solution like Git and a repository host like GitHub. We all work of our own branches (managed by push/pull requests) and branching in general works very well with our local build stack for rapid prototyping. Let me know if I, our or team can help you any further.
the answer is not to unbuild the static resource, but to distribute the source code to the other developers so they can build a new minified resource.

Resources