눈이 핑 돌 때까지 스프레드시트를 쳐다본 적이 있나요?

저는 분명히 있습니다.

우리는 데이터를 정제하고, 추세를 분석하고, 그 하나의 황금 같은 통찰력을 찾는 데 몇 시간을 보냅니다.

하지만 어려운 부분이 남았습니다.

그것을 발표해야 한다는 것이죠.

보통 이는 정적인 파워포인트 슬라이드나 엑셀 차트의 스크린샷을 의미합니다.

흥미는 순식간에 사라집니다.

청중은 정적인 표를 보고 싶어 하지 않습니다.

그들은 데이터를 직접 다뤄보고 싶어 합니다.

그들은 "이 변수를 바꾸면 어떻게 되지?" 또는 "X 지역은 어떻게 보이지?"라고 묻고 싶어 합니다.

바로 여기서 데이터 스토리텔링이 등장합니다.

그리고 이를 가능하게 하는 도구를 만들기 위해 웹 개발자가 될 필요는 없습니다.

오늘 저는 간단한 데이터셋을 완전히 상호작용 가능한 웹 애플리케이션으로 바꾸는 방법을 보여드리겠습니다.

우리는 파이썬과 마법 같은 라이브러리인 Streamlit을 사용할 것입니다.

왜 저는 Streamlit을 장담하는가

저는 대시보드를 만드는 것을 두려워하곤 했습니다.

과거에는 모델이나 시각화를 공유하고 싶으면 Flask나 Django를 배워야 했습니다.

HTML, CSS, 자바스크립트와 씨름해야 했죠.

파이썬으로 코딩하고 싶었던 데이터 과학자에게는 악몽이었습니다.

그러다 Streamlit을 발견했습니다.

Streamlit은 데이터 스크립트를 몇 분 만에 공유 가능한 웹 앱으로 변환해 줍니다.

모두 순수 파이썬으로 말이죠.

프론트엔드 경험은 필요하지 않습니다.

이것은 여러분의 Jupyter Notebook과 완성된 제품 사이의 다리 역할을 합니다.

믿을 수 없을 정도로 빠른 반복 작업을 가능하게 합니다.

파이썬 한 줄을 바꾸고 저장을 누르면, 웹 앱이 즉시 업데이트됩니다.

이 튜토리얼에서 우리는 'My Core Pick'을 대표하므로, 품질과 속도에 집중하고 있습니다.

여러분의 첫 번째 서사적 대시보드를 만드는 방법을 알아보겠습니다.

준비 단계: 환경 설정

코드 한 줄을 작성하기 전에 작업 공간을 설정해야 합니다.

파이썬이 설치되어 있다고 가정하겠습니다.

그렇지 않다면 python.org에서 최신 버전을 받으세요.

저는 의존성을 깔끔하게 유지하기 위해 항상 가상 환경에서 작업하는 것을 추천합니다.

터미널이나 명령 프롬프트를 여세요.

프로젝트를 위한 새 폴더를 만듭니다.

bash mkdir streamlit_dashboard cd streamlit_dashboard

이제 가상 환경을 만듭니다.

bash python -m venv venv

가상 환경을 활성화하세요 (Windows에서는 venv\Scripts\activate, Mac/Linux에서는 source venv/bin/activate).

이제 주인공들을 설치해 봅시다.

앱을 위한 Streamlit, 데이터 조작을 위한 Pandas, 그리고 아름다운 상호작용 차트를 위한 Plotly가 필요합니다.

bash pip install streamlit pandas plotly

이게 다입니다.

코딩할 준비가 되었습니다.

기초: 데이터 불러오기

app.py라는 새 파일을 만드세요.

선호하는 코드 편집기에서 엽니다 (저는 VS Code를 사용합니다).

라이브러리를 임포트하는 것부터 시작해 봅시다.

python import streamlit as st import pandas as pd import plotly.express as px

이제 제목이 필요합니다.

Streamlit은 이를 믿을 수 없을 정도로 쉽게 만들어줍니다.

python st.set_page_config(page_title="Sales Dashboard", layout="wide") st.title("📊 Global Sales Narrative") st.markdown("## Analyze sales performance across different regions.")

다음으로 데이터가 필요합니다.

이 예제에서는 sales_data.csv라는 CSV 파일이 있다고 가정해 봅시다.

(가지고 있는 아무 데이터셋이나 사용하거나, 온라인에서 샘플 Superstore Sales 데이터셋을 다운로드할 수 있습니다).

데이터를 불러오는 함수를 작성할 것입니다.

왜 함수일까요?

Streamlit의 캐싱 메커니즘을 사용하고 싶기 때문입니다.

캐싱의 힘

사용자가 Streamlit 앱과 상호작용할 때마다(버튼 클릭, 필터 변경 등), 전체 스크립트가 위에서 아래로 다시 실행됩니다.

