[인공지능사관학교: 자연어분석A반] JavaScript (8) / LangChain (2)

Suhyeon Lee·2025년 8월 26일

Ⅰ. 오전 수업
	A. 1교시
		1. 지난 시간 복습
		2. 노드 생성
        3. 실습 1: 단순한 텍스트를 포함한 요소 생성
	B. 2교시
		1. 실습 2: 속성이 포함된 태그 생성
        2. 실습 3: 요소 삭제하기
        3. 실습: To-Do List 만들기
	C. 3교시
		1. 실습: To-Do List 만들기 (cont.)

Ⅱ. 오후 수업
	A. 4교시
		1. 지난 시간 복습
		2.
	B. 5교시
		1.
		2.
	C. 6교시
		1.
		2.

Ⅲ. CAREER UP
	미니 프로젝트

읽어두면 좋을 글: 거짓된 경험(이력)에 대하여
"왜 그렇게 했는가(Why), 무엇과 비교했는가(Options), 무엇을 감수했는가(Trade-offs), 무엇이 달라졌는가(Outcome)를 말할 수 없다면 그 경험은 사실상 거짓된 경험(이력)에 가깝다고 생각합니다. “대규모 트래픽 대응 경험”이라는 한 줄 뒤에, 병목을 어떻게 식별했는지(지표·프로파일·재현 시나리오), 어떤 선택지(스케일업/스케일아웃/캐시/큐/스로틀링)를 비교했는지, 왜 그중 하나를 택했는지(비용·복잡도·리스크), 그리고 결과적으로 무엇이 달라졌는지(지표의 전후 비교, 실패와 회고) 말할 수 있느냐 없느냐는, 큰 차이죠. 말할 수 있다면, 누가 뭐라하더라도 그것은 나의 것입니다. 반대로 이런 고리가 비어 있다면, 그 한 줄은 다음 면접에서 몇 개의 질문이면 쉽게 무너질 가능성이 큽니다."

Ⅰ. 오전 수업

A. 1교시

1. 지난 시간 복습

jQuery 라이브러리
- 익스플로러 있던 시절 이벤트 등록: 크롬은 addEventListener, 익스플로러는 attachEvent → 똑같은 언어를 쓰는데 브라우저마다 코드를 따로 적는 건 너무 불편해! 통합하자! → 크로스브라우징(CrossBrowsing) 개념 도입: 웹 브라우저 간 동등성
- jQuery: 모든 브라우저에서 동작하는 자바스크립트를 간편하게 사용할 수 있도록 단순화시킨 오픈소스 기반 라이브러리
- jQuery 문법 사용을 위한 2가지 방법
  1. 직접 다운로드: 업데이트에 대한 대응이 느리지만 안정적
  2. CDN(Content Delievery Network): 업데이트 대응 빠르지만 → 코드 공유 시 주로 사용
- 문법: $(요소명|선택자)
  - $(…) 안에 선택자를 넣어 원하는 HTML 요소를 선택하여 jQuery 객체로 반환
순수 JS(Vanila JS) vs. jQuery

	순수 JS	jQuery
기반	객체 key 값	함수
접근	.key	기능을 호출
수정	대입(할당)	매개 변수

실습: 다크모드 실습 내용 jQuery 문법으로 바꾸기
- hasClass(), addClass(), removeClass()
- 클래스는 복수개를 가질 수 있으므로 normal 넣었으면 dark는 빼주어야 함

주의점: 순수 js와 jQuery는 혼합해서 사용하지 말자
- ajax(비동기 통신)할 때 jQuery 가장 많이 사용
  - fetch, async/await

2. 노드 생성

노드: 웹을 구성하는 가장 작은 단위
- node.js의 노드와는 조금 다른 개념
- 태그 노드, 컨텐츠 노드, 속성 노드 → 가장 작은 단일 요소 (각각 따로 존재)
태그를 만들어 쓰는 법 익히기
- 명령 대상: document

3. 실습 1: 단순한 텍스트를 포함한 요소 생성

<span>생성된 텍스트입니다.</span>을 컴퓨터가 만들게 시키자
프로세스
1. span 태그 생성
  - let span = document.createElement("span");
  - 화면이나 개발자 모드 Elements에 보이지 않지만 존재함
  - console.log(span); 하면 개발자 모드 콘솔창에서 확인 가능
2. 컨텐츠 생성
  - 컨텐츠도 결국 하나의 작은 노드 → document에게 명령한다! (화면 관련 모든 명령은 다 document에게)
  - let text = document.createTextNode("안녕");
  - console.log(text); 해서 내용 확인해보기
3. span + 컨텐츠 합치기
  - 태그 노드 + 컨텐츠 노드 결합 → 태그가 컨텐츠의 부모가 된다.
  - span.appendChild(text);
4. 화면에 보여주기 위해 생성한 요소를 div 태그 안에 넣기
  - let div = document.getElementById("container");
  - div.appendChild(span);

