[파이썬 프로젝트] HTML/CSS 몰라도 됩니다. 'Streamlit'으로 10분 만에 뉴스 검색 웹사이트 만들기

지난 포스팅에서 FastAPI로 네이버 뉴스를 긁어오는 '서버(Backend)'를 만들었습니다. 그런데 결과물이 까만 화면에 흰 글씨(JSON)뿐이라 좀 삭막했죠?

오늘은 HTML, CSS, 자바스크립트를 단 한 줄도 몰라도, 파이썬 코드만으로 **예쁜 웹사이트(Frontend)**를 만드는 마법의 도구, **'Streamlit(스트림릿)'**을 소개합니다.

데이터 분석가나 AI 엔지니어들이 "웹페이지 만들어주세요" 하면 무조건 이것부터 씁니다. 왜냐고요? 압도적으로 쉽거든요.

---

1. Streamlit이 뭔가요?

보통 웹사이트를 만들려면 HTML로 뼈대 잡고, CSS로 색칠하고, JS로 기능을 넣어야 합니다. (생각만 해도 머리 아프죠.)

Streamlit은 이 모든 과정을 파이썬 함수로 대체해 줍니다.

• st.title("제목") 이라고 쓰면 → 화면에 큰 제목이 뜹니다.
• st.button("클릭") 이라고 쓰면 → 클릭 가능한 버튼이 생깁니다.

마치 "파이썬으로 쓰는 블로그 에디터" 같은 느낌입니다.

---

2. 화면 구성하기 (app.py)

자, 바로 코드를 짜봅시다. app.py라는 파일을 만들고 아래 코드를 붙여넣으세요. 우리가 지난번에 만든 FastAPI 서버(http://127.0.0.1:8000/news)에 "뉴스 내놔" 하고 요청을 보내는 구조입니다.

Python

 

import streamlit as st
import requests

# 1. 화면 제목 달기
st.title("📰 달마의 실시간 뉴스 검색기")

# 2. 검색창 만들기
query = st.text_input("검색어를 입력하세요", "인공지능")

# 3. 버튼을 누르면 실행
if st.button("뉴스 검색 시작"):
    if query:
        try:
            # FastAPI 서버에 요청 보내기 (서버가 켜져 있어야 함!)
            response = requests.get(
                "http://127.0.0.1:8000/news",
                params={"query": query, "display": 5}
            )
            
            # 결과 받아서 화면에 뿌리기
            if response.status_code == 200:
                data = response.json()
                articles = data.get("articles", [])
                
                st.success(f"'{query}' 관련 뉴스 {len(articles)}개를 찾았습니다!")
                
                for article in articles:
                    # 링크 클릭하면 새 창으로 열리게 하기
                    st.markdown(f"### [{article['title']}]({article['link']})")
                    st.write("---") # 구분선
            else:
                st.error("뉴스 검색에 실패했습니다.")
                
        except Exception as e:
            st.error(f"서버와 연결할 수 없습니다. 서버가 켜져 있나요? ({e})")
    else:
        st.warning("검색어를 입력해주세요.")

---

3. 실행의 핵심: "터미널 2개 전략"

초보자들이 가장 많이 하는 실수가 **"코드 다 짰는데 왜 안 돼요?"**입니다. 이 시스템은 **서버(주방)**와 **화면(홀)**이 따로 돌아갑니다. 그래서 터미널을 2개 켜야 합니다.

Step 1. 주방 오픈 (FastAPI 서버) 첫 번째 터미널에서 서버를 켭니다.

Bash

 

python -m uvicorn main:app --reload

(초록색으로 Application startup complete가 떠야 합니다.)

Step 2. 홀 오픈 (Streamlit 화면) VS Code에서 터미널을 하나 더 열고(+ 버튼), 화면을 켭니다.

Bash

 

python -m streamlit run app.py

---

4. 결과 확인

두 번째 명령어를 치면 자동으로 인터넷 창이 열리면서 **"달마의 실시간 뉴스 검색기"**가 뜰 겁니다. 검색어에 '삼성전자'나 '파이썬'을 넣고 버튼을 눌러보세요.

순식간에 최신 뉴스를 가져와서 리스트로 보여줍니다. 링크를 누르면 해당 기사로 바로 이동까지 되죠. 이 모든 걸 만드는 데 30분도 안 걸렸습니다.

---

5. 마치며 (확장 가능성)

오늘 만든 건 아주 기초적인 기능입니다. 여기에 살을 붙이면 이런 것도 가능합니다.

1. AI 요약: 뉴스 본문을 가져와서 ChatGPT에게 "3줄 요약해 줘"라고 시키기.
2. 감성 분석: 이 뉴스가 호재인지 악재인지 판단해서 주식 투자에 활용하기.
3. 알림 봇: 매일 아침 특정 키워드 뉴스를 내 카톡으로 보내기.

파이썬과 Streamlit만 있으면 여러분의 아이디어를 현실의 서비스로 만드는 건 시간문제입니다. 지금 바로 도전해 보세요!