본문 바로가기

전체 글

(266)
알토르 1주차 - Typing game Typing-pong 단어 Start 점수: 0점 시간: 0초const wordDisplay = document.querySelector('.word-display');let wordList = ['apple', 'banana', 'cherry', 'date', 'elderberry'];console.dir(wordDisplay);const wordDisplay = document.querySelector('.word-display');let wordList = ['apple', 'banana', 'cherry', 'date', 'elderberry'];console.dir(wordDisplay);wordDisplay.inner..
알토르 1주차 인스타 Instagram A B C Username 00명이..
알토리 0주차 JavaScript 1. 자바스크립트 기본 문법 이해하기 (변수생성,if,for,while,function,array,object 등)2. 자바스크립트 DOM 조작 이해하기1. 자바스크립트 기본 문법(1) 변수 생성var / let / constvar : 함수 스코프 / 재선언 가능 / 재할당 가능let : 블록 스코프 / 재선언 불가 / 재할당 가능const: 블록 스코프 / 재선언 불가 / 재할당 불가 ( 상수 )재선언: 이미 선언된 변수에 동일한 이름으로 다시 선언재할당: 이미 선언된 변수에 새로운 값을 다시 할당(2) 조건문if (조건 1) {} else if (조건 2) {} else {}if와 스위치의 차이(3) 반복문for (let i = 0; i for와 while 차이(4) 함수function add(x, ..
알토르 0 주차 CSS CSS 선택자 이해하기CSS 기초 레이아웃 이해하기 1. CSS CSS란, 정적인 문서를 보여주는 HTML 문서를 세련되게 꾸며주는 화장품이자 악세사리, 옷 HTML 문서의 특정 요소를 선택하여 스타일을 적용하는 1.1. 기본 선택자전체 선택자 (*): HTML 문서의 모든 요소 선택 * { box-sizing: border-box; /* 모든 요소에 box-sizing 속성을 적용 */} 태그 선택자 (태그이름): 특정 태그를 가진 모든 요소 선택 h1 { font-size: 20px; /* 모든 태그의 글자 크기를 20px으로 설정 */}p { color: gray; /* 모든 태그의 글자 색상을 회색으로 설정 */} 클래스 선택자 (.클래스명): 특정 클래스 속성을 가진..
CSS selector 게임으로 배워보자 CSS Diner (1 - 19) 중복 개념은 제외함 Select the plates plate #id_name #fancy plate apple plate 위에 appleplate 박스 안에 apple #id-name object #fancy pickle id 위에 피클 apple.small apple인데 small 클래스클래스는 공유 가능 bento orange.small 벤또 위에 오렌지인데 small클래스 plate, bento plate * plate 위에 everything plate+apple plate 와 결합된 apple bento ~ pickle bento에서 부터 pickle까지bento는 제외pickle.small / pickle / plate pickle / plate pic..
알토르 0주차 HTML/CSS 외우지 않기설명하기외워짐 당하기 html> head> title>First Pagetitle> head> body> input type="text"> button>CLICKbutton> Hello p>This isp> span>Firstspan> WebPage body>html> html> head> title>First Pagetitle> style> p{ color: red } style> head> body> input type="text"> ..
0주차 과제 1. 웹 브라우저란 무엇인가 핵심기능웹 브라우저란 컨텐츠를 제공하는 판 웹 페이지라는 데이터를 담아주는 접시 2. 서버란 무엇인가서비스를 제공하는 무언가 3. 클라이언트는 무엇인가서비스를 요청하는 무언가서비스를 받는 무언가 4. IP,DNS,Domain,Port 무엇인가IP는 숫자로 이루어진 논리적 주소로 가변적이다 = 컴퓨터 집 주소DNS는 숫자로 된 주소를 기억하기 쉬운 이름을 알려주는 서버 (IP=Domain 매핑)Domain은 기억,구분할 수 있는 하나의 별명Port는 같은 아파트의 다른 호수와 같이 구분되어지는 주소 / 서비스 번호 5. 네트워크란 무엇인가서로 통신할 수 있게 연결된 망 6. 공유기란 무엇인가네트워크를 공유하는 것하나의 동일한 네트워크 대역를 공유하는 것서로 통신 가능한 하나의..
Apache / Nginx Apache 모듈 기반 아키텍쳐다양한 운영체제 지원.htaccess 지원 : 디렉터리별로 설정 가능 ( 접근 제어 리디렉션 )동적 컨텐츠 처리 Nginx고성능 웹 서버 소프트웨어 - 비동기 이벤트 기반 구조동시 연결 효율적 처리 가능 - 가벼운 리소스 사용량적은 메모리로 고성능 - SSL 종료 지점으로 HTTPS 처리 - 정적 파일 제공정적 웹사이트 호스팅 - 리버스 프록시 백엔드 서버 앞에서 클라이언트 요청을 받아 분산 처리 및 보안 강화서버가 숨어서 응답하는 구조 * 로드 밸런서 메일 프록시 Apache Nginx처리 방식프로세스/스레드 기반 (요청마다 새로 생성)이벤트 기반 비동기 처리 (고정된 프로세스로 다수 요청 처리)동시 접속 처리많은 요청 시 리소스 소모 증가적은 리소스로 수천 ..