Build Your First Streamlit App with Python

Updated on Jan 04,2024

Build Your First Streamlit App with Python

Table of Contents

  1. Introduction
  2. What is Streamlit?
  3. Installing Python and Streamlit
  4. Setting Up a Virtual Environment for Python
  5. Creating Your First Streamlit Application
  6. Understanding Streamlit Components and Widgets
    • 6.1 Headers
    • 6.2 Sidebars
    • 6.3 Hamburger Menus
  7. Defining the Content of a Web Application
  8. Building the Body Content of a Web Application
  9. Adding Footers to Your Web Application
  10. Conclusion

What is Streamlit and How to Create Your First Application

Streamlit is an open-source Python library used for building interactive web applications. It provides an easy and efficient way to deploy machine learning models, data analysis tools, and other data-driven applications. In this article, we will explore the capabilities of Streamlit and learn how to Create our first web application using this powerful library.

1. Introduction

In this digital age, where data is the new oil, having the ability to present data in an engaging and interactive manner is crucial. Whether You are a data scientist, machine learning engineer, or a business analyst, having a tool that allows you to showcase your work effectively is essential. This is where Streamlit comes into play.

2. What is Streamlit?

Streamlit is a Python library that simplifies the process of creating data-driven web applications. It allows you to build and deploy web applications directly from your Python scripts, without having to write any HTML, CSS, or JavaScript code. With Streamlit, you can focus on the logic and functionality of your application, while the library takes care of the user interface and interactivity.

3. Installing Python and Streamlit

Before we can start building our first Streamlit application, we need to ensure that we have the necessary software installed. Firstly, we need to have Python installed on our local system. You can download the latest version of Python from the official Python Website (https://www.python.org/).

Once Python is installed, we need to install the Streamlit library. This can be done using the pip command, which is the Python Package manager. Open your terminal or command prompt and Type the following command:

pip install streamlit

This will download and install the Streamlit library on your system, making it ready for use in your projects.

4. Setting Up a Virtual Environment for Python

To keep our project dependencies isolated and to avoid conflicts between different versions of libraries, it is recommended to set up a virtual environment for Python. A virtual environment is a self-contained directory where you can install packages and keep them separate from your system's Python installation.

To create a virtual environment, open your terminal or command prompt and navigate to the directory where you want to create the environment. Then, run the following command:

python -m venv myenv

This will create a new virtual environment named "myenv" in the Current directory. To activate the virtual environment, run the appropriate command Based on your operating system:

  • For Windows: myenv\Scripts\activate
  • For macOS/Linux: source myenv/bin/activate

Once the virtual environment is activated, you can proceed with installing Streamlit and other necessary libraries specific to your project.

5. Creating Your First Streamlit Application

Now that we have set up our Python environment and installed the Streamlit library, let's create our first Streamlit application. In your preferred text editor or IDE, create a new Python file and save it as "hello_world.py" (or any other name of your choice) in your project directory.

To start coding, we first need to import the necessary libraries. In this case, we need to import the Streamlit library, which has been installed in our virtual environment. Open your "hello_world.py" file and add the following line of code at the top:

import streamlit as st

The "streamlit" library has been imported and we can now use its features to build our web application. For our first app, let's keep it simple and just display a title. Add the following line of code to your "hello_world.py" file:

st.title("Hello, World! My First App")

This code uses the st.title function to set the title of our application. Feel free to change the text inside the quotation marks to customize the title according to your preference.

Save the file and return to your terminal or command prompt. Make sure your virtual environment is activated and navigate to the directory where your "hello_world.py" file is located. Type the following command to run the Streamlit application:

streamlit run hello_world.py

After executing this command, Streamlit will automatically detect the changes in your code and deploy your web application locally. The application will open in your default web browser, and you will be able to see the title displayed on the page.

Congratulations! You have successfully created and executed your first Streamlit application. Now that you have a basic understanding of Streamlit, let's dive deeper into some of its key components and widgets.

6. Understanding Streamlit Components and Widgets

Streamlit provides various components and widgets that you can use to enhance the interactivity and functionality of your web applications. In this section, let's explore some of the commonly used components:

6.1 Headers

Headers are used to create different sections or headings within your web application. You can use the st.header function to add a header to your application. Headers help in organizing and structuring your content in a visually appealing way.

6.2 Sidebars

Sidebars are a convenient way to add additional information or options to your web application. You can use the st.sidebar function to create a sidebar and add content to it. Sidebars are typically used to display controls, filters, or additional insights related to the main content.

6.3 Hamburger Menus

Hamburger menus are a common design pattern used to toggle navigation or additional options in a web application. Streamlit provides the st.beta_expander function to create a hamburger menu. You can add content inside the hamburger menu that is Hidden by default and can be expanded by the user.

7. Defining the Content of a Web Application

The body content of a web application consists of the main information or functionality that you want to present to the user. This can include text, images, data visualizations, or interactive elements. Streamlit provides various functions such as st.text, st.image, and st.plotly_chart to add content to your application.

8. Building the Body Content of a Web Application

To add different components to the body content of your web application, you can combine the functions provided by Streamlit. For example, you can add text using st.text, display an image using st.image, and create interactive visualizations using st.plotly_chart.

9. Adding Footers to Your Web Application

Footers are often used to display additional information or links at the bottom of a web page. Streamlit provides the st.footer function to add a footer to your application. You can use this function to display copyright information, links to additional resources, or any other Relevant information.

10. Conclusion

In this article, we have explored the basics of Streamlit and learned how to create our first web application using this powerful library. Streamlit provides a user-friendly and efficient way to build data-driven applications, making it a valuable tool for data scientists, machine learning engineers, and business analysts. By leveraging Streamlit's components and widgets, we can create interactive and engaging web applications to showcase our data and insights.

Thank you for reading this article and I hope you found it informative and helpful. If you would like to learn more about Streamlit and other Python libraries for data science and web development, consider subscribing to my Channel for more interesting videos and tutorials.

Most people like