HTML28 국비 지원 개발자 과정_Day48 학습목표 1. 함수 활용 양이 줄었는지 늘었는지 복잡도 증가했는지 줄었는지 2. 배열 CRUD 배열 내장함수(filter, join, push …) 3. DOM 구조 그리기(문자열을 이용한 HTML 다루기) 코드 양은 늘어나지만 직관적이라 유지보수 좋음 DOM API → 백틱(`) 기호로 변경(리팩토링) 4. 라우터 적용 5. 페이징 처리 6. TailWind CSS 적용 XMLHttpRequest 비동기통신객체 XHR 객체는 서버와 상호작용할 때 사용 XHR을 사용하면 페이지의 새로고침 없이도 URL에서 데이터를 가져올 수 있음 이를 활용하면 사용자의 작업을 방해하지 않고 페이지의 일부 업데이트 가능 // XMLHttpRequest는 내장객체가 아니다 → 인스턴스화를 해야 한다 const xhr = n.. 2023. 2. 4. 국비 지원 개발자 과정_Day47 Node.js 확장성 있는 네트워크 애플리케이션(특히 서버 사이드) 개발에 사용되는 소프트웨어 플랫폼 작성 언어로 자바스크립트를 활용하며 논블로킹(Non-blocking) I/O와 단일 스레드(순서지킴) 이벤트 루프를 통한 높은 처리 성능을 가짐 JSON.stringify() JavaScript 값이나 객체(Object)를 JSON 문자열로 변환 const datas = JSON.stringify(객체{”key”:”password”}) JSON.parse() JSON 문자열의 구문을 분석하고, 그 결과에서 JavaScript 값이나 객체를 생성 문자열을 배열로 바꾸어 구조분해하는 함수 지원 const jsonDoc = JSON.parse(datas) jsonDoc[0].key → 키값 출력 /* Expr.. 2023. 2. 2. 국비 지원 개발자 과정_Day46 h태그의 종류와 큰 크기순으로 순서대로 작성 , , , , , 태그의 크기가 가장 크고 태그의 크기가 가장 작다 텍스트 노드가 있는 태그를 작성하는 구조 태그 사이에 적는 일반 문자열도 문서 트리 구조에서는 텍스트 노드라는 이름의 노드로 취급 텍스트 태그 텍스트 안에 줄 바꿈을 생성하는 태그 ul태그에 대해 설명하고 작성방법 순서가 없는 HTML 리스트를 정의할 때 사용 요소에 속하는 각 아이템은 요소를 사용하여 나타냄 텍스트1 텍스트2 표를 표현하는 태그가 무엇이고 사용방법 표는 table 태그로 만든다 th로 테이블의 타이틀, tr로 행을 나타내고 td로 각 행에 이어진 열을 나타낸다 타이틀1 타이틀2 1행 1열 1행 2열 2행 1열 2행 2열 rowspan를 사용하는 태그와 용도를 작성 td태그의 .. 2023. 2. 1. 국비 지원 개발자 과정_Day45 css 선택자 태그선택자 h1 {} 클래스선택자 .title {} 아이디 선택자 #title {} 자바스크립트 window 안의 객체 document.write(””) 로컬이 아니라 브라우저에서 실행 자바 System.out.println()과 같음 자바는 main() 있음 → exe파일로 실행하는 로컬 프로그램 JSP문법 통신필요 -프로토콜필요 → http, https - stateless비상태 out.print(””) 웹혁명2.0 효율적, 브라우저 API 중요(윈도우, 도큐먼트객체 등 내장객체) 브라우저는 인터프리터 역할, 출력하려면 body태그 안에 입력 정적(html, css, js)페이지 처리 개인 pc 다운로드 - 시점, 동기화, 유지문제 발생, 비상태 프로토콜이기에 상태(데이터변화) 관리 필.. 2023. 1. 31. 국비 지원 개발자 과정_Day44 Skill Inventory Home About me Skills Projects Contact 나에 대해 보유 기술 참여 프로젝트 Jungyunmok@gmail.com 2023 Jungyun Mok - All rights reserved * { box-sizing: border-box; /* 패딩과 마진 포함 사이즈 계산 */ /* border: 1px solid red; */ } body { margin: 0; /* 여백없이 왼쪽 상단 모서리에 붙임 */ } i { color: white; } .fab.fa-diaspora { position: absolute; top: 14px; left: 8px; } a { text-decoration: none; /* a태그 링크 밑줄 없애기 */ color: .. 2023. 1. 30. 이전 1 2 3 4 5 6 다음