I AM Seung Hyeon

● CDN - Content Delivery Network- 지리적 제약 없이 전 세계 사용자에게 빠르게 콘텐츠를 전송하는 기술- 프록시 서버에서 출발한 웹 캐시의 클라우드화- CDN 자체가 알아서 사용자와 가장 가까운 캐시 서버에서 정보를 찾아 보내는 것- 서버와 사용자 사이의 물리적인 거리를 줄여 콘텐츠 로딩에 소요되는 시간을 최소화한다 - 오픈소스로 배포되는 플러그인, 모듈을 여러 사이트에서 사용하라고 온라인에 올려놓은 서비스 - 인터넷 서버와 가까운 위치에 파일을 미리 복사해두고 이를 빠르게 다시 가져가 사용하는 방법- 누군가의 JS 파일을 사용하고자 할 때, 코드를 직접 다운받거나 복사하지 않고, CDN 을 이용해 JS 파일을 다운로드 받으면, 한 줄의 코드로 파일을 다운로드 할 수 있다    ..

● BOM- Browser Object Model- 웹 브라우저를 통해 실행될 때 JS가 갖게되는 기본 객체 구조- 모든 객체는 window 객체의 하위 객체로서 존재한다 ● DOM- Document Object Model- HTML 문서 구조(DOM)을 제어하기 위해 제공되는 객체구조- BOM의 하위 요소중 하나                        refer tohttps://velog.io/@imok-_/JavaScript-DOM-BOM-%EC%9D%B4%EB%9E%80

부모 요소 찾기 ● closest- Element의 closest() 메서드는 주어진 CSS 선택자와 일치하는 요소를 찾을 때까지, 자기 자신을 포함해 위쪽(부모 방향, 문서 루트까지)으로 문서 트리를 순회한다.-  ex ) ____.closest('.collapse');          -  괄호안에 '.', '#' 까먹지 말기 !!!!!  ● parentElement- Element 현재 노드의 부모 요소 조회-  ex)  current.parentElement;

- JavaScript 코드를 브라우저 밖에서 실행할 수 있게 해주는 런타임 환경- 빈번한 I/O 처리에 우수한 성능- 서버 확장의 용이성- JavaScript 프론트엔드 필수언어로 백엔드까지 작성할 수 있다- 오픈소스 JavaScript 엔진인 크롬 V8에 비동기 이벤트 처리 라이브러리인 libuv을 결합하여 구현되었다- 최신 버전은 기능이 불안정하거나 일부 모듈이 작동하지 않을 수 있으므로 안정성을 보장하고 싶다면 LTS 버전을 사용하는 것이 좋다  [ Windows ]  [ Mac ] node --version- 결과값이 출력되지 않을 경우 https://nodejs.org 에서 프로그램 설치- LTS 버전 권장- 설치 완료 후 버전확인 명령어를 통해 설치 완료 확인  ● Visual Studio ..

