일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |
- DART
- node.js
- Component
- CLONE
- frontend
- JavaScript
- NextJs
- TypeScript
- MongoDB
- react
- graphQL
- backend
- heroku
- GRID
- Flutter
- Session
- ECMAScript
- clonecoding
- 리액트
- API
- nodejs
- 자바스크립트
- Mongoose
- javscript
- pug
- HTML
- express
- ES6
- form
- CSS
- Today
- Total
목록JavaScript (99)
Enjoy Programming

자 pug에 대해서 알아봤고 각 템플릿들은 미리 만들어줬다. 이제 페이지의 일부분인 partitial부분을 만들어주자 ~ 음 보니까 지금은 헤더와~ 푸터정도인듯 하다 organization한 purpose라고 한다. partitial 폴더를 생성해주고 footer.pug와 header pug를 만들어 주자. 푸터에는 유튭 아이콘을 넣어주고~ copyright도 작성해주자 그리고 메인pug에 인클루드 해주자~ 역시 진자템플릿처럼 include기능이 있다. 원래 footer자리에 footer태그를 지우고 include ../partials/footer로 설정하면 include 된다 import 느낌? pug에서 자바스크립트 코드를 추가하는 방법은 #{}를 이용하자 javacript에서 날짜를 받는 코드를 작..

음 잘 알지는 못하지만 ECMAScript6에는 브라우저상에서 자바스크립트를 모듈을 export, import할 수 있게 되었다. 일단 모듈이란 애플리케이션을 구성하는 개별적 요소로서 재사용 가능한 코드 조각을 말한다. 모듈은 세부 사항을 캡슐화 하고 공개가 필요한 API만을 외부에 노출한다. 모듈은 파일 단위로 분리 ~ 필요에 따라 명시적으로 모듈을 로드하여 재사용한다. c, java, python은 #include, import등의 모듈 기능을 가지고 있다. 그러나 클라이언트 사이드 자바스크립트는 script태그를 사용하여 외부의 스크립트 파일을 가져 올 수 는 있지만, 파일마다 독립적인 파일 스코프를 갖지 않고 하나의 Global Object를 공유한다. ES6에서는 이를 해결? 하기 위해 expo..

필요한 미들웨어들을 설치하기 전에 express에 대한것을 다시 짚고 넘어가자 express 의 주요기능에는 1. 미들웨어 - 함수를 효과적으로 배열하는 미들웨어 스텍 2. 라우팅 - HTTP method로 특정 URL을 방문할 때만 함수가 호출 됨 3. request/ response 에 대한 확장 - response.redirect() or response.sendFile() 처럼 확장 가능 4. 뷰 - 뷰를 사용해서 HTML을 동적으로 랜더링 할 수 있음(pug, ejs등) 먼저 로그를 관리하기 위한 Nodejs의 미들 웨어인 morgan을 설치해보자 npm install morgan 그리고 import morgan from "morgan";으로 임포트 해주고 app.use(morgan("dev")..

middleware에 대해서 알아보자 미들웨어란 간단하게 말하면 클라이언트(유저)에게 요청이 오고 그 요청을 보내기 위해 응답하려는 중간에 목적에 맞게 처리를 하는 말하자면 거쳐가는 함수들이라고 보면된다. 미들웨어 함수에 대한 엑세스는 next함수를 이용해 다음 미들웨어로 현재 요청을 넘길 수 있다. 순차적으로 처리하는 것이다. 순서가 매우 중요하다!! 어디에 두고 쓰느냐! 이다. 미들웨어 함수 betweenHome을 만들어 줬다. 매개변수에는 req객체와 res객체 next(다음으로 엑세스할 함수) 그런 다음 라우트에 두개의 함수를 집어 넣어준다. root에 접속하게 되면 handelHome함수를 실행하기전에 betweenHome 미들웨어 함수를 실행 하게 된다. 그럼 콘솔창에 between이 찍히고 ..

1. 변수 (variable) 프로그래밍을 공부하면 가장 중요한게 변수이다. variable이란 메모리상에 value를 저장하고 그 저장된 value를 참조하기 위해 사용한다. memory address에 접근하기 위해 사람이 이해 할 수 있는 언어로 지정한 identifier(식별자) javascript에서는 변수를 선언할때 const, let, var를 사용한다. (var는 점점 쓰지 않는 추세이다. 2. value 값을 정의 하기에 앞서 용어 두개를 더 정리하자 변수는 이미 알고 있으니 data type: 프로그래밍 언어에서 사용할 수 있는 값의 type literal : 소스코드 안에서 직접 만들어 낸 상수 값 자체를 말하며 값을 구성하는 최소 단위 여기에 value는 프로그램에 의해 조작될 수 ..

대부분 프로그래밍 언어는 OS에서 실행 되지만 웹어플리케이션의 자바스크립트는 브라우저에서 html, css와 함께 실행된다. 브라우저의 핵심 기능은 사용자가 참조하고자 하는 웹페이지를 서버에 request하고 server의 response를 받아 브라우저에 표시하는 것이다. 브라우저는 서버로부터 html, css ,javascript, image file등을 response받는다. html, css 파일은 렌더링 엔진의 html parser와 css parser에 의해 parsing되어 DOM, CSSOM tree로 transform되고 render tree로 combine된다. 이렇게 생성된 render tree를 기반으로 브라우저는 웹페이지를 표시한다. 자바스크립트는 렌더링 엔진ㄴ이 아닌 자바스크립트..