In what order should a new Streamlit feature be implemented?

The recommended order is Protobufs first, followed by Backend logic and Python tests, then Frontend components and Vitest tests, and finally E2E Playwright tests.

What are the three main areas this skill covers for Streamlit features?

It covers changes to the Protobuf definitions in 'proto/', Python backend logic in 'lib/streamlit/', and React frontend components in 'frontend/'.

Which testing frameworks are included in the implementation guide?

The guide includes instructions for Python unit tests (Pytest), frontend tests (Vitest), and end-to-end browser tests (Playwright).

How do I ensure my code follows Streamlit's style guidelines using this skill?

The skill includes final steps for running 'make autofix' for formatting and 'make check' to verify the entire implementation.

Streamlit Feature Implementation

Name: Streamlit Feature Implementation
Author: streamlit

bystreamlit

•

43,631

•

Data Science & ML

Streamlines the addition of new elements, widgets, and cross-stack functionality to the Streamlit framework.

This Claude Code skill provides a structured, step-by-step framework for developers contributing to the Streamlit open-source ecosystem. It guides users through the complex process of implementing new features across the entire stack, starting from Protobuf definitions and Python backend logic to React frontend components. By automating the workflow for elements and widgets, it ensures that all necessary tests—including Pytest, Vitest, and Playwright—are correctly implemented and verified, maintaining the high quality and performance standards of the Streamlit library.

Key Features

01End-to-end workflow for multi-layer feature implementation

0243,631 GitHub stars

03Standardized backend Python integration patterns

04Frontend React component rendering and registration steps

05Protobuf definition and code generation guidance

06Comprehensive testing suite orchestration (Unit, Vitest, E2E)

Use Cases

01Developing and registering a new interactive Streamlit widget

02Adding complex backend elements that require Protobuf updates

03Contributing high-quality features to the Streamlit open-source repository

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add streamlit/streamlit implementing-new-features

For use in Claude.ai and ChatGPT

Download Skill