인공지능 개발자 수다(유튜브 바로가기) 자세히보기
반응형

전체 글 165

[HTML] 시맨틱(Semantic) 태그

1. 개요단순히 페이지를 표시하는 것을 넘어서, 각 요소가 어떤 역할을 하는지 ‘의미’를 담아 표현하는 것시맨틱 태그는 페이지를 구성하는 각 영역에 명확한 의미를 부여하여, 코드의 구조를 더욱 이해하기 쉽게 만들고,검색엔진이나 보조 기술(스크린리더 등)이 콘텐츠를 잘 이해할 수 있도록 돕는다. 시멘틱 태그의 장점가독성 향상: 대신 나의 블로그 홈 글 목록 소개 첫 번째 게시글 이것은 첫 번째 글의 본문입니다. 최근 댓글 좋은 글이네요! 많은 도움이 되었습니다. 추천 글 HTML 기초 ..

[HTML] 입력 폼(From)

1. 개요웹페이지에서 사용자로부터 정보를 입력받아 처리하기 위해서는 입력 폼(form)이 필요하다.회원가입, 로그인, 검색, 결제, 문의 등 거의 모든 웹 서비스의 핵심 기능이 이 폼을 기반으로 작동한다. 2. 내용2.1. 태그설명 : input 태그에 설명을 붙여주는 태그속성 설명for : input 태그의 "id" 파라미터가 들어간다예시아이디 2.2. 태그설명 : 데이터를 입력하는 부분이다.속성 설명type : text, password, checkbox, radio, email, number, file, submit 등이 있음name : 서버로 전송하 ㄹ때 이 값을 키로 사용value : 기본 값placeholder : 입력창에서 알려주는 문구required : 필수 입력 필드로 지정disabl..

[HTML] 리스트(List)와 테이블(Table)

1. 개요보를 나열하거나 정리된 표 형태로 보여줘야 할 상황에 사용 2. 내용2.1. 리스트 태그설명는 반드시 또는 안에서만 사용해야 한다.은 용어집, 설명서 등에서 유용하다. 태그 종류종류태그설명순서 없는 목록점(dot)으로 나열순서 있는 목록숫자 또는 문자로 순서가 매겨짐정의형 목록용어와 설명 쌍으로 구성됨 예시 코드 HTML CSS JavaScript 로그인 상품 검색 결제 HTML 웹 페이지의 구조를 담당하는 마크업 언어 CSS 웹 페이지의 디자인을 담당하는 스타일 시트 언어 실행 결과 2.2. 테이블 태그태그 설명 : 테이블 정의 : 하나의 행 : 헤더 정의 : 데이터 기본 구조 이름 나이 직업 홍길동 30 개발자 김영..

[HTML] 링크와 이미지 태그

1. 개요웹페이지에서 다른 문서로 이동하거나 이미지를 보여주는 기능은 사용자의 경험을 크게 향상시킨다.이러한 기능은 HTML의 태그(하이퍼링크)와 태그(이미지 삽입)를 통해 구현할 수 있다.이번 글에서는 이 두 태그의 기본 사용법과 함께, 실전에서 유용한 다양한 활용법까지 다룬다. 2. 내용2.1. 링크 태그 기본 구조링크 텍스트href: 이동할 주소를 지정하는 필수 속성이다.target="_blank": 링크를 새 탭에서 열도록 한다.title: 링크에 마우스를 올렸을 때 나타나는 힌트(툴팁)를 지정한다.download: 파일을 다운로드하도록 만든다. 예시 코드 공식 홈페이지 이력서 다운로드 내부 링크 (문서 내 이동)문의하기문의 섹션으로 이동 2.2. 이미지 태그 기본 구조src: 이미지 경로..

[HTML] 주석과 텍스트 관련 태그

