웹 개발 입문
표와 지표CSV 읽어오기표를 검색하고 걸러내기편집 가능한 표그래프 그리기미니 프로젝트 · 데이터 대시보드
놀면 뭐 하니,
그냥 하는거야.

표와 지표

코딩냥

4부에 온 걸 환영한다냥! 마지막 기둥 데이터 를 배울 차례다냥. 오늘은 숫자와 목록을 표로 보기 좋게 보여주는 법을 배운다냥. 앱이 갑자기 전문가 도구처럼 보이기 시작한다냥!

오늘의 학습 목표

  • st.dataframe 으로 다룰 수 있는 표를 보여준다.
  • st.table 로 고정된 표를 보여준다.
  • st.metric 으로 핵심 숫자 하나를 크게 강조한다.
실습 준비·필요한 패키지와 버전
  • pandas2.2 이상표(DataFrame)로 데이터를 다루기
  • streamlit1.40 이상파이썬 코드로 웹 화면 만들기

설치하기 — 터미널에 그대로 붙여넣기

pip install "pandas>=2.2" "streamlit>=1.40"

설치 확인 — 버전 번호가 찍히면 성공

python -c "import pandas; print(pandas.__version__)"
python -c "import streamlit; print(streamlit.__version__)"

위 버전은 최소 기준이라, 더 높은 버전이 깔려 있으면 그대로 써도 된다냥. 버전이 안 찍히고 에러가 나면 설치가 안 된 거라 설치 명령을 다시 실행해보자냥.

1단계 · pandas 를 소개한다냥

코딩냥

표를 다루려면 pandas 라는 친구가 필요하다냥. 파이썬에서 표를 다루는 가장 유명한 도구다냥. Streamlit 을 설치할 때 같이 깔렸을 수도 있지만, 없으면 아래 한 줄로 설치하면 된다냥.

pip install pandas

데이터프레임이 뭐냥?

pandas 의 표를 데이터프레임(DataFrame) 이라고 부른다냥. 엑셀 시트를 떠올리면 된다냥 — 행과 열이 있는 표라냥. 딕셔너리로 쉽게 만들 수 있다냥!

2단계 · 표 만들고 보여주기 — dataframe

import streamlit as st
import pandas as pd

data = {
    "이름": ["코딩냥", "노랑이", "까망이"],
    "나이": [3, 5, 2],
    "간식": ["참치", "닭가슴살", "츄르"],
}

df = pd.DataFrame(data)

st.dataframe(df)

st.dataframe 은 살아있는 표라냥

이 표는 사용자가 열 제목을 눌러 정렬하거나, 가로로 스크롤할 수 있다냥. 데이터가 많을 때 특히 편하다냥. 딕셔너리를 pd.DataFrame(...) 으로 감싸기만 하면 된다냥!

3단계 · 고정된 표 — table

코딩냥

st.table 은 정렬이나 스크롤 없이 딱 고정된 표를 보여준다냥. 내용이 적고, 그냥 얌전히 보여주기만 하면 될 때 쓴다냥.

st.table(df)

dataframe vs table

특징언제 쓰냥
st.dataframe정렬·스크롤 가능데이터가 많을 때
st.table고정, 전부 표시데이터가 적고 얌전할 때

4단계 · 핵심 숫자 강조 — metric

코딩냥

대시보드를 보면 "오늘 매출 120만원 ▲5%" 처럼 큰 숫자 하나가 강조돼 있지? 그게 st.metric 이다냥. 11강 BMI 에서 살짝 써봤던 그거다냥!

st.metric("전체 냥이 수", 3)
st.metric("평균 나이", "3.3살", "+0.3")   # 세 번째 값은 변화량이라냥

세 번째 값은 증감 표시라냥

st.metric("평균 나이", "3.3살", "+0.3") 처럼 세 번째에 변화량을 주면, 초록 화살표와 함께 표시된다냥. 음수("-0.5")면 빨간 화살표가 된다냥!

5단계 · 직접 해보기

미션 · 우리 반 성적표

  • 친구 4명의 이름과 점수를 딕셔너리로 만들고
  • pd.DataFrame 으로 표를 만들어 st.dataframe 으로 보여주고
  • st.metric 으로 "반 평균 점수" 를 크게 보여주자냥.

평균은 파이썬으로 sum(점수들) / len(점수들) 로 구하면 된다냥!

복습 퀴즈

Q1.파이썬에서 표(데이터프레임)를 다루는 유명한 도구는?
Q2.정렬과 스크롤이 되는 살아있는 표를 보여주는 함수는?
Q3.핵심 숫자 하나를 크게 강조해서 보여주는 함수는?
코딩냥

표를 만들 수 있게 됐다냥! 그런데 매번 딕셔너리를 손으로 치는 건 힘들다냥. 다음 시간엔 파일에 저장된 데이터를 통째로 읽어오는 법을 배워보자냥. 진짜 데이터가 등장한다냥!

18 / 33
이전3부 · 기억하는 앱 · 연습하기 Level 2다음4부 · 데이터 다루기 · CSV 읽어오기