본문 바로가기

Node.js

(7)
3
2. State, useState State React 에서는 모든 Component에 대한 랜더링이 이 State가 변경될 때 실시되며, react에서 사용되는 변수이다. State 의 선언 모든 State 함수가 동작하기 위해, react내 React, { useState } 가 Import 되어야 한다. state 를 사용하기 위해서 state 변수 선언을 통해서 시작하는데 state를 정의하는 useState() 함수는 다음과 같은 정의를 가진다. var [state데이터 , state 변경함수] = useState('데이터') State 의 변경 어떤 State의 구조를 변경하기 위해서, React의 state는 변수의 재할당을 통해 변경되는 모든 데이터는 State 변경함수를 통해 변경되어야 한다. 변경함수(대체데이터) 가령 ..
1. JSX React에서 사용되는, 시간에 따라 이벤트처리를 위해 State가 동기화되는 방식으로 기존 자바스크립트를 확장하여 만들어진 문법이다. # class 가 아니라, className 예약어를 사용한다. - Js 파일이기 때문에, class가 아닌, 준비된 예약어 className을 사용한다. - 즉, 과 같이 사용하여 CSS를 적용한다. # 리액트의 데이터 바인딩 방법 [ 중괄호 { } 사용 ] - 중괄호 {} 에 변수명이나 함수를 넣기만 하면 됨, ejs문법에서는 과 같은 표현식을 사용해야 했음 - (일반 js 에서는 dom 제어[document.getElementById("john")] , jquery dom 제어 처럼[ $("#john") 선택자 처럼 ) - 하나의 파일 내에 js 함수를 정의하고, ..
JS 상에서 server 혹은 router로 부터 받아온 데이터를 넘기기 라우트, server 를 통해 응답.send, render, json을 통해 ejs파일로 넘겨 EJS 파일의 표현식에서 기존 HTML 문법에 표현식 를 사용하여, 변수를 받아올 수 있다. 하지만 자바스크립트에서 이 변수를 활용하려면 Log를 사용하거나, 자바 스크립트 문단 전체를 표현식에 감싸야 하는데 간단히 변수를 받을 수 있는 다음과 같은 방법이 있다. input 태그의 hidden 속성은 사용자에게 보여지지 않는 데이터를 정의할 때 유용하다. 중요하지 않은 넘길 데이터를 input 태그를 활용하여 받아와 jquery, javascript 등의 선택자로 받아와 사용할 수 있다. 단, 사용자 View 상에서 보이지 않을 뿐, 여전히 소스상에서는 확인할 수 있기 때문에 중요한 정보를 전송하는 방법의 쓰임..
2. multer 패키지 multer는 파일, 이미지 업로드, 필터링 등의 폼 전송 데이터를 처리하기 위해 사용된다. npm install --save dotenv let multer = require('multer'); var storage = multer.diskStorage({ destination : function(req, file, cb){ cb(null, './public/images') // 출력 경로 정의 }, filename : function(req, file, cb){ cb(null, file.originalname) // 출력 파일명 정의 } var upload = multer({storage : storage , fileFilter : function(req, file, cb){ var ext = pat..
1. dotenv 패키지 dotenv 는 node.js 프로젝트 내 환경변수를 파일에 저장하여 관리할 수 있도록 하는 라이브러리이다. npm install --save dotenv .env PORT=8080 HOST=localhost USER=ROOT PASS=TOOR env 파일의 내부는 다음과 같이 키-값 쌍으로 이루어져 있는데 server를 호출하는 js파일에 이와 같이 명시할 수 있다. server.js require('dotenv').config(); env 파일 내에 삽입된 코드[환경변수]는 server.js 동작 상에서 상주하고 있다. 특징 □ 서버파일에서 직접 DB 접근을 명시하지 않게 되어, 여러 플랫폼 환경에서 유연하게 사용할 수 있다. □ 사용자 중요정보 (비밀번호 등)를 노출하지 않아, 하드코딩 취약점에서 ..
Node.js 기본 + 몇가지 라이브러리 Node.js 란? Js(자바스크립트)가 브라우저 혹은 클라이언트 PC 상에서 실행되게 하는 런타임 환경 Js상 코드들이 해석되서 실행되게 함. Node.js 의 특징 1. JavaScript 런타임 Node.js 플랫폼은 JavaScript를 좀 더 유연하고 능동적으로 사용할 수 있게 해주며 브라우저만이 아닌 일반 클라이언트 환경에서 사용될 수 있게 한다. 2. Non-blocking I/O Non-blocking 구조는 I/O 제어를 막지 않고, 하나를 처리하는 와중에 다른 접근자를 받아주며, 요청 자원에 대한 필요 순서 제어를 해주기 때문에 더 큰 제어 트래픽 부과에도 무리가 없다. 3. Npm Npm [ Node Package Manager ] 는 Node.js 의 패키지 관리자로, 파이썬의 pi..