appendChild 더 알아보기
span.appendChild(text);의 반환값은 text 노드 자신이기 때문에 변수에 넣을 수는 있지만, 일반적으로 별 의미가 없습니다. appendChild는 DOM 구조를 변경한 뒤, 추가된 자식 노드를 반환합니다. 하지만 appendChild의 반환값을 활용하는 실용적 예는 드물며 대체로 코드를 간결하게 하기 위해 바로 호출하는 경우가 많습니다.

B. 2교시

1. 실습 2: 속성이 포함된 태그 생성

let img = document.createElement("img");
속성 만드는 법 2가지
1. 객체에 키 값 추가하는 방법 응용
  - img.src = "★이미지주소★";
2. .createAttribute로 속성 노드 생성
  `
화면에 표출
- div.appendChild(img);

2. 실습: 요소 삭제하기

삭제할 요소 이름을 가지고 온 다음 .remove(); 하면 됨
요소를 제어할 때 포인트: 순서를 잘 기억하자!
- 1) 태그 생성 2) 컨텐츠, 속성 생성 3) 태그 + 컨텐츠 + 속성 연결 4) 완성된 요소를 화면에 표출(div 태그에 넣어주기)
- 태그 안에 태그 or 컨텐츠를 넣을 때는 자식으로 넣는다 → appendChild
- 태그 안에 속성을 넣을 때는 자식이 아닌 key 값으로 넣는다.

2. 실습: To-Do List 만들기

사용자가 버튼을 누르면 input에 있는 값을 가지고 li 태그를 생성 후 ul에 넣어주기
- li 태그 생성
  - let li = document.createElement("li");
- 컨텐츠 생성: input의 값을 활용
  - let input = document.getElementById("text");
  - let content = document.createTextNode(input.value);
  - li.appendChild(content);
- ul 태그에 생성한 li 태그 넣어주기
  - let ul = document.getElementById("container");
  - ul.appendChild(li);

버튼을 제작해서 li 태그와 함께 연결 → 누르면 li가 삭제

const makeLi = () => {
    let li = document.createElement("li");
    let input = document.getElementById("text");
    let content = document.createTextNode(input.value);

    // 버튼을 제작해서 li 태그와 함께 연결 → 누르면 li가 삭제
    let button = document.createElement("button");
    let buttonContent = document.createTextNode("삭제하기");
    button.appendChild(buttonContent);
    button.addEventListener("click",()=>{
        li.remove();
    });

    li.appendChild(content);
    li.appendChild(button);

    let ul = document.getElementById("container");
    ul.appendChild(li)
}
document.getElementById("btn").addEventListener("click",makeLi);

사용자 편의성 개선
- 검색창 리셋: input.value="";
- 사용자가 값을 입력하지 않은 경우 등록이 안 되고 메시지를 전달해 주기: 조건문

if(input.value===""){
  alart("값을 입력하세요!");
}else{
  ul.appendChild(li);
  input.value="";
};

추가: 변수명 carmel vs. snake
- fontSize
- font_size
- 속성 명명은 보통 하이픈(-) e.g., font-size
변수명은 최대한 쉽게 짓는 게 좋음

C. 3교시

1. 실습: To-Do List 만들기 (cont.)

유효성 검사 ★
input을 사용하면 무조건 값이 비어있는지 여부를 검사해야 함

input

Ⅱ. 오후 수업

A. 4교시

1. 지난 시간 복습

프롬프트 작성 원칙
- 모델이 최대한 정확하고 유용한 정보를 제공할 수 있도록 효과적인 프롬프트를 작성해야 함
1. 명확성과 구체성
  - 질문은 명확하고 구체적이어야 함
  - 모호한 질문은 LLM 모델의 혼란을 초래
  - 예: 주식 시장은 어때? → "다음 주 주식 시장에 영향을 줄 수 있는" "예정된 이벤트들"은 무엇일까?
2. 배경 정보 포함
  - 모델이 문맥을 이해할 수 있도록 필요한 배경 정보 제공 → 환각 현상(hallucination) 감소 및 관련성 높은 응답 생성
  - 예: "2020년 미국 대선의 결과를 바탕으로" 현재 정치 상황에 대한 분석을 해주세요
3. 간결함
  - 핵심 정보에 초점을 맞추고, 불필요한 정보는 배제
  - 복잡하면 덜 중요한 부분에 집중하거나 상당한 영향을 받는 문제 발생
  - 예: "2021년에 발표된 삼성전자의 ESG 보고서"를 요약해주세요.
4. 열린 질문 사용
  - 열린 질문을 통해 모델이 자세하고 풍부한 답변을 제공하도록 유도
  - 예/아니오로 답변하는 질문보다는 많은 답변을 요구하는 질문
  - 예: 신재생에너지에 대한 최신 연구 동향은 무엇인가요?
5. 명확한 목표 설정
  - 얻고자 하는 정보나 결과의 유형을 정확하게 정의 → 명확한 지침에 따라 응답을 생성
  - 예: AI 윤리에 대한 문제점과 해결 방안을 요약하여 설명해주세요.
6. 언어와 문체
  - 대화의 맥락에 적합한 언어와 문체를 선택
  - 상황에 맞는 표현 선택
  - 공식적인 보고서를 요청하는 경우, "XX 보고서에 대한 전문적인 요약을 부탁드립니다."와 같이 정중한 문체를 사용
7. 페르소나 설정
  - llm에게 역할을 부여
  - 예: 당신은 인공지능 전문 강사입니다. ~
LCEL(LangChain Expression Language)
- 파이프라인(|)으로 체인 생성: prompt | llm | OutputParser

2. LangChain 모델 유형

두 가지 유형이 존재
1. LLM
  - 단일 요청에 대한 출력 생성
2. Chat Model
  - 사용자와의 상호작용을 통한 연속적인 대화관리에 더 적합
최근 LLM에서 Chat Model로 넘어가는 추세 BUT 상황에 맞는 클래스 사용 권장
- LLM (OpenAI 클래스를 가져와서 사용): 단순 문자열 입력, 출력 (기본적인 구조)
- Chat model(ChatOpenAI 클래스를 가져와서 사용): 대화 형태로 상호 작용이 필요한 경우 사용
  - 사실 Memory chain 연결 안 하고 프롬프트 정의 안 하면 LLM과 거의 동일함
  - 하지만 OpenAI에서 두 가지를 구분지어 출시했기 때문에 구분지어 기억해두는 게 좋음

3. LLM 클래스

텍스트 문자열을 입력 받아 단일 텍스트 문자열로 반환

# LLM 모델 사용을 위한 OpenAI 불러오기
from langchain_openai import OpenAI

# LLM 모델 생성
llm_basic = OpenAI() # gpt-3.5 기본 모델

# 프롬프트 작성
prompt = "What colour is an apple?"

# 답변 출력
print(llm_basic.invoke(prompt))

The typical colour of an apple is red or green. However, other varieties of apples can also be yellow, pink, or even purple.

# 프롬프트 길이에 답변 내용 영향이 있을까?
prompt = "Could you tell me what colour of an apple is?"
print(llm_basic.invoke(prompt))

The color of an apple can vary, but it is typically shades of red, green, or yellow. Some apples may also have a combination of these colors.

Huggingface 모델 연동 사용

gpt2, KoGPT 모델들을 LangChain에 붙여서 OpenAI와 같은 인터페이스로 호출 가능
- LangChain은 OpenAI 전용이 아니라 여러 LLM 엔진을 함께 활용할 수 있음

# huggingface 모델을 불려와 연동하기 위한 라이브러리
!pip install -qU huggingface_hub langchain_huggingface
from langchain_huggingface import HuggingFacePipeline

# 모델 객체 생성
hf_pipe = HuggingFacePipeline.from_model_id(
    model_id="gpt2"
    , task="text-generation"
)

hf_pipe.invoke("red apple is")

red apple is a huge fruit, and it's a good choice for a summer morning snack or for a snack that's a little dry.

Prawns and the other type of vegetable are also a great snack to eat with the other veggies. You can make them into a vegetable salad or a salad for a summer party or just go with a salad or salad for dinner.

Pork

Pork is a great alternative to meat, so you can make it very simple to make a chicken soup with only one ingredient. You can also make it as a whole, or as a single meal.

This simple recipe gives you a lot of flavor for a summer meal, and it's also great for a long weekend.

The best thing about making this vegetarian vegetarian soup recipe is that it doesn't rely on meat, but instead only contains a small portion of protein.

This recipe gets you great protein from vegetables, eggs, grains, and even milk.

The key to making this vegetarian vegetarian soup recipe is to only make one ingredient. You can make a single ingredient soup without using meat.

If you make this vegetarian vegetarian soup recipe as a whole, you'll have a lot more flavor and flavor. And if you make it as

# 한국어 모델도 써 보기 (기본 성능은 별로임 → 프롬프트 엔지니어링 필요)
hf_pipe2 = HuggingFacePipeline.from_model_id(
    model_id="skt/kogpt2-base-v2"
    , task="text-generation"
)
hf_pipe2.invoke("빨간색 사과는")

빨간색 사과는 지난해 7월, 청와대 홈페이지 게시판에 '과거사 왜곡에 대한 사과'를 요구하는 글을 한 바 있다.
박 대통령은 지난해 10월 국정현안점검조정회의에서 "진실화해위원회 조사 결과 박 대통령은 민간인 사찰에 관여한 사실이 확인됐다"며 "국가정보원이 과거사 정리 사업을 통해 민간인 사찰을 했다는 의혹을 밝혀냈기 때문에 더 이상 국정공백이 있어서는 안 된다"고 강조한 바 있다.
당시 박 대통령은 "진실은 정의로울 것이다, 진실규명은 정의의 출발점이다, 진실규명은 정의를 향하는 길이다, 이런 말씀을 드렸다"면서 "진실이 규명되는 대로 국민 앞에 낱낱이 밝히고 책임지는 모습을 보여드리겠다"고 밝혔다. 청와대 고위 관계자는 연합뉴스와의 통화에서 "박 대통령이 오늘 아침 국무회의에 참석해 향후 국정운영 방향과 향후 국정운영 방안을 논의할 예정"이라고 밝혔다.
이와 관련, 청와대는 박 대통령이 국정운영 방향과 관련해 '최순실 국정농단 사태'의 책임자를 엄중히 처벌하고 박 대통령을 비롯한 관련자에 대한 엄중 처벌 의지를 천명할 예정이라고 설명했다.
박 대통령은 국정운영 방식과 관련, 이번 사태의 원인과 책임자 처벌을 지시할 방침이다.
청와대 관계자는 "박 대통령은 관련자에 대한 엄중 처벌 의지를 표명할 것"이라며 "

→ skt/kogpt2-base-v2 모델은 뉴스 기사를 주로 학습했기 때문에 위와 같은 내용을 생성

탬플릿 활용해보기

입력하는 프롬프트에 일정 format을 지정

# 입력 프롬프트의 형식을 미리 정의, 사용자의 입력만 바꿔서 반복 생성
from langchain_core.prompts import PromptTemplate

# 프롬프트 형식 정의
template = """
    Question: {question}
    Answer: 'Let's think step by step.'
"""
# 대답 시 단계적으로 생각하여 답하라는 지시

template_sample = PromptTemplate.from_template(template)

prompt_format = template_sample.format(question='Who won the FiFA Word Cup is the year 1994?')

llm_basic.invoke(prompt_format)

  Step 1: The FIFA World Cup happens every 4 years
  Step 2: 1994 is a multiple of 4, which means it was a year when the World Cup took place
  Step 3: The 1994 FIFA World Cup was held in the United States
  Step 4: The winner of the 1994 FIFA World Cup was Brazil
  Therefore, the answer is Brazil.

# text-generation인 hf_pipe 모델에기 값을 전달하면:
hf_pipe.invoke(prompt_format)


    Question: Who won the FiFA Word Cup is the year 1994?
    Answer: 'Let's think step by step.'

Answer: 'Do you remember the last time we played it?'

Question: If I was in your league, would you coach football that way?

Answer: 'I'm no coach. I've just been a young man. But I do have a great interest in coaching."

Question: Who's your favorite player of all time?

Answer: "The 'Fiesta' guy. It was a little awkward."

Question: What are your favorite things about football?

Answer: "I'd rather be on the court than in the stands. It's only two games. I'm a big fan of the game."

Question: What's your favorite sport?

Answer: 'Football.'

Question: How did you know you were a football player?

Answer: 'I was a high school kid. I would go to games at home.'

Question: What's your favorite thing about playing football?

Answer: "I love the game of baseball. I love the game of football. I love the game of football."

Question: Did you play your own sport in high school?

Answer: "I wasn't really into the sport for very long. I

B. 5교시

1. 프롬프트 탬플릿(Prompt Template) 구성 요소

PromptTemplate은 단일 문장 또는 입력값에 간단한 명령을 추가하여 응답을 생성하는 데 사용하는 프롬프트를 구성
- 지시 → 구체적인 지시
- 예시 → 답변에 대한 예시
- 맥락 → 구체적인 맥락
- 질문 → 어떤 답변을 요구하는지에 대한 구체적인 질문

chain3 = template_sample | hf_pipe
# 체인 사용 시 '딕셔너리' 형태로 넣어야 함
chain3.invoke({"question": "Who won the FiFA Word Cup is the year 1994?"})

2. Chat Model 클래스

메시지의 리스트를 입력 받고 하나의 메세지를 반환
대화형 메시지를 입력으로 사용하고 대화형 메시지를 출력
대화의 맥락을 포함한 메시지를 처리 → 더 자연스러운 대화를 가능하게 한다
- 대화의 연속성을 고려하여 메시지 리스트 기반의 응답메시지를 생성

# 대화형 모델을 사용하는 클래스 ChatOpenAI 불러오가
from langchain_openai import ChatOpenAI

# GPT3.5, GPT 4o 두 개의 모델 비교
# LLM 모델 생성
llm3_5 = ChatOpenAI(model="gpt-3.5-turbo", max_tokens=500, temperature=0)
llm4 = ChatOpenAI(model="gpt-4o-mini", max_tokens=500, temperature=0)

# 프롬프트 탬플릿 생성
prompt_template = PromptTemplate.from_template("{country}의 수도는 어디인가요?")

# 체인 생성 (동일한 프롬프트 템플릿에 다른 모델)
chain_llm3_5 = prompt_template|llm3_5
chain_llm4 = prompt_template|llm4

print(chain_llm3_5.invoke({"country": "중국"}).content)

중국의 수도는 베이징(北京)입니다.

print(chain_llm4.invoke({"country": "중국"}).content)

중국의 수도는 베이징(北京)입니다.

print(chain_llm3_5.invoke({"country": "안드로메다"}).content)

안드로메다 은하의 수도는 안드로메다 센터라고도 불리는 M31이라는 은하의 중심부에 위치한 안드로메다 센터입니다.

→ 3.5 모델: hallucination 발생

print(chain_llm4.invoke({"country": "안드로메다"}).content)

안드로메다 은하에는 실제로 수도가 존재하지 않습니다. 안드로메다 은하는 우리 은하와 가장 가까운 대형 은하로, 수많은 별과 행성들이 포함되어 있지만, 인류가 알고 있는 정치적 수도나 정부 형태는 없습니다. 만약 SF 작품이나 특정 설정에서 안드로메다의 수도에 대해 언급하고 있다면, 그 맥락에 따라 다를 수 있습니다. 어떤 특정한 작품이나 설정을 염두에 두고 계신가요?

3.5 모델은 4o 모델보다 할루시네이션이 잘 발생

3. ChatPromptTemplate

기존에 사용한 PromptTemplate과의 차이점
- 여러 메시지를 입력으로 받을 수 있음
- 각 메시지는 역할(role)과 내용(content)으로 구성
ChatPromptTemplate.from_message()
- 메시지의 역할과 내용을 기반으로 프롬프트를 구성
- system_message→ 시스템 기능을 설명(role), human_message → 사용자의 질문을 입력

from langchain_core.prompts import ChatPromptTemplate

chat_prompt=ChatPromptTemplate.from_messages([
    ("system", "이 시스템은 여행 전문가입니다.")
    , ("human", "{text}")
])
# 여행 관련 질문을 하게 되면 지식, 추천, 전문가적 톤으로 대답하려고 함

# 체인 생성
travel_chain = chat_prompt|llm4

# 답변 생성
travel_chain.invoke({"text": "광주 여행 시 꼭 가야 할 대표 맛집 3곳 추천해 주세요."}).content

광주 여행 시 꼭 가야 할 대표 맛집 3곳을 추천해 드리겠습니다.

1. **광주식당 (Gwangju Sikdang)**  
   - **특징**: 광주식당은 전통적인 한식과 지역 특산물을 맛볼 수 있는 곳으로, 특히 비빔밥과 떡갈비가 유명합니다. 신선한 재료로 만든 정갈한 한상이 인상적입니다.
   - **추천 메뉴**: 비빔밥, 떡갈비, 한정식

2. **무등산막걸리 (Mudeungsan Makgeolli)**  
   - **특징**: 광주 지역의 전통 막걸리와 함께 다양한 안주를 즐길 수 있는 곳입니다. 아늑한 분위기에서 지역 주민들과 함께 막걸리를 나누는 경험이 특별합니다.
   - **추천 메뉴**: 막걸리, 전, 두부김치

3. **광주김치찌개 (Gwangju Kimchi Jjigae)**  
   - **특징**: 김치찌개 전문점으로, 깊고 진한 국물 맛이 일품입니다. 신선한 재료와 정성으로 만든 김치찌개는 많은 사람들에게 사랑받고 있습니다.
   - **추천 메뉴**: 김치찌개, 제육볶음, 공기밥

이 외에도 광주에는 다양한 맛집이 많으니, 여행 중에 여러 곳을 탐방해 보시길 추천드립니다!

# 답변 생성
travel_chain.invoke({"text": "광주광역시의 대표적인 여행지를 추천해 주세요."}).content

광주광역시는 다양한 문화와 역사를 가진 도시로, 여러 매력적인 여행지가 있습니다. 다음은 광주에서 꼭 방문해볼 만한 대표적인 여행지입니다.

1. **518 민주화 운동 기념공원**: 1980년 5월 광주 민주화 운동을 기념하기 위한 공간으로, 역사적인 의미가 깊습니다. 기념관과 조각공원 등이 있어 교육적인 가치도 높습니다.

2. **광주 비엔날레**: 현대 미술을 주제로 한 국제 미술 전시회로, 매년 개최됩니다. 다양한 현대 미술 작품을 감상할 수 있는 기회입니다.

3. **무등산**: 광주를 대표하는 산으로, 등산과 자연 경관을 즐길 수 있는 곳입니다. 정상에서의 경치는 특히 아름답습니다.

4. **광주 국립박물관**: 한국의 역사와 문화를 알 수 있는 다양한 전시가 열리는 곳으로, 특히 전통 문화에 관심이 있는 분들에게 추천합니다.

5. **전통시장**: 광주에는 다양한 전통시장이 있습니다. 예를 들어, 양동시장이나 충장로 시장에서 지역 특산물과 먹거리를 즐길 수 있습니다.

6. **광주 하계유니버시아드 기념관**: 2015년 하계유니버시아드를 기념하기 위해 세운 기념관으로, 스포츠와 관련된 다양한 전시가 이루어집니다.

7. **전남대학교**: 아름다운 캠퍼스와 함께 다양한 문화 행사와 전시가 열리는 곳으로, 산책하기 좋은 장소입니다.

이 외에도 광주에는 다양한 문화재와 맛집이 많으니, 여행 계획에 맞춰 여러 곳을 방문해보시길 추천합니다!

stream: 응답에 생성되는 토큰 단위로 출력 → 반복문 써야 함

# 스트리밍 기능을 활용하여 출력 → "무등산 등산 코스에 대해서 알려줘"
for token in travel_chain.stream({"text": "무등산 등산 코스에 대해서 알려주세요."}):
    print(token.content, end='', flush=True)

무등산은 전라남도 광주에 위치한 아름다운 산으로, 다양한 등산 코스가 있어 많은 등산객들에게 사랑받고 있습니다. 무등산의 주요 등산 코스는 다음과 같습니다.

1. **서석대 코스**:
   - 출발점: 서석대 주차장
   - 소요 시간: 약 2~3시간
   - 특징: 비교적 완만한 경사로 초보자도 쉽게 오를 수 있는 코스입니다. 서석대에서의 경치가 아름다우며, 중간에 여러 전망대가 있어 휴식을 취하기 좋습니다.

2. **용추계곡 코스**:
   - 출발점: 용추계곡 주차장
   - 소요 시간: 약 3~4시간
   - 특징: 계곡을 따라 걷는 코스로, 시원한 물소리와 함께 자연을 만끽할 수 있습니다. 여름철에는 특히 인기가 많습니다.

3. **무등산 정상 코스 (천왕봉 코스)**:
   - 출발점: 무등산 주차장
   - 소요 시간: 약 4~5시간
   - 특징: 무등산의 최고봉인 천왕봉에 오르는 코스입니다. 경사가 가파른 구간이 있지만 정상에서의 경치는 매우 장관입니다. 정상에 도착하면 주변의 산과 도시를 한눈에 볼 수 있습니다.

4. **구름다리 코스**:
   - 출발점: 구름다리 주차장
   - 소요 시간: 약 3~4시간
   - 특징: 구름다리를 지나며 멋진 풍경을 감상할 수 있는 코스입니다. 특히 가을철 단풍이 아름답습니다.

각 코스는 난이도와 소요 시간이 다르므로, 자신의 체력과 경험에 맞는 코스를 선택하는 것이 중요합니다. 또한, 날씨와 계절에 따라 등산 준비를 철저히 하고, 안전 장비를 갖추는 것이 좋습니다. 무등산의 아름다운 자연을 만끽하며 즐거운 등산 되시길 바랍니다!

C. 6교시

1. 문서 번역기 만들기

한국어를 영어로 번역하는 chain 구성 실습

# chat template 생성
chat_prompt = ChatPromptTemplate.from_messages([
    ("system","이 시스템은 번역 전문가입니다.")
    , ("human", "입력된 문장을 영어로 번역하세요: {text}")
])

txt = input("번역할 문장을 입력해 주세요.")

# chain 구성하기 → LLM4 모델 사용
translate_chain = chat_prompt|llm4
# 사용자의 질문을 입력 받아 응답을 출력 → input 함수 사용
# 출력 방법 상관 없음(invoke, stream)
for token in translate_chain.stream(txt):
    print(token.content, end='', flush=True)

번역할 문장을 입력해 주세요.행복한 하루 보내세요!
Have a happy day!

# chat template 생성
chat_prompt_2 = ChatPromptTemplate.from_messages([
    ("system","이 시스템은 번역 전문가입니다.")
    , ("human", "입력된 문장을 일본어로 번역하세요: {text}")
])

# chain 구성하기 → LLM4 모델 사용
kr2jp_chain = chat_prompt_2|llm4
# 사용자의 질문을 입력 받아 응답을 출력 → input 함수 사용
human_input = input("번역할 문장을 입력해 주세요:")

# 출력 방법 상관 없음(invoke, stream)
answer = kr2jp_chain.invoke({"text": human_input})
print(answer.content)

번역할 문장을 입력해 주세요:같이 영화 보러 갈래?
映画を見に行かない？

2. AI 메시지 사용해보기

목적: AI 역할이 포함된 대화 흐름을 구성하고 응답이 어떤 식으로 출력되는지 확인
LLM이 과거의 내용을 기억하고 추론할 수 있는 문맥을 구성하는 학습 방식
- 주의: 앞선 대화 내용을 주입하는 형식. LLM이 새로운 대화를 memory에 저장하는 방식은 아님!

ai_role = ChatPromptTemplate.from_messages([
    ("system","너는 다양한 분야에서 능통한 AI야!") # role을 지정해 주는 것
    , ("human","안녕, 오랜만이야.")
    , ("ai", "네, 안녕하세요. 무엇을 도와드릴까요?")
    , ("human","2+2는 몇이야?")
    , ("ai", "2+2는 4입니다.")
    , ("human","거기에 2를 더하면?")
    ])

# 체인 생성
ai_role_chain = ai_role|llm4

# 답변 출력
print(ai_role_chain.invoke({}).content)

4에 2를 더하면 6이 됩니다.

3. placeholder를 활용한 대화 이력 삽입

이전 대화를 유지하면서 추가 질문을 가능하게 하는 구조 설계법

ph_template = ChatPromptTemplate.from_messages([
    ("system","너는 다양한 분야에서 능통한 AI야!")
    , ("placeholder","{conversation}")
    , ("human","거기에 2를 더하면?")
])

history =   [
    ('human','안녕? 오랜만이야')
    , ('ai','네~ 안녕하세요?')
    , ('human','2+2는 몇이야?')
    , ('ai','2+2는 4입니다.')
]

ph_chain = ph_template|llm4

ph_chain.invoke({"conversation": history}).content

4에 2를 더하면 6이 됩니다.

4. 메시지에 출력 양식 포함

# 출력 형식 지정하기
prompt_template = ChatPromptTemplate.from_messages([
    ('system', "너는 여행 전문가이고 여행지의 맛있는 음식에 대해 전문적으로 대답할 수 있어"),
    ('human', '{question}'),
    ('ai',""" 아래의 형식처럼 답변을 작성해주세요
    ======================
    타이틀
    ======================
    - 응답 1
      - 설명
    - 응답 2
      - 설명
    - 응답 3
      - 설명
    """)
])

# 체인 생성
chain = prompt_template|llm4

# 텍스트를 입력 받아 출력
human_input = input()
res = chain.invoke({"question":human_input})
print(res.content)

나폴리
======================
나폴리의 맛있는 음식
======================
- 피자 나폴레타나 (Pizza Napoletana)
  - 나폴리의 대표적인 음식으로, 얇고 부드러운 도우에 신선한 토마토 소스, 모짜렐라 치즈, 바질을 얹어 구운 피자입니다. 전통적으로 나무 오븐에서 구워져 특유의 쫄깃한 식감과 풍부한 맛을 자랑합니다.

- 스파게티 알리오 올리오 (Spaghetti Aglio e Olio)
  - 간단하지만 맛있는 이탈리아 파스타 요리로, 올리브 오일, 마늘, 고추가루로 맛을 낸 스파게티입니다. 나폴리 지역에서는 신선한 재료를 사용하여 더욱 깊은 풍미를 느낄 수 있습니다.

- 파스티에르 (Pastiera)
  - 나폴리의 전통적인 디저트로, 리코타 치즈, 밀가루, 계란, 오렌지 꽃수, 향신료로 만든 파이입니다. 주로 부활절에 즐겨 먹지만, 연중 내내 사랑받는 달콤한 간식입니다.

2개 이상의 변수를 템플릿 안에 정의

# 출력 형식 지정하기
prompt_template = ChatPromptTemplate.from_messages([
    ('system', "너는 여행 전문가이고 여행지의 맛있는 음식에 대해 전문적으로 대답할 수 있어"),
    ('human', '{area}에서 유명한 {topic} {num}가지를 추천해 줘~'),
    ('ai',""" 아래의 형식처럼 답변을 작성해주세요
    ======================
    타이틀
    ======================
    - 응답 1
      - 설명
    - 응답 2
      - 설명
    - 응답 3
      - 설명
    """)
])

# 체인 생성
chain = prompt_template|llm4
# 결과 출력(invoke 함수에서 바로 작성)
res = chain.invoke({"area": "프랑스", "topic": "박물관", "num": 5})
print(res.content)

======================
프랑스에서 유명한 박물관 5가지
======================
- 루브르 박물관 (Musée du Louvre)
  - 세계에서 가장 큰 미술관이자 가장 유명한 박물관 중 하나로, '모나리자'와 '비너스 드 밀로' 같은 걸작들이 소장되어 있습니다. 고대 문명부터 현대 미술까지 다양한 작품을 감상할 수 있습니다.

- 오르세이 미술관 (Musée d'Orsay)
  - 파리의 세느강 옆에 위치한 이 박물관은 19세기와 20세기 초의 인상파 및 후기 인상파 작품을 주로 전시합니다. 모네, 반 고흐, 드가 등의 작품을 감상할 수 있습니다.

- 퐁피두 센터 (Centre Pompidou)
  - 현대 미술과 문화의 중심지로, 독특한 건축 디자인과 함께 현대 미술 작품을 전시합니다. 다양한 전시와 문화 행사도 열리며, 파리의 멋진 전경을 감상할 수 있는 전망대도 있습니다.

- 베르사유 궁전 (Château de Versailles)
  - 프랑스 왕실의 역사와 예술을 담고 있는 이 궁전은 화려한 정원과 함께 유네스코 세계유산으로 지정되어 있습니다. 궁전 내부의 미술품과 역사적인 방들을 탐방할 수 있습니다.

- 로댕 미술관 (Musée Rodin)
  - 유명한 조각가 오귀스트 로댕의 작품을 전시하는 박물관으로, 그의 대표작인 '생각하는 사람'과 '지옥의 문'을 포함한 다양한 조각을 감상할 수 있습니다. 아름다운 정원도 함께 즐길 수 있습니다.

Ⅲ. CARRER UP

미니 프로젝트

sourcetree 설치
내 프로젝트 폴더 경로로 이동하여 cmd 열고 아래와 같이 입력

python -m venv venv
venv\Scripts\activate.bat
pip install -U -r requirements.txt

내용 이해하기
- python -m venv venv: venv라는 이름의 가상 환경을 만들겠다는 뜻
- venv\Scripts\activate.bat: 가상 환경을 활성화하겠다는 뜻
  - 이거 하면 cmd 창 글자가 (venv) 경로로 바뀜
- pip install -U -r requirements.txt: requirements.txt에 적혀 있는 패키지를 다운로드하겠다는 뜻
  - -U 또는 --upgrade 옵션은 이미 설치된 패키지가 있더라도 최신 버전으로 업그레이드하라는 의미
  - -r 옵션은 뒤따라오는 파일(requirements.txt) 안에 나열된 패키지 목록을 읽어서, 그 안에 적힌 모든 패키지를 한 번에 일괄 설치하라는 뜻 (requirements.txt로 여러 패키지를 한 번에 설치하려면 반드시 -r 옵션을 함께 써야 함)

항목	역빈도(inverse)	balanced
정의/공식	$w_c \propto 1/n_c$ 또는 완화형 $w_c=\sqrt{\frac{\max n}{n_c}}$	$w_c=\frac{N}{K\,n_c}=\frac{1}{K\,p_c}$
평균 스케일(정규화)★	❌ (데이터셋마다 손실 스케일 달라짐)	✅ $\sum_c p_c w_c=1$ → 평균 가중치 1
희귀 라벨 부스팅 강도	강함(1/빈도), √완화면 중간	매우 강함(1/비율)
학습 안정성(진동/발산)	1/빈도는 불안정 가능, √완화 시 안정적	더 공격적이라 불안정 위험 ↑ → clip/Huber 권장
라벨 노이즈 민감도 ★	높음 (특히 극소 샘플)	더 높음
학습률(LR) 민감도	중간~높음 (스케일 변동)	보통 안정적이지만 가중치가 커서 여전히 주의
Macro 지표(각 점수 균등)	개선	더 크게 개선되는 경향
Micro/전체 MAE(빈도 가중)	경우에 따라 악화 가능	악화 가능성 더 큼(희귀에 학습 집중)
구현 난이도	낮음	낮음
권장 보조기법	clip(예: ≤5), 평균 재정규화, Huber, 출력 범위제한	clip(예: ≤5), Huber, 출력 범위제한, warmup/grad accumulation
추천 상황★	데이터 매우 희소·작고 안정성 우선일 때, baseline	희귀 구간을 꼭 끌어올려야 할 때(노이즈 적고 안정화 장치 있는 경우)

Suhyeon Lee

2 B R 0 2 B

이전 포스트

[인공지능사관학교: 자연어분석A반] JavaScript (7) / LangChain

다음 포스트

[인공지능사관학교: 자연어분석A반] JavaScript (8) / LangChain (2)

목차

Ⅰ. 오전 수업

A. 1교시

1. 지난 시간 복습

2. 노드 생성

3. 실습 1: 단순한 텍스트를 포함한 요소 생성

B. 2교시

1. 실습 2: 속성이 포함된 태그 생성

2. 실습: 요소 삭제하기

2. 실습: To-Do List 만들기

C. 3교시

1. 실습: To-Do List 만들기 (cont.)

Ⅱ. 오후 수업

A. 4교시

1. 지난 시간 복습

2. LangChain 모델 유형

3. LLM 클래스

Huggingface 모델 연동 사용

탬플릿 활용해보기

B. 5교시

1. 프롬프트 탬플릿(Prompt Template) 구성 요소

2. Chat Model 클래스

3. ChatPromptTemplate

C. 6교시

1. 문서 번역기 만들기

2. AI 메시지 사용해보기

3. placeholder를 활용한 대화 이력 삽입

4. 메시지에 출력 양식 포함

Ⅲ. CARRER UP

미니 프로젝트

[인공지능사관학교: 자연어분석A반] JavaScript (7) / LangChain

[인공지능사관학교: 자연어분석A반] JavaScript (9) / 미니프로젝트 발표 / DB 특강

0개의 댓글