Creating better custom applications with the Splunk UI Toolkit

Use @splunk/create on Windows

Splunk Create’s package scripts are compatible with Windows and *nix systems. Windows users can run commands like yarn setup and yarn link:app without manually adjusting the scripts themselves to work. 

Add a new page to an app

Due to the nature of the Splunk app ecosystem, many individual files are required to create a viewable page when using ReactJS on Splunk. Previously, those files had to be manually created, placed in the right directories, and validated for the correct boilerplate code. The process has been simplified to the following:

1. In the application directory, run npx @splunk/create (or if you installed the full package, run splunk-create).
2. Respond to the prompts for the page name and the app.
   
3. The code files are automatically generated and you can edit them as needed.
   

The following video shows the whole process from beginning to end. Note that there is no sound.

Test your code

The Code Sandbox feature makes the Splunk UI Toolkit documentation useful and responsive, and provides an excellent reference as you develop your solution. For any code example in the @splunk/react-ui library, you can see a button at the top right of the code field, linking to an isolated playground on Code Sandbox that allows you to interact with that example and prototype any solutions you want to build from it. 

Discover the right example for you with the new Example Gallery experience

To help users better select which examples would be the most useful for them, in the navigation experience, each example is categorized and tagged to help better indicate what the example does and how it can help you. The categories are:

• App workflows. Common workflows Splunk developers require in their apps. Intended to inspire and be a starting point for developers looking to implement similar workflows with SUIT. However, these are not production ready apps themselves.
• Custom dashboards and visualizations. Specifically showcasing capabilities surrounding the Splunk Dashboard Framework and Splunk Visualizations library. Similar to above, they are meant to be starting points and are not production-ready apps themselves. 
• Apps showcase. Public facing apps that are shipped either on Github or Splunkbase. These apps are production-ready and can be used by customers who are interested in what the apps can do for them. For developers, the code in these apps are typically more in-depth implementations of SUIT and can be leveraged for more advanced use cases. 

The tags indicate certain aspects included within the code, for example, if that particular app uses Splunk searches or third party visualizations. The navigation experience also includes a filter search, which can help you find specific examples quickly based on tags or categories.

Review the expanded Examples Gallery

The Examples Gallery aims to assist developers new to the Splunk UI Toolkit, and even those who are new to ReactJS in general. Examples consist of:

• Specific implementations of certain packages to serve as living documentation
• Full applications that can be used in your Splunk environment 

The greatly expanded gallery includes the use of key packages in the toolkit, as well common use cases such as setup pages and third party visualizations. Here are some of the latest for you to clone, fork, or view:

• Appinspect UI. This showcase app provides an easy way for validating apps against selected AppInspect checks, and combines the capabilities of SUIT with Nextron.
• Login Pages. For apps outside of Splunk Web, create a simple login interface with SUIT to authenticate your user.
• Setup Pages. Developers can use SUIT to create setup pages (which are a standard requirement in many apps) and leverage the @splunk/splunk-utils package to store secrets.