목록SeSAC 풀스택/JavaScript (10)
생각기록

1. 최상위 js 부터 읽고 라우터 미들웨어로 걸어 놓은 부분 ./routes > 그파일로가면 라우터 정의해둔게 있다 2. 라우트 파일 확인(라우터만 존재) '/' ,controller.visitor //localhost:8000/visitor 3. 컨트롤러 파일( 라우터에 요청이 왔을때 해야 할 일) 가서 라우터에서 하고싶은 일 함수 생성하고 > 라우터 파일 순으로 해줘야 오류가 뜨지 않습니다. visitor 함수 안에 get_visitor는 Visitor이라는 객체를 타고 오고있다. Visitor는 model의 파일을 require하고 있다. 4. model 파일 초반 8줄은 mysql 로그인 그 곳에 get_visitor가 컨트롤러의 기능으로 들어가게 된다 직접적으로 쿼리문, sql문을 날리는 것도..

데이터 타입 기본형 primitive type 참조형 reference type 기본형 primitive type number 숫자 string 문자열 boolean 블리언 null 널 undefined symbol es6에서 추가 참조형 reference type 객체 object 배열 함수 정규표현식 set/weakset es6에서 추가 map/weakmap es6에서 추가 stack memory heap memory 기본형의 할당 과정 참조형의 할당 과정 Q. 왜 변수 영역에 값을 직접 대입하지 않고 굳이 번거롭게 한 단계를 거치나? 이는 데이터 변환을 자유롭게 할 수 있게 + 메모리를 효율적으로 관리하기 위한 결과 참조형의 재할당은? 기본형과 참조형의 차이는 기본형은 기본 주소 1002에서 값 :..

실습 21. 전체 실습 2022년 11월 조건 조건 1. 배우지 않은 Javascript 라이브러리 사용하기 Ex) Sweetalert, Chart.js, Scroll, Fullpage 등등 조건 2. Bootstrap Component 또는 Utility 5개 이상 사용하기 조건 3. 반응형 페이지로 만들기 Navbar 가운데 정렬하는 법 https://mdbootstrap.com/how-to/bootstrap/navbar-center/ How to center Bootstrap Navbar - code helpers To center the Navbar horizontally use flexbox utilities. Add .justify-content-center classes to the Navb..

이벤트 리스너란? 이벤트가 발생했을 때 그 처리 담당하는 함수 *이벤트: 윈도우창에서 일어날수있는 모든것, 앤터, 클릭, 포커스 등 로딩이벤트 .ready() 처음으로 브라우저가 켜질때 발생하는 이벤트 특징: 바디 콘텐츠보다 먼저 키자마자 발생하는 이벤트 즉 = 사람들한테 내용을 보여주기 전에 하는 작업을 넣는 곳 마우스 이벤트 click() 마우스클릭시 이벤트 발생 // 아이디가 디브1인 친구한테 마우스가 클릭되었을때 어떤 동작을 걸겟다 실행되는 부분이 함수 // e는 다른걸로 바꿔도 상관없다. $("#div1").click(function(){ console.log( "div click" ); }); mouseover과 hover의 차이점 mouseover() 마우스를 올렸을때 발생하는 이벤트 선택한..

오픈소스 기반 제이쿼리는 자바스크립트 언어를 편히 사용 할 수 있도록 단순화 시킨 오픈 기반의 자바스크립트 라이브러리 라이브러리 : 자주 사용하는 기능들을 모아두었다가 필요할 때 가져다 쓸 수있다. 사용법 다운, 이미지 호출하듯 호출 외부 CDN https://releases.jquery.com/ jQuery CDN The integrity and crossorigin attributes are used for Subresource Integrity (SRI) checking. This allows browsers to ensure that resources hosted on third-party servers have not been tampered with. Use of SRI is recommend..

부트스트렙 프레임워크 틀이 짜여있어서 개발 초보에게 편하다. 웹 사이트를 쉽게 만들 수 있게 도와주는 공개 HTML 단점: 다른사람이 틀 잡아 놓은 것을 쓰는거기 때문에, 이미 만들어진 프레임워크를 바꾸고 추가하려면 복잡한 내용을 분석, 변경해야한다. => 원하는 구조로 바꾸는게 어렵다. 써보고 나에게 맞는 방향으로 할 것 프레임워크의 확장성 = 커스터마이징에 얼마나 용이, 편리한가 에 따라서 좋다고 판단됨 온라인 상에 사람들이 올려둔 CDN을 가져와서 사용 할 것이다. 다운로드 하지 않아도 된다. 왼쪽에 레이아웃 .. 등 여러가지로 구분지어놔서 만드는 방법이 있다. 이것들을 복사 붙이기 해서 사용할 것 "btn btn-primary" "btn btn-outline-primary" btn은 부트스트렙, ..

DOM (문서 객체 모델) XML이나 HTML 문서에 접근하기 위한 일종의 인터페이스다. 문서 내의 모든 요소를 정의하고, 각각의 요소에 접근하는 방법을 제공 문서에 정의해 놓은 태그나 이런것들을 제공해주는 모델이다. DOM 모델 HTML의 구조와 요소상하관계 알수있다. 새로운HTM요소나 속성 추가 존재하는 HTML요소나 속성 제거 HTML문서의 모든 HTML 요소 변경 HTML 문서의 모든 HTML 속성 변경.. 등이 가능하다. 이런것들을 사용하기 위해 쓰는 것들이 Document 객체이다. Document 객체 특정한 html요소에 접근하여 추가, 변경 할 때 사용하는 객체이다. HTML 요소 찾기 Id로 찾기 태그 이름으로 찾기 속성 document.documentElement //이문서의 모든 요..

자바스크립트의 가장 기초적인 자료형은 객체(Object)이다. 객체는 실제 세상에 존재하는 사물을 모델링 한 것 객체 데이터는 객체가 가지고 있는 특성값(속성) 객체의 동작은 객체가 수행할 수 있는 동작(기능) 객체 : 고양이 속성 : 이름-나비 , 나이-1살 메소드(함수) : mew()-울다 함수는 객체가 할수있는 동작, 속성은 객체 안에 존재할 수 있는 명사들이다. 객체 안의 변수 = 속성 객체 안의 함수 = 메서드 둘을 포함하는 묶음 = 객체(컨테이너) 객체 안의 변수는 외부 세계로부터 감추어져 있다. >데이터를 객체 안에 숨기면, 데이터가 실수로 다른 객체에 의해 변경되는 것을 방지 *생성자란 객체가 생성될 때 마다 실행되는 메소드를 뜻 합니다. 1) function 생성자 이름 () { 속성, ..