02-10 학습! ❓❔🟥🟧🟨🟩🟦🟪🟫⬜⬛🫢🔔😎😊🤔
HTML🟧
웹 프로그램
비지니스 로직 처리 java+ servlet + DB
사용자 인터페이스 HTML + CSS + JavaScript
인터프리터 언어❓ 웹 브라우저에 의해 해석됨 - 라인 단위
그래서 웹 브라우저마다 달라질 수 있다!
DOM 트리를 구성하고 화면에 표시 => xml 과 비슷!
🟧화면에 보여줄때는 DOM 트리를 구성하고 있음
vs 컴파일 언어
HTML5🟨
태그 뿐만이 아니라 엄청 많이 생겼따
마크업 에서 발전해서 os와 소통하며 하드웨어를 조종할 수 있도록 발전되고 확장됨!
단순한 markup에서 강력한 웹 애플리케이션 플랫폼으로!
JavaScript 와 함께
웹 표준
🟨HTML CSS JavaScript 의 명확한 분리!
시멘틱 마크업 사용 -> 검색엔진 최적화 (SEO)
🫢aria-live 금융권에서는 필수이다 장애인과 비장애인 모두 웹을 사용할 수 있도록
HTML 기본🟩
tag 꼬이지 않기!
대소문자를 가리지 않음! -> 소문자 권장
w3schools로 실습해보기
🟩block 요소와 inline 요소
Tag의 속성 - 구조, 텍스트, 리스트, 링크, 폼, 테이블
🟩global 속성 - id, class, style, data-*
🔔주석은 사용자에게 그대로 전달되기 때문에 민감한 내용이 들어가지 않도록 주의
공백(white space)는 개수와 상관 없이 공백 하나로 인정
emmet을 활용한 HTML 작성
기본 태그🟦
ul Unordered List
ol Order List
li List Item
dl Definition List
dt Definition Term
dd Definition Details
table
table, tr, td, th, caption, thead, tbody, tfoot, col, colgroup
🟦DOM 트리에서 자동 생성하는 부분이 있기 때문에 디버깅은 DOM을 보고 해야한다
자동으로 tbody가 생성되어 자식이 아니게 되어버리는 경우가 있을 수 있음!
🟦td가 몇개일까?
img
loading - 웹툰 같은 경우 맨 밑에 있는 사진을 로드할 필요는 없음 필요할 때만!
🟦img의 크기를 지정해주지 않으면 처음 로딩시와 화면이 달라져서 전체적인 레이아웃이 바뀔 위험이 있음
a
href, 🔔target의 "_blank"🔔 , title. dowwnload
🔔form 활용🟪🔔
사용자로부터 데이터를 입력받아 서버로 전송하기 위해서 사용되는 요소
속성
action, method, enctype, target, name, autocomplete, novalidate
🔔method 의 get, post, dialog
🟪form
🟪input에서 name과 id가 헷갈린다
id: css나 javascript에서 태그 요소를 지정할 때 사용 - 주로 해당 페이지에서 사용
name: 서버로 전송되는 파라미터의 "이름"으로 사용 - 주로 서버에서 사용
input 요소에 id를 지정하고 label과 연결
get방식과 post방식의 차이
get은 url로 전달함 - 보안에 취약함!! - 용량에 제한! - request 처리가 데이터에 영향을 주지 않을 경우 : 단순조회
post은 바디에 포함되어 전달해서 - 용량에 제한이 없음 -상대적으로 보안에 강하다! - 요청 처리가 서버의 데이터에 영향을 줄 경우
semantic 태그 🟫
❓❔🟥🟧🟨🟩🟦🟪🟫⬜⬛🫢🔔😎😊🤔
강사님 강의
🔔 recursion call it self -> while, for -> overflow -> Base Condition
🔔 DFS -> call stack -> 5% 정도 stack을 구현
🔔 1번째 factorial = 5 4 3 2 1 = 5 4!
🔔 int fac - 12! long fac - 20! 10! = 3600000 == 510의 6승
🔔 10! 를 1초 넘기기 않기 위해서는 20회 이하 반복
🔔 nextperm 13! 까지 가능
🔔 2번째 recursion sum
🔔 S(10) = 1+2+3+4 ... 9+10 =
🔔 분할정복 -> 합 -> 2곱하기 n/2 + n/2의 제곱
🔔 홀수 일때 짝수 일때 구분
🔔 3번째 pibo
🔔 피보나치의 활용
🔔 1번째 황금비율 1/1 1/2 2/3 3/5 5/8 ... -> 0.618
🔔 2번째 계단문제
🔔 한번에 한계단 or 두계단 an = an-1 + an-2
🔔 피보 과정을 좀 줄일 수 없을까? dp 메모이제이션, 타뷸라이션?
🔔 2N개의 바닦에 타입 채우기 기존 상황에 종속되는 상황이라 또 pivo가 된다!
타일1
타일2
타일3
🔔 4번째
파스칼의 삼각형
🔔 콤비네이션 공식 두가지
🔔 nCr = n-1Cr + n-1Cr-1
🔔 nCr = n-r+1/r * nCr-1;
🔔 주의할 점은 r로 나눌때 정수가 되면 안되니깐 앞에 1.0을 곱해서 계산을 해주고 맨 나중에 결과를 확인할 때 long으로 캐스팅 해준다!
🔔 탑 다운 방식 tablization
🔔 메모이제이션 - 배열 or 맵 을 사용해서 기억
🔔 맵을 이용하는 법 colatz
🔔 n even N/2
🔔 n odd면 3N + 1
🔔 하노이 탑을 옮기기 위해서는 어떻게 해야할까
🔔 c에 옮기기 위해서는 b에다가 가장 큰 판을 제외한 작은 삼각형을 세우는 거 + 1
🔔 H(n) = 2H(n-1) + 1 H(1) = 1
숙제
알고리즘 B형 못했던 문제들 다 풀기!
