SeSAC/javascript

[SeSACXCodingOn] 웹풀스택과정 06W_3_18 : MVC (+라우터쪼개기)

[🌱목차🌱] 디자인 패턴이란? MVC 디자인 패턴이란? +) 라우터 쪼개기 해보기 01. 디자인 패턴이란? 디자인 패턴은 소수의 뛰어난 앤지니어가 해결한 문제를 다수의 엔지니어들이 처리 할 수 있도록 한 규칙이면서, 구현자들 간의 커뮤니케이션의 효율성을 높이는 기법입니다. 02. MVC 디자인 패턴이란? Model View Controller의 약자로 애플리케이션을 세가지의 역할로 구분한 개발 방법론입니다. 사용자가 controller를 조작하면 controller는 Model을 통해서 데이터를 가져오고 그 정보를 바탕으로 시각적인 표현을 담당하는 View를 제어해서 사용자에게 전달하게 됩니다. [MVC를 이용한 웹 프레임워크] PHP Django Express Angular Etc.. 이 개념을 웹에 ..

비동기 처리

01. 비동기 처리란? 특정 코드의 연산이 끝날 때까지 코드의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 자바스크립트의 특성입니다. 비동기처리의 이유는 클라이언트가 서버로 데이터를 요청 시 , 서버가 언제 그 요청에 대한 응답을 줄지 모르는데 마냥 다른 코드를 실행하지 않고 기다릴 순 없기 때문입니다. 만약 동기 처리로 실행하게 된다면 웹을 실행하는데 수십분이 걸리는 대참사가 일어나게 됩니다. //편의점에 들어가서 음료수를 사고 나오는 상황 function goMart() { console.log('마트에 가서 어떤 음료를 살지 고민한다.'); } function pickDrink() { setTimeout(function () { console.log('고민 끝!'); product = '제로콜라'..

[SeSACXCodingOn] 웹풀스택과정 4W_11 _01: Node.js + Module + Express

[🌱목차🌱] Node.js 란? Node.js 특징 JavaScript 언어 사용 Single Thread Non-Blocking I/O 이벤트 기반 아키텍쳐 Node.js 역할 모듈 자바스크립트에서 모듈을 다루는 방식 NPM http 모듈 Express [ : Node.js를 이용하여 서버 만들기 ]01. Node.js란? 서버 측 자바스크립트 런타임 환경으로 브라우저 밖에서 자바스크립트를 사용할 수 있습니다. 자바스크립트 실행 엔진으로 구글 크롬에서 사용하는 V8 엔진을 탑재하여 실행 속도가 빠르고, 이벤트 기반, 비동기 I/O모델을 사용하여 가볍고 효율적입니다. 즉, Node.js는 Chrome V8 JavaScript 엔진으로 빌드 된 JavaScript 런타임으로 노드를 통해 다양한 자바스크립트..

[SeSACXCodingOn] 웹풀스택과정 2W_06 _04: javascript Event

01. 이벤트란 javascript 에서 이벤트 (event) 란 어떤 사건을 의미합니다. 예를 들면 버튼클릭, 웹페이지 로드, 키가 눌렸을 때 발생할 일 등등 이런 이벤트에 "함수"를 등록하는 방법은 2가지 입니다. HTML 상에서 onXXX 속성으로 등록하기 js에서 listener를 사용하여 등록하기 01-1 onXXX 속성으로 등록 첫번째 방법으로 이벤트를 등록해보겠습니다. js 이벤트 html에 다음을 입력하면 js 이벤트 텍스트를 가진 요소를 클릭하면 제목클릭이라는 텍스트를 가진 alert창이 나타납니다. 02-1.addEventListener ('click', function (){}); addEventListener의 사용방법은 이렇습니다. 먼저 click 이벤트에 대해 예시로 보여드리겠습..

[SeSACXCodingOn] 웹풀스택과정 2W_06 _03: javascript DOM

01. DOM (Document Object Model) 이란? DOM (문서 객체 모델) 이란, HTML 또는 XML 문서의 프로그래밍 인터페이스 입니다. DOM은 문서의 구조화된 표현을 제공하며 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여 문서 구조, 스타일, 내용 등을 변경할 수 있도록 도와줍니다. DOM 은 웹 페이지의 객체 지향 표현이며 자바스크립트와 같은 스크립팅 언어를 이용해 DOM 을 수정할 수 있습니다. DOM을 수정하여 할수 있는 일은 새로운 HTML 요소나 속성 추가 존재하는 HTML 요소나 속성 제거 HTML 문서의 모든 HTML 요소 변경 HTML 문서의 모든 HTML 속성 변경 HTML 문서의 모든 CSS 스타일 변경 HTML 문서에 새로운 HTML 이벤트 추..

[SeSACXCodingOn] 웹풀스택과정 2W_06 _01: javascript_표준객체

01. 객체 (object) 객체란 실생활에서 우리가 인식할 수 있는 사물입니다. 예를들어 자바 스크립트에서 '고양이'가 있다면 객체는 고양이 그 자체이며, 이 객체는 이름, 나이등의 속성이 있고 먀옹 하고 우는 메소드라고 할 수 있습니다. 정리하자면 객체 -> 고양이 속성(프로퍼티) -> 이름 :춘식 / 나이 : 3살 메소드 -> 먀옹() 이 구조를 const cat = { name : "춘식", age : 3, mew :function(){ return "먀옹" }; } 이렇게 정의 할 수 있습니다. 01-1 object의 자료형 - 배열 배열은 숫자형과 문자열과 마찬가지로 일반적인 스크립트와 동일합니다. [] 나 new array()를 이용해 생성합니다. const arr1 = [1, 2, 3, '..

메뉴바
'SeSAC/javascript' 카테고리의 글 목록
상단으로

티스토리툴바