● JSON의 key를 배열로 반환하는 명령const student = { studno: 12345678, grade: 1, name: 'HYEON', phoneno: '010-1234-5678'};const keys = Object.getOwnPropertyNames(student);console.log(keys); Object.getOwnPropertyNames( JSON이름 ); 출력결과  ▶ ▶ ▶ 추출한 key가 배열이므로 반복문 처리가 가능하다!for ( const k of keys ) { console.group(k); console.log(student[k]); console.groupEnd();} 출력결과 ● 배열끼리의 깊은복사 const a1 = [..

1) for ( let i=0; i 2)for ( let i=0; i 3)for ( let i=0; i 4)for ( let i=0; i 5)for ( let i=0; i 6)for ( let i=0; i

JSON - JavaScript Object Notation (자바스크립트 객체 표기법)의 줄임말- 자바스크립트에서 object를 표현하기 위한 문법적인 기법- 요즘 프로그래밍에서는 JSON이 목표이자 결과가 된다 - 웹 어플리케이션에서 데이터를 전송할 때 일반적으로 사용한다    - 서버에서 클라이언트로 데이터를 전송하여 표현하려거나 반대의 경우 - 클라이언트가 사용하는언어에 관계 없이 통일된 데이터를 주고받을 수 있도록, 일정한 패턴을 지닌 문자열을 생성해 내보내면 클라이언트는 그를 해석해 데이터를 자기만의 방식으로 저장, 표시할 수 있게 된다- JavaScript 가 아니더라도 JSON을 읽고 쓸 수 있는 기능이 다수의 프로그래밍 환경에서 제공된다- 문자열 형태로 존재한다 -> 네트워크를 통해 전송..

const check_list = [ true, false, false, true, false ];console.log( "before --> " + check_list );for ( let i=0; i " + check_list ); 훨씬 심플한 코드 ▼ ▼ ▼for ( let i=0; i

명령어모드  Ctrl + Shift + P 터미널   Ctrl + `   ( 영문인지 확인 ) ● 한 줄 주석 처리 ( 커서 놓고 or 드래그 해놓고  Ctrl + /   ) ● 여러줄 주석 처리 ( 드래그 해놓고   Alt + Shift + A   ) Extension Pack for Java- Java 개발에 필요한 필수 익스텐션 모음 - 코드 실행 및 디버깅  :  F5단축키설명F9중단점 설정/해제F5디버깅 시작디버깅 중인 경우- (다른 중단점이 존재할 경우) 다음 중단점으로 이동- (다른 중단점이 없을 경우) 나머지 코드 일괄 실행F10다음 줄 실행F11메서드 호출 구문에서 해당 메서드 안으로 들어가기Ctrl + Shift + P  >  ReloadVSCode 프로그램 재실행 ( 껐다 키는 것과 ..

● autofocus페이지가 로드될 때 자동으로 포커스(커서)가 요소로 이동됨을 명시한다.  ● readonly 요소의 입력 필드가 읽기 전용임을 명시한다.입력필드는 사용자가 수정할 수 없고,해당 내용을 하이라이트하거나 복사할 수 는 있다.특정 조건이 충족될 때까지 사용자가 입력 필드의 내용을 수정할 수 없도록 설정하고,특정 조건이 충족되면 자바스크립트 등으로 readonly 속성값이 삭제하여 사용자가 입력 필드를 수정할 수 있도록 조절할 수 있다.disabled 속성이 명시된 입력 필드의 값은 서버로 제출되지 않지만,readonly 속성이 명시된 입력 필드의 값은 서버로 제출된다.  ● value 태그 요소의 초깃값을 명시한다. 태그 요소의 type 속성값에 따라 다른 용도로 사용된다.- "butto..

좌측 사이드바에 카테고리 메뉴를 같은 비율로 정렬하기 위해 flex를 이용했다.( 헤더, 본문, 푸터 부분은 작업중 ) html 부분 CSS 부분 flex column 으로 세로 정렬을 해주고,flex: 1  ( flex-grow:1,  flex-shrink:1,  flex-basis:0% )로 설정하여menu height 사이즈를 같은 비율로 공간을 채운다.

이렇게 중앙배치를 하고 싶을 때 방법이 여러가지가 있다.  1. position, margin 을 이용하는 방법  2. flex 를 이용하는 방법       3. position, transform-translate  이용 1) 부모요소 너비의 50% 되는 위치로 이동2) 자식 요소 너비의 50% 만큼 왼쪽, 위쪽으로 이동

- width, height 는 부모요소를 기준으로 크기를 가진다.- 에 width, height 를 100% 로 부여하기 위해서는 의 부모요소에 크기를 부여해야 기준으로 삼을 수 있다.- 의 부모요소  :        ▷      ▷  ☞ ☞ ☞ ☞ ☞  html, body { width: 100%; height: 100%; }

- 통신규약- 원활한 통신을 위해 지키기로 약속한 규약 - 프로토콜에서는 신호 처리법, 오류처리, 암호, 인증, 주소 등을 포함한다 - 전세계에서 쓰이는 프로토콜을 통합시킨 국제 표준 통신규약이 존재한다 - 이 표준 프로토콜은 UN 산하의 ITU라는 기관에서 국제통신규약을 만들어 사용한다 - 인터넷이 전 세계에 연결되어 자유롭게 사용이 가능한 것도 다 프로토콜 덕분이다 - 인터넷은 TCP/IP 기반 하에 동작하는데 이 자체가 프로토콜이다 - 인터넷을 통해 전 세계로 이메일을 보낼 수 있는 것은 SMTP(Simple Mail Transfer Protocol) 라는 게 규정되어 있고, 전 세계의 메일서버가 이를 따르기 때문이다 - 월드 와이드 웹 (WWW) 역시, HTTP(Hyper Text Transfer..

VS Code 에서  Markdown 사용시 ==>  - Markdown All in One - Markdown PDF - Markdown Preview Github Styling Ctrl+Shift+PMarkdown: Open Preview to the Side Ctrl+Shift+PMarkdown PDF: Export (pdf) 1~6수준만 지원# Header 1 ## Header 2 ### Header 3 #### Header 4 ##### Header 5 ###### Header 6 >> This is a blockquote This is a blockquote This is a blockquote 숫자+.1. 첫번째2. 두번째3. 세번째1. 첫번째 1. 두번째 2. 세번째 ..

[ Windows ]https://git-scm.com/ Git git-scm.com다운받은 파일로 설치 [ mac ]터미널에서xcode-select --install ( $ : 명령 프롬프트에 입력하라는 기호 ) (메일은 예시) 사용자 정보 등록 $ git config --global user.name "hyeon"$ git config --global user.email "hyeon@gmail.com"사용자 정보 제거$ git config --unset --global user.name사용자 정보 확인$ git config --global --list SSH(Secure Shell Protocol) 를 사용해 Github의 repository에서 데이터에 엑세스하고 쓸 수 있다.SSH를 통해..

"쫄지 말자""그냥 하고, 재미를 느끼고, 즐겨라" 프로그래밍은 규칙을 찾기 위해 스스로 탐구하는 과정에서 원리를 발견해 나가는 과정이다. 기분이 태도가 되지 않게. 지친 건 지친 거고.  지칠수록 웃어야 해.  밝게 하자고! 이겨내야지 뭐 어떡해너의 잠재력은 그 누구도 알 수가 없다깨어나라너의 시간이 시작됐다 모든 것은 다 마음먹기에 달린 것 같다 언어는 내 생각을 표현할 수 있는 툴이다 바라보는 시각이 달라져야 한다   찬물도 끓이면 뜨거워지고씨앗도 시간이 흐르면 싹을 틔우죠저희가 만난 건 3개월 전이잖아요저뿐만이 아니라 그 누구라도 야구만이 아니라 그 어떤 일이라도...3개월이란 시간이 지나면...이전보다 더 나아져 있는게...당연한 거 아닌가요?네 장점은 눈에 보이는 것이 아닌,'눈에 보이지 않는..

기능WIN 명령어옵션현재 위치에서 폴더창 열기explorerexplorer   →   현재 cmd 가 위치한 경로를 폴더창으로 열기explorer C:\   →   C드라이브를 위치로 폴더창 열기작업 디렉토리 이동cd       (change directory) 화면을 깨끗이 한다 cls      (clear screen) 현재 디렉터리 파일의 정보 출력dir/?  :  dir 명령어의 Help 모드로 dir 의 모든 옵션을 보여준다./b  :  파일이름만 보기/s  :  하위 디렉터리 보기/ad  :  디렉터리만 보기/ah  :  숨김 파일만 보기/ar  :  읽기 전용 파일만 보기/as  :  시스템 파일만 보기/p  :  출력 내용이 한 화면을 벗어나면 잠시 멈춤         (아무 키나 눌러서 ..

iso 파일 윈도우 설치 파일처럼 소프트웨어 불법 복제를 막기위해 CD롬 형태로만 실행되게 하는 것들이 있다.CD-ROM을 소프트웨어적으로 구현해 놓은 상태를 가상CD 라고 한다.가상CD의 대표 확장자가 iso 이고,  mac용은 dmg 이다.

K-디지털 트레이닝 「WEB3(웹3)전자지갑 풀스택(JAVA, React) 개발자 」 제2의 도전, 개발자의 길 - 2024.07.25 시작. 힘내, 지지마.