내가 보려고 하는 기록:) (57) 썸네일형 리스트형 Node.js x 몽고DB(MongoDB) Schema 정의하기 mongoose의 Schema 메소드를 이용하면 javascript로도 DB를 정의할 수 있다. 프로젝트에 models라는 폴더를 생성한다. (express설치한 서버 폴더 아래에) model은 흔히 MySql DB에서 말하는 테이블과 비슷하다 생각하면 되고, schema는 테이블의 구조라고 생각하면 된다. 먼저 User.js 파일을 생성해서 이 곳에 사용자 정보에 관한 스키마를 정의하자. const userSchema = mongoose.Schema({ //여기에 사용자 스키마를 각자 프로젝트에 맞게 정의하면 된다. 컬럼1:{ 속성:값 } 컬럼2:{ 속성:값 } 등등... }); const User = mongoose.model('User', userSchema); //user변수에 정의한 userSc.. Node.js에 몽고DB연결하기 (feat. Mongoose) MongoDB를 사용하기 위해선 회원가입이 필요하다. www.mongodb.com/cloud/atlas/lp/try2?utm_source=google&utm_campaign=gs_apac_south_korea_search_brand_atlas_desktop&utm_term=mongodb&utm_medium=cpc_paid_search&utm_ad=e&utm_ad_campaign_id=1718986522&gclid=CjwKCAiAnvj9BRA4EiwAuUMDf1EWWlswOCA3022EIG9Lwl219rYxehCfGP5AY9ZnviVORjKWjv7pPRoCHo4QAvD_BwE MongoDB Atlas: Cloud Document Database Cloud-hosted MongoDB service on AW.. 함수형 프로그래밍 시작하기 ★기본개념 ### 평가란, 코드가 계산되어 값을 만드는 것을 말한다. ###일급이란, 값으로 다룰 수 있고, 변수에 담을 수 있고 함수의 인자로 사용될 수 있고, 함수의 결과 값으로 사용될 수 있다. ###일급함수란, 함수를 값으로 다룰 수 있다. 변수에 담을 수 있고, 함수를 인자로 넘길 수 있고, 함수를 리턴값으로 넘길 수 있다. ( => 클로저를 리턴한다. ) ###고차함수란, 함수를 값으로 다루는 함수 고차함수 예시1 apply_1함수는 함수를 인수로 받아서 그 함수에 1을 인자로 넘겨준다. add_2는 받은 인자에 2를 더해주는함수이다. const apply_1 = f => f(1); const add_2 = a => a+2; apply1(add2); // => apply_1((1) => 1+2.. Node.js 시작하기( Node, express 설치) Node.js란 , 브라우저 밖에서도 자바스크립트를 실행할 수 있는 환경을 의미한다. Node.js가 나오기 전까진 자바스크립트가 브라우저 내에서만 실행할 수 있었지만, Node 덕에 브라우저 밖, 서버 사이드에서도 자바스크립트를 실행할 수 있게 되었다. 1. 먼저 터미널을 켜고 노드 명령어를 쳐 본다. node -v // (노드 버전을 확인하는 명령어) 위와 같이 버전이 나온다면, 노드가 설치가 되어 있다. 만약 설치가 되어있지 않다면 아래의 사이트에서 설치를 하면 되는데, 되도록 최신 버전 보다는 LTS버전을 다운로드 하는 것이 안전하다. nodejs.org/ko/download/ 다운로드 | Node.js Node.js® is a JavaScript runtime built on Chrome's V.. Vue.js 컴포넌트 공통 영역 처리하기 (feat. slot) 아래같은 형태의 컴포넌트를 여러 카테고리 게시판에서 공통으로 사용할 수 있도록 수정한다고 하자. 공통 컴포넌트 (하위 컴포넌트) - slot 적용 전 //게시글 제목과 작성자 이름 리스트를 뿌려주는 컴포넌트 {{ elem.title }} by {{ elem.userName }} | {{ elem.timeago}} 대부분의 형태는 비슷한데 세부적인 것들이 다르다면 예를들어, 익명 게시판이 존재해 딱 그 게시판만 사용자 이름을 표시하지 않도록 작성하고 싶다면 그 컴포넌트만을 위해 새로운 컴포넌트를 만들 필요 없이 을 사용하면 된다. 을 사용하면 변동이 있을 수 있는 부분을 상위에서 처리하도록 할 수 있다. 주의할 점은 상위와 하위 컴포넌트에서 slot의 name 속성 값을 동일하게 설정해 주어야 한다. 공통.. Iterable, iterator, generator 개념 결론★ 1.Iterable은 순환이 가능한 값이다. 2.Iterable은 Iterator를 리턴하는 [Symbol.interator]() 함수를 가진다. 3.Iterator는 { value:값, done: bool값 }형태 객체를 리턴하는 next()함수를 가진다. 4.Iterable은 for...of, 전개 연산자, 구조분해, 나머지 연산자 등과 함께 사용할 수 있다. ex) for...of는 next() done:true가 될 때까지 순환한다. 5.Generator는 Iterable이자 Iterable을 생성하는 함수이다. 함수명에 *를 붙여 선언한다. 6. Generator에서 순회할 값 앞에 yield 키워드를 붙여준다. 그럼 이터레이터가 next()로 단계적 순회하듯, 제어가 가능하다. (for.. offsetTop의 기준값 바꾸기 타겟 요소.offsetTop은 스크롤(속도)의 영향을 받지 않아야 하는 것, 고정적이어야 하는 것을 필요로 할 때 유용하다. offsetTop은 기본적으로 document의 상단에서 해당 요소가 얼마나 떨어져 있는지의 값을 나타낸다. 그런데 만약, 내가 구하고자 하는 요소의 offsetTop값이 문서가 기준이 아니라 타겟의 부모 요소를 기준으로 하고 싶다면 (쉽게 말해, 문서 상단에서 타겟 요소 상단 까지 사이의 거리가 아닌, 부모 요소의 상단에서 해당 요소 상단부분 까지의 거리) position 속성을 이용해서 offsetTop의 기준 값을 바꿀 수 있다. 우리가 position: absolute를 사용할 때 처럼, 기준으로 잡을 부모 요소에 position: relative를 해주면 된다. [Javascript Promise 한빛미디어] - 무료 ebook 2015년 책이라 좀 오래되긴 했지만, 내용도 짧고 ES6 기반 설명이라 읽어보면 좋을 것 같다. https://www.hanbit.co.kr/realtime/books/book_view.html?p_code=E5027975256 JavaScript Promise 최근 몇 년, 웹에서는 다양한 변화가 일어나고 있다. HTML5나 ECMAScript6 등 새로운 표준 기술이 잇달아 고안되는 등 웹의 세계는 빠르게 변화하고 있다. 브라우저는 그 변화에 대응하기 위해 릴리즈 www.hanbit.co.kr 이전 1 2 3 4 5 6 ··· 8 다음