Streamlit web development concept 



💻💻Streamlit documentation💻💻



Streamlit is an open-source Python library that allows developers to create interactive, web-based data applications with minimal effort. Below is an overview of Streamlit's documentation, including examples and functions.

Streamlit Overview:-

Streamlit is designed to make it easy to build and share data apps. It integrates seamlessly with Python scripts and provides a simple way to convert data scripts into interactive web applications.

Installation

First, you need to install Streamlit:

shCopy code
pip install streamlit

Running a Streamlit App:-

To run a Streamlit app, create a Python script (e.g., app.py) and use the following command:

shopy code
streamlit run app.py

Basic Example:-

Here's a basic example of a Streamlit app:

pythonopy code
import streamlit as st
import pandas as pd
import numpy as np

# Title
st.title('My First Streamlit App')

# Header
st.header('Introduction to Streamlit')

# Subheader
st.subheader('This is a subheader')

# Text
st.text('This is a simple text.')

# Markdown
st.markdown('**Markdown** text is also supported.')

# Dataframe
df = pd.DataFrame(
    np.random.randn(10, 5),
    columns=('col %d' % i for i in range(5))
)
st.dataframe(df)

# Chart
st.line_chart(df)

# Slider
x = st.slider('Select a value', 0, 100, 50)
st.write('Selected value:', x)

Key Streamlit Functions

Here are some of the key functions provided by Streamlit, along with their descriptions and examples.

Layout and Containers

  • st.title(title): Display a title.

    pythonCopy code
    st.title('This is a title')

  • st.header(header): Display a header.

    pythonCopy code
    st.header('This is a header')

  • st.subheader(subheader): Display a subheader.

    pythonCopy code
    st.subheader('This is a subheader')

  • st.text(text): Display text.

    pythonCopy code
    st.text('This is some text')

  • st.markdown(body): Display markdown text.

    pythonCopy code
    st.markdown('# This is a markdown heading')

  • st.write(*args): Display various objects like text, markdown, dataframes, and more.

    pythonCopy code
    st.write('Hello, world!', 1234, {'key': 'value'})

Displaying Data

  • st.dataframe(data): Display a dataframe as an interactive table.

    pythonCopy code
    import pandas as pd
st.dataframe(pd.DataFrame({'col1': [1, 2], 'col2': [3, 4]}))

  • st.table(data): Display a static table.

    pythonCopy code
    st.table(pd.DataFrame({'col1': [1, 2], 'col2': [3, 4]}))

  • st.json(data): Display JSON-encoded data.

    pythonCopy code
    st.json({'key': 'value', 'numbers': [1, 2, 3, 4]})

Charts

  • st.line_chart(data): Display a line chart.

    pythonCopy code
    import numpy as np
st.line_chart(np.random.randn(10, 2))

  • st.area_chart(data): Display an area chart.

    pythonCopy code
    st.area_chart(np.random.randn(10, 2))

  • st.bar_chart(data): Display a bar chart.

    pythonCopy code
    st.bar_chart(np.random.randn(10, 2))

Interactive Widgets

  • st.button(label): Display a button.

    pythonCopy code
    if st.button('Click me'):
    st.write('Button clicked!')

  • st.checkbox(label): Display a checkbox.

    pythonCopy code
    if st.checkbox('Check me'):
    st.write('Checkbox checked!')

  • st.radio(label, options): Display a set of radio buttons.

    pythonCopy code
    choice = st.radio('Pick one', ['A', 'B', 'C'])
st.write('You selected:', choice)

  • st.selectbox(label, options): Display a select box.

    pythonCopy code
    option = st.selectbox('Pick one', ['A', 'B', 'C'])
st.write('You selected:', option)

  • st.multiselect(label, options): Display a multi-select box.

    pythonpy code
    options = st.multiselect('Select multiple', ['A', 'B', 'C'])
st.write('You selected:', options)

  • st.slider(label, min_value, max_value, value): Display a slider.

    pythonpy code
    value = st.slider('Pick a number', 0, 100, 50)
st.write('Slider value:', value)

  • st.text_input(label): Display a text input box.

    python code
    text = st.text_input('Enter some text')
st.write('You entered:', text)

  • st.text_area(label): Display a text area.

    pythoy code
    text = st.text_area('Enter longer text')
st.write('You entered:', text)

  • st.date_input(label): Display a date input widget.

    pythonopy code
    date = st.date_input('Pick a date')
st.write('Selected date:', date)

  • st.time_input(label): Display a time input widget.

    pythonopy code
    time = st.time_input('Pick a time')
st.write('Selected time:', time)

  • st.file_uploader(label): Display a file uploader.

    pythonopy code
    file = st.file_uploader('Upload a file')
if file:
    st.write('File uploaded:', file.name)

  • st.color_picker(label): Display a color picker.

    pythonopy code
    color = st.color_picker('Pick a color')
st.write('Selected color:', color)

Advanced Usage

Customizing Layout

  • st.sidebar: Place widgets and text in a sidebar.

    pythonpy code
    st.sidebar.title('Sidebar Title')