500MB짜리 CSV 파일을 불러온다면 엄청나게 느릴 것입니다.

우리는 이를 해결하기 위해 @st.cache_data 데코레이터를 사용합니다.

이것은 Streamlit에게 말합니다: "이 함수가 전에 실행된 적이 있다면, 그냥 저장된 결과를 줘. 다시 실행하지 마."

제가 작성하는 방식은 다음과 같습니다:

```python @st.cache_data def get_data(): df = pd.read_csv("sales_data.csv") # 약간의 정제 작업이 도움이 됩니다 df["Order Date"] = pd.to_datetime(df["Order Date"]) return df

df = get_data() ```

이제 작동하는지 확인해 봅시다.

저는 제정신인지 확인하기 위해 처음에 원본 데이터를 표시하는 것을 좋아합니다.

python if st.checkbox("Show Raw Data"): st.dataframe(df.head())

파일을 저장하세요.

터미널로 가서 다음을 실행합니다:

bash streamlit run app.py

브라우저 창이 팝업될 것입니다.

축하합니다. 웹 앱이 실행되었습니다.

서사 구성: 사이드바 및 필터

이야기는 청자가 경로를 선택할 때 더 좋습니다.

정적인 대시보드는 모두에게 모든 것을 보여주려 하기 때문에 지루합니다.

우리는 사용자에게 제어권을 주고 싶습니다.

Streamlit은 이 목적을 위해 특별히 사이드바를 제공합니다.

이는 시각화를 위해 메인 영역을 깔끔하게 유지합니다.

"Region(지역)"과 "Year(연도)"에 대한 필터를 추가해 봅시다.

사이드바 만들기

요소를 왼쪽에 배치하기 위해 st.sidebar를 사용합니다.

```python st.sidebar.header("Filter Options")

지역(Region)을 위한 다중 선택(multiselect) 생성

region = st.sidebar.multiselect( "Select Region:", options=df["Region"].unique(), default=df["Region"].unique() ) ```

이제 이 선택에 따라 실제로 데이터프레임을 필터링해야 합니다.

여기서 상호작용이 일어납니다.

python df_selection = df.query("Region == @region")

사용자가 사이드바에서 "North America"를 제거하면, df_selection이 즉시 업데이트됩니다.

데이터가 반응하는지 확인해 봅시다.

메인 페이지 상단에 바로 몇 가지 상위 수준 지표(KPI)를 표시할 수 있습니다.

KPI 표시하기

저는 st.metric 구성 요소를 사용하는 것을 좋아합니다.

전문적으로 보이며 중요한 숫자를 강조합니다.

필터링된 데이터를 기반으로 총매출(Total Sales)과 평균 평점(Average Rating)을 계산해 봅시다.

```python total_sales = int(df_selection["Sales"].sum()) average_rating = round(df_selection["Rating"].mean(), 1)

left_column, right_column = st.columns(2)

with left_column: st.metric(label="Total Sales", value=f"${total_sales:,}")

with right_column: st.metric(label="Average Rating", value=f"{average_rating} ⭐") ```

st.columns(2)가 보이시나요?

이것이 레이아웃을 관리하는 방법입니다.

화면을 동일한 너비의 두 열로 나눕니다.

이것은 수직적인 흐름을 끊어주며, 대시보드가 단순히 화면에 쏟아져 나온 것이 아니라 디자인된 것처럼 보이게 합니다.

스토리 시각화

이제 사용자 입력에 반응하는 데이터가 생겼습니다.

이제 시각화할 시간입니다.

Streamlit에도 기본 차트가 있지만, 저는 Plotly Express를 선호합니다.

Plotly 차트는 기본적으로 상호작용이 가능합니다.

데이터 포인트 위에 마우스를 올리거나, 확대하거나, 차트를 PNG로 다운로드할 수 있습니다.

막대형 차트

"어떤 제품 라인이 가장 성과가 좋은가?"라는 질문에 답해 봅시다.

제품 라인별 매출을 보여주는 막대형 차트를 만들 것입니다.

```python sales_by_product = ( df_selection.groupby(by=["Product Line"]).sum()[["Sales"]].sort_values(by="Sales") )

fig_product_sales = px.bar( sales_by_product, x="Sales", y=sales_by_product.index, orientation="h", title="Sales by Product Line", color_discrete_sequence=["#0083B8"] * len(sales_by_product), template="plotly_white", ) ```

이제 피규어 객체(fig_product_sales)가 생겼습니다.

이를 Streamlit에서 렌더링해야 합니다.

python st.plotly_chart(fig_product_sales, use_container_width=True)

use_container_width=True 인수가 중요합니다.