1. 개요이번 시간에는주석과텍스트 관련 태그에 대해 공부해 보자2. 주석아래와 같은 형태로 주석을 사용하면코드 실행에는 적용되지 않는 메모를 할 수 있음 3. 텍스트 태그3.1. 제목 태그(Heading tags)HTML에는 제목을 표현하는 6가지 태그가 있음 ~ 형태로 작성, 숫자가 작을수록 크고 중요한 제목가장 큰 제목입니다두 번째 제목세 번째 제목네 번째 제목다섯 번째 제목가장 작은 제목 3.2. 문단 태그 ()일반적인 본문 텍스트나 설명을 쓸 때 사용이것은 하나의 문단입니다.문단은 자동으로 줄바꿈이 됩니다. 3.3. 줄바꿈 태그 ()한 줄만 바꾸고 싶을 때 사용 줄바꿈이 필요할 때는 이렇게 태그를 사용합니다. 3.4. 수평선 태그 ()내용을 구분할 때 사용하는 수평선(horizontal r..

[HTML] HTML5 처음 시작하기

1. HTML5 란HTML은 HyperText Markup Language의 약자현재는 버전 5를 사용웹 페이지의 구조(뼈대)를 만드는 마크업 언어텍스트, 이미지, 버튼, 링크, 폼 등 웹에 보이는 모든 요소를 태그(tag)를 사용해 정의 2. 실행 환경필자는 webstorm 에서 개발을 진행할 예정이다.JavaScript & TypeScript를 위한 IDE로비영리로는 무료로 사용 가능하며, 다양한 편의 기능을 클릭 한번으로 사용할 수 있다. WebStorm: The JavaScript and TypeScript IDE, by JetBrainsMake development more productive and enjoyable with WebStorm, the IDE for JavaScript and r..

[UV] Pycharm에서 UV 세팅하기

Poetry를 이용해 파이썬 환경을 관리하는 중에UV라는 새로운 도구를 발견했다.앞으로는 pip, poetry 등을 대체할 것이라는 의견이 많으며, 신규 프로젝트는 UV로 진행되고 있다는 소문이 있다. Pycharm에서는 가상환경은 자동으로 세팅해주니, 그것을 사용하도록 하겠다. 1. UV기반 환경 세팅 방법신규 프로젝트를 만든다custom environment를 클릭하고 UV를 선택해 준다 2. UV환경 사용법2.1. pyproject.toml 확인프로젝트를 생성하면 pyproject.toml 파일이 만들어지는데, 여기서 라이브러리를 관리한다. 2.2. UV 버전 관리uv 버전 확인uv -V uv 최신버전으로 업데이트pip install --upgrade uv 2.3. 라이브러리 설치 및 삭제라이브러리..

[LLM] DPO (Direct Preference Optimization) 논문 리뷰

6.1 Sentiment Task: 감성 조절 능력 실험 (IMDb)논문 링크연도 : 20230. Abstract기존 RLHF(인간 피드백을 활용한 강화학습)은 복잡하고 한계가 있음간단한 classification loss 를 이용해 RLHF의 문제를 해결샘플링이나 복잡한 하이퍼파라미터 튜닝 없이도 인간의 선호도에 맞는 fine-tuning이 가능기존의 PPO 기반 RLHF보다 감정 제어 성능이 뛰어남 1. Introduction명확하지 않은 문서를 이해해야 하지만, 정확한 대답을 해야하함이진 분류 손실 함수(binary classification loss) 사용핵심 아이디어는, 보상 모델을 명시적으로 학습하지 않고도 최적의 정책(Policy)을 바로 도출할 수 있도록 선호 기반 확률모델(theoreti..

[LangGraph] Graph 기본 개념

langgraph 버전: 0.6.4내용 출처 : LangGrapn Docs LangGraphLangGraph Trusted by companies shaping the future of agents – including Klarna, Replit, Elastic, and more – LangGraph is a low-level orchestration framework for building, managing, and deploying long-running, stateful agents. Get started Install LangGrlangchain-ai.github.io 1. Graph 개요LangGraph는 Graph를 구성해 Agent를 만들 수 있다. Graph의 핵심 구성은 다음과 같다.Gr..

반응형