node-sass 설치 후 1. vs code의 터미널에서 npm install 입력하여 node_modules와 package.json 만들기 2. package.json의 "scripts" 수정 ( "node-sass": "node-sass", "sass": "node-sass styles/main.scss ./style.css" 추가 입력) 3. 기본적인 폴더 구조를 잡는 단계. scripts에 쓰여진 경로와 같이 styles 폴더를 만들어 sass파일들을 작성하였다. 4. 터미널에 npm run sass 입력하면, sass파일에 작성한 코드가 css파일에 자동으로 적용되는 것을 볼 수 있다.

이미지 스프라이트란 여러 개의 이미지를 하나의 이미지로 합쳐서 관리하는 이미지를 의미한다. 웹페이지에 이미지가 사용될 경우 해당 이미지를 다운받기 위해 웹 브라우저는 서버에 이미지를 요청하게 된다. 하지만 사용된 이미지가 많을 경우 웹 브라우저는 서버에 해당 이미지의 수만큼 요청해야만 하므로 웹 페이지의 로딩 시간이 오래 걸리게 된다. 이미지 스프라이트를 사용하면 이미지를 다운받기 위한 서버 요청을 단 몇 번으로 줄일 수 있다. 모바일 환경과 같이 한정된 자원을 사용하는 플랫폼에서는 웹 페이지의 로딩 시간을 단축해주는 효과가 있다. 또한, 많은 이미지 파일을 관리하는 대신 몇 개의 스프라이트 파일만을 관리하면 되므로 매우 간편하다. // ex. 코드예시

최초 접속자가 브라우저에 접속하면 init이 실행되며(최초 1회) 서버 주소가 만들어진다. 한번 만들어진 서버 주소는 이후 접속하는 사람들에게 뿌려진다. 서버 종료 시 destroy를 실행한다.

직접 연계 방식 중 DB Connection 방식은 수신 시스템의 WAS에서 송신 시스템 DB로 연결하는 커넥션 풀(Connection Pool)을 생성하고 연계 프로그램에서 해당 DB의 커넥션 풀명을 이용하여 연결하는 방식이다. 커넥션 풀은 데이터베이스 메모리 내에 있는 데이터베이스 커넥션들로 구성된 하나의 캐시인데, 데이터에 대한 요청이 발생하면 재사용되는 것으로 데이터베이스의 수행 능력을 향상시킨다. 커넥션 풀을 생성하는 방법은 다음과 같다. // context.xml 내부 위와 같은 코드를 파일에 복사-붙여넣기해주고 DAO 클래스 내부를 수정하면 커넥션 풀을 사용할 수 있다. // DAO 클래스 내부 private DataSource ds = null; // 커넥션 풀 사용을 위한 객체 DataS..

사용자가 사이트에 접속하면, 브라우저는 서버에 페이지를 요청한다. 서버로부터 정보를 전송받게되면 브라우저는 전송받은 코드를 해석하여 화면에 그리기위해 HTML에 있는 요소들을 Document Object Model로 만들기 시작한다. DOM에는 우리가 각각 정의한 요소들이 나무 형태로 요소들마다 각각의 뿌리를 내려가며 구성되어 있다. DOM이 다 그려지면 DOM과 CSS를 병합하여 CSS Object Model을 만들고, DOM과 CSSOM을 결합하여 최종적으로 브라우저에 표기될 요소들만 선별된 Render Tree를 구현하고 페이지를 렌더링한다. 위와 같은 일련의 과정을 수행하는 요소는 브라우저의 랜더링 엔진이다. 랜더링 엔진은 HTML과 CSS를 파싱하여 화면을 표시한다. 사용자의 접속부터 브라우저가..

배열(Array)이란 여러개의 데이터를 하나로 그룹핑해서 관리하는 자료구조로, 가장 기본적인 자료구조이다. 논리적 저장 순서와 물리적 저장 순서가 일치하여, 인덱스 번호 순서대로 원소가 동일한 크기의 일정한 공간에 빈틈없이 연속적으로 나열된다. 인덱스를 기준으로 데이터가 저장되기 때문에, 인덱스 번호를 활용해서 자료를 조회할 수 있다. // 배열 만들기 const fruits = ['사과','바나나','배','포도','딸기']; console.log(fruits); // 배열의 길이는? console.log(fruits.length); //5 // 0번 인덱스의 자료를 콘솔에 찍기 console.log(fruits[0]); // -> '사과' // 1번 인덱스의 자료를 콘솔에 찍기 console.log(..