이는 차트가 열이나 화면의 너비에 맞춰 확장되도록 합니다.

이것이 앱을 다양한 화면 크기에서 반응형으로 보이게 만듭니다.

시계열

모든 데이터 스토리에는 타임라인이 필요합니다.

시간이 지남에 따라 매출 추이가 어떠했는지 보여줍시다.

이는 계절성이나 급격한 하락을 식별하는 데 도움이 됩니다.

```python

월별로 그룹화

df_selection["month_year"] = df_selection["Order Date"].dt.to_period("M") line_chart_data = df_selection.groupby(df_selection["month_year"].astype(str))["Sales"].sum().reset_index()

fig_sales_over_time = px.line( line_chart_data, x="month_year", y="Sales", title="Sales Over Time", template="plotly_white" )

st.plotly_chart(fig_sales_over_time, use_container_width=True) ```

이제 사이드바에서 지역을 변경하면 막대형 차트와 라인 차트 모두 즉시 업데이트됩니다.

사용자는 이야기를 단순히 읽는 것이 아니라 탐험하고 있는 것입니다.

사용자 경험 다듬기

기능은 완성되었습니다.

하지만 전문적인 대시보드는 조금 다듬을 필요가 있습니다.

'My Core Pick'에서는 좋은 것과 훌륭한 것의 차이는 디테일에 있다고 믿습니다.

기본 스타일 숨기기

Streamlit은 우측 상단에 "햄버거" 메뉴와 "Made with Streamlit" 푸터가 기본으로 제공됩니다.

깔끔하고 전문적인 룩을 위해, 저는 보통 CSS 주입을 사용하여 이것들을 숨깁니다.

네, CSS가 필요 없다고 했지만, 이것은 제가 비장의 무기로 가지고 있는 아주 작은 선택적 스니펫입니다.

python hide_st_style = """ <style> #MainMenu {visibility: hidden;} footer {visibility: hidden;} header {visibility: hidden;} </style> """ st.markdown(hide_st_style, unsafe_allow_html=True)

맥락 추가하기

차트만 보여주지 마세요.

사용자가 무엇을 보고 있는지 말해주세요.

st.markdown을 사용하여 해설을 추가하거나 데이터의 특이점을 설명하세요.

예를 들어, 라인 차트 아래에 다음과 같이 추가할 수 있습니다:

python st.markdown("---") st.caption("Note: Sales dipped in Q2 due to supply chain shortages in the North region.")

이 맥락은 원시 데이터를 실제 비즈니스 인텔리전스로 바꿉니다.

배포: 스토리 공유하기

만들었습니다. 로컬에서 실행됩니다.

하지만 노트북 안에 갇혀 있죠.

팀이나 세상이 보게 하려면 배포해야 합니다.

단연코 가장 쉬운 방법은 Streamlit Community Cloud입니다.

워크플로우는 다음과 같습니다:

1. requirements.txt 파일을 만듭니다. 이는 서버에 어떤 라이브러리를 설치해야 하는지 알려줍니다. 터미널에서 다음을 실행하세요: pip freeze > requirements.txt.

2. 코드를 GitHub에 푸시합니다. 저장소를 만들고 app.py, sales_data.csv, 그리고 requirements.txt를 업로드하세요.

3. Streamlit Cloud에 가입합니다. GitHub 계정을 연결하세요.

4. 저장소를 선택합니다. "Deploy"를 클릭하세요.

약 2분 후면 라이브 URL을 얻게 됩니다.

그 링크를 상사나 클라이언트에게 이메일로 보내거나 LinkedIn에 게시할 수 있습니다.

그들은 폰이나 노트북에서 열어볼 수 있습니다.

그들은 아무것도 설치할 필요가 없습니다.

결론

우리는 정적인 CSV 파일에서 완전히 상호작용하는 배포된 웹 애플리케이션으로 나아갔습니다.

그리고 100줄 미만의 파이썬 코드로 해냈습니다.

이것이 Streamlit의 힘입니다.

이것은 데이터 시각화를 민주화합니다.

데이터 과학자들이 가파른 학습 곡선 없이 풀스택 개발자가 될 수 있게 해줍니다.

여러분의 데이터에는 들려줄 이야기가 있습니다.

스프레드시트 속에 억누르지 마세요.

목소리를 부여하세요.

대시보드를 구축하고, 배포하고, 사용자가 스스로 서사를 탐험하게 하세요.

이번 주말에 시도해 보시길 권장합니다.

관심 있는 데이터셋을 가져오세요. Spotify 청취 기록일 수도 있고 피트니스 추적 데이터일 수도 있습니다.

자신을 위한 대시보드를 만들어 보세요.

나에게 반응하는 도구를 만들기 시작하면, 다시는 정적인 슬라이드로 돌아가고 싶지 않을 것입니다.