내가 보려고 정리 - HTML, VB

1. 차이점

HTML(HyperText Markup Language)

• 웹 페이지의 구조와 내용을 정의하기 위한 마크업 언어
• 주로 웹 페이지의 레이아웃, 텍스트, 이미지, 링크 등을 표시하는 데 사용
• 웹 브라우저에서 HTML 문서를 렌더링하여 사용자에게 표시
• 태그를 사용하여 문서의 구조를 정의
  • <h1> 태그는 제목
  • <p> 태그는 단락
  • <img> 태그는 이미지를 삽입, src속성을 통해 이미지의 소스를 지정
• 각 태그는 특정한 역할을 하며, 여는 태그와 닫는 태그로 이루어짐
  
  

VB(Visual Basic)

• 프로그래밍 언어, Windows 애플리케이션을 개발하거나 자동화 프로세스 작성하는 데 사용
• 사용자 인터페이스를 디자인하고 제어, 데이터베이스와의 상호 작용 등을 수행하는 데 사용
• 변수, 조건문, 반복문, 함수 등을 사용하여 프로그램을 작성
• 일반적인 프로그래밍 언어의 문법과 유사
  
  

2. 문법

HTML

1. 태그(Tag): HTML 문서의 기본 구성 요소, <tagname>과 </tagname>으로 이루어짐
2. 속성(Attribute): 태그에 추가 정보를 제공하는 요소로 태그 내에 사용, name="value"
3. 요소(Element): 시작 태그와 끝 태그 사이에 있는 모든 것을 포함
4. 주석(Comment): <!--와 --> 사이에 작성, 설명이나 메모를 추가하는 데 사용
   
   

Visual Basic

1. 변수(Variable): Dim x As Integer는 정수형 변수 x를 선언
2. 조건문 : 조건에 따라 프로그램의 흐름을 제어. If...Then...Else 구문이 일반적.
3. 반복문: 조건이 충족될 때까지 코드 블록을 반복. For...Next, Do...Loop, While...End While 등
4. 함수(Function): 작업을 수행하는 코드 블록으로, 필요할 때 호출되어 사용. 함수는 값을 반환할 수도 있고, 값을 반환하지 않을 수도 있음(Python은 값을 반환해야 하지 않나..)
5. 클래스(Class): 데이터와 함수를 함께 묶어서 사용

3. 사용해보기

Visual Basic

웹페이지에서 추출한 DT의 내용을 포함시켜 테이블을 html형식으로 만들기

Dim sb As New System.Text.StringBuilder()

• System.Text.StringBuilder 클래스의 새 인스턴스를 생성하고 변수 sb에 할당
• 생성된 StringBuilder 인스턴스는 문자열을 동적으로 빌드하는 데 사용
  
  

sb.Append("안녕하세요.<br>")

• 생성된 StringBuilder 인스턴스인 sb에 문자열을 추가하는 것
• Append 메서드는 StringBuilder 인스턴스에 문자열을 덧붙임
• "안녕하세요." 문자열이 StringBuilder에 추가, <br>태그가 줄바꿈
  
  

sb.Append("<table class=""tg"" style=""border: 1px solid black;""><thead><tr>")
For Each col As DataColumn In in_filterWordMonthDT.Columns
    sb.Append("<th class=""tg-q6po"">" + col.ColumnName + "</th>")
Next
sb.Append("</tr></thead><tbody>")

• HTML 테이블 헤더 생성
• 입력된 데이터테이블의 열이름을 돌면서 각 열의 이름을 <th>태그로 묶어서 추가
• class=""tg"" 쌍따옴표를 쓰는 이유 : 문자열 내에 큰따옴표를 포함시키기 위해서
  • HTML에서 class="tg"로 해석되며, HTML의 속성값으로서 정상적으로 작동
    
    

For Each row As DataRow In in_filterWordMonthDT.Rows
    sb.Append("<tr>")
    For Each col As DataColumn In in_filterWordMonthDT.Columns
        sb.Append("<td class=""tg-za14"" style=""border: 1px solid black; text-align: left; vertical-align: bottom;"">" + row(col.ColumnName).ToString() + "</td>")
    Next
    sb.Append("</tr>")
Next

• HTML 테이블 데이터 생성
• 데이터테이블의 각 행과 열의 값을 돌면서 <tr> 및 <td> 태그로 묶어서 추가
• <td>는 HTML에서 테이블 셀을 나타내는 태그
• class=""tg-za14""는 해당 셀에 적용되는 CSS 클래스
• style 셀에 적용되는 스타일 정의
  • border: 1px solid black; 셀의 테두리 스타일을 지정(1픽셀 두께, 검은 실선 테두리)
  • text-align: left; 셀 안의 텍스트를 왼쪽으로 정렬
  • vertical-align: bottom; 셀 안의 콘텐츠를 아래로 정렬
• "</td>" HTML 테이블 셀을 닫는 태그
• row(col.ColumnName).ToString() 특정 셀에 있는 값을 가져와서 HTML 테이블 셀에 넣기
  
  

sb.Append("</tbody></table>")

• HTML 테이블 닫기
  
  

Dim finalHtml As String = sb.ToString()

• 최종 HTML 코드 출력
  
  

out_Html = finalHtml

• 최종적으로 생성된 HTML 코드를 out_Html 변수에 할당하여 출력변수로 사용

끝! (HTML 추가예정)