st.sidebar.button('Sidebar Button')

  • st.beta_expander(label): Create an expandable/collapsible section.

    pythonopy code
    with st.beta_expander('See explanation'):
    st.write('Here is the explanation...')

  • st.beta_columns(spec): Create columns to organize layout.

    pythonode
    col1, col2, col3 = st.beta_columns(3)
col1.button('Button 1')
col2.button('Button 2')
col3.button('Button 3')

State Management

Streamlit allows you to manage state using session state, which can be useful for maintaining values across reruns.

pythoncode
if 'key' not in st.session_state:
    st.session_state['key'] = 'Initial value'

st.write(st.session_state['key'])

st.session_state['key'] = st.text_input('Update value', st.session_state['key'])

Further Resources

For comprehensive details and the latest updates, refer to the official Streamlit documentation:

These resources will provide you with the most up-to-date and detailed information on using Streamlit effectively. 



import streamlit as st
import pandas as pd

st.title('Streamlit Dashboard project')
st.header('We are just like a friend')
st.subheader('Ka ho raja')

st.write('This is a Normal text')
# use this for write the formula in standard format.
st.latex('x^2 + b^2 + 2ab')

st.markdown('''
### My Favourite movie
-Race3
-Humsufar 
-Houseful


''')

# For write the code same as
st.code('''
def square(input):
 return square**2
 x=square(2)

''')


df = pd.DataFrame({
    'Name': ['Ravi', 'Mukesh', 'Kishan', 'Ankit'],
    'Marks': [90, 80, 70, 60],
    'Packages': [30, 20, 15, 7]
})
st.dataframe(df)
# revenue
st.metric('Revenue', 'Rs 3L', '-3%')

# For json
st.json({
    'Name': ['Ravi', 'Mukesh', 'Kishan', 'Ankit'],
    'Marks': [90, 80, 70, 60],
    'Packages': [30, 20, 15, 7]
})

# Display media
# image
st.image('ravi.jpg')

st.video('WhatsApp Video 2024-05-01 at 12.02.53 PM.mp4')

# sidebar
st.sidebar.title('Ye hi hai sise bar dekho')
st.sidebar.video('WhatsApp Video 2024-05-01 at 12.02.53 PM.mp4')
st.sidebar.image('ravi.jpg')

#if i want to make a collumns side by side then.
col1, col2 = st.columns(2)


with col1:
    st.image('ravi.jpg')


with col2:
    st.video('WhatsApp Video 2024-05-01 at 12.02.53 PM.mp4')

☝☝ Form of login password with create button ☝☝

import streamlit as st
import pandas as pd

email=st.text_input('Enter email')
password = st.text_input('Enter the password')
btn=st.button('Beta login kara ho')

if btn:
   if email == 'rsinghlax@gmail.com' and password == '12345':
    st.success('Login successful')
else:
    st.error('Login failed')



please share and subscribe.



Comments

Post a Comment

Popular posts from this blog

Python Complete notes with code and explanation in hindi english both language.

Image
                                                                                                          PYTHON  Q1:- What is python programming language? Answer:-      Python is a high-level, interpreted programming language known for its simplicity and readability .  👉 It was created by Guido van Rossum and first released in 1991 . 👉  Python emphasizes code readability and simplicity, making. 👉  it a popular choice for beginners and experienced programmers alike. Key features of Python include:------------------- 1. **Easy-to-Read Syntax** : Python's syntax is designed to be intuitive and easy to understand, which reduces the cost of program maintenance and development. 2. **Int...
Read more

Overall company coding pratics with full concepts in python language.

Image
RAVI KUMAR SINGH                                     DAY :01                                 🔰 # guess the output data={} print(type(data)) # eska output disconary aayega. 🔰 #Guess the output of the code. a=set() print(a) # yah empty set ko generate krega. 🔰 #Guess the output of the code. print(-10//3)# yaha flwer division ho rha hai. # eska output -4 aayega kyuki jb 3 se divide krenge to -3aur-4 but near me -4 hoga aur near wale ko flower bolte hai aur dur bale ko ceil bolte hai. print(10//3) # output 3 aayega print(20//5) # output 4 aayega. # ye sabhi flower division ke example the . 🔰 # print the below output. # "python uses \n for new line" print( ' "python uses \\n for new line" ') # eska output same aayega 🔰 #print the output below # /\/\/\/\ print('/\\/\\/\\/\\')# yadi 3 back slash cheia to 6 back slash...
Read more

Find the largest three distinct elements in an array

 // C++ program for find the largest // three elements in an array #include <bits/stdc++.h> using namespace std; // Function to print three largest elements void print3largest(int arr[], int arr_size) { int first, second, third; // There should be atleast three elements if (arr_size < 3) { cout << " Invalid Input "; return; } third = first = second = INT_MIN; for(int i = 0; i < arr_size; i++) { // If current element is // greater than first if (arr[i] > first) { third = second; second = first; first = arr[i]; } // If arr[i] is in between first // and second then update second else if (arr[i] > second && arr[i] != first) { third = second; second = arr[i]; } else if (arr[i] > third && arr[i] != second) third = arr[i]; } cout << "Three largest elements are " << first << " " << second << " "...
Read more