본문 바로가기

학습노트/기초지식

(11)
[node.js] req.body가 안 보내질 때 아래 이 한 줄이 추가되어 있어야 프론트엔드에서 보낸 데이터를 서버에서 req.body로 받아올 수 있습니다. app.use(express.json());
구형 웹 브라우저 체크하기 (IE 10 이상 브라우저) + 조건부 주석 (IE 10 미만 브라우저) javascript navigator 안녕하세요 포스팅에서는 구형 웹 브라우저를 체크하여 경고창을 띄우거나 다른 웹을 그리게 하는 방법에 대하여 소개하겠습니다. 이 방법을 소개하게된 이유는 현재 진행 중인 프로젝트에서 구형 웹 브라우저에서 웹 화면이 정상적으로 작동하지 않는 문제를 발견하였기 때문입니다. 문제를 해결하고 블로그에 포스팅하면 좋을 기술이겠다 싶어서 올리게 되었습니다. 우선, IE 10 미만의 버전에서는 조건부 주석이라는 방법으로 해결할 수가 있습니다. 해당 HTML에서 아래와 같은 형태로 조건부 주석을 사용할 수 있습니다. 조건부 주석에 사용되는 기호 ! 부정 [if !ie] ie가 아니라면 lt 작다 [if lt ie 7] ie7보다 작다면 lte 작거나 같다 [if lte ie 7] ie7보다 작거나 같다면 gt 크다 [i..
npm install bcrypt error 해결 방법 bcrypt 설치시 아래와 같은 오류가 뜬다면 해결하는 방법이 있습니다. 오류 코드 > bcrypt@3.0.6 install D:\Project\test\bb\back\node_modules\bcrypt > node-pre-gyp install --fallback-to-build node-pre-gyp WARN Using needle for node-pre-gyp https download node-pre-gyp WARN Tried to download(404): https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.6/bcrypt_lib-v3.0.6-node-v72-win32-x64-unknown.tar.gz node-pre-gyp WAR..
How to send a request body with a DELETE request (axios) axios를 이용하여 서버와 프론트에서 데이터를 주고 받는데 get이나 put을 이용하면 body로 request를 받아올수 있지만 delete는 못받온다. 하지만 delete를 이용해서 받아오는 방법을 찾아내서 적어본다. front 측 const deletePost = (id) => { const posts = { token: localStorage.getItem("company-auth-token") }; Axios.delete(`/posts/${id}`, {data:{posts: posts}}) .then((req) => alert("삭제완료")) setPost(post.filter((elem) => elem.id !== id)); }; 프론트측에서 이런 식으로 url 다음 파라미터에 {data: ..
[GitHub] github 기초 용어와 github desktop설치방법 GitHub란? 소프트웨어 개발 프로젝트 분산 버전 관리 툴인 Gitd을 사용하는 웹호스팅 서비스이다. GitHub에 자료를 올리기 위해서는 계정을 만들어야 하지만 공개 저장소에 저장되어 있는 자료들은 누구든지 조회 및 다운로드가 가능하다. GitHub 기초 용어 커밋(commit): 파일을 추가하거나 변경 내용을 저장소에 저장하는 작업 푸시(push): 파일을 추가하거나 변경 내용을 원격 저장소에 업로드하는 작업 병합(merger): 각 브랜치로 생성된 작업들을 하나로 합치는 작업 로컬 저장소 and 원격 저장소 파일이나 변경 이력 등을 관리하는 디렉터리를 저장하는 곳이 저장소이다. 자신의 컴퓨터에 있는 것이 로컬 저장소이고 서버 등 네트워크에 있는 것이 원격 저장소이다. 간단하게 로컬 저장소에서 작업..
[Express] express와 사용방법 Express란? Node.js를 위한 빠르고 개방적인 간결한 웹 프레임워크이다. 웹 서버를 만들 때 손쉽게 만들 수 있어서 사용하려고 한다. Node.js의 핵심 모듈인 http와 Connect 컴포넌트를 기반으로 하는 웹 프레임워크이다. 그러한 컴포넌트를 미들웨어(middleware)라고 한다. 개발자들은 특정 프로젝트에 필요한 라이브러리를 어떤 것이든 자유롭게 선택할 수 있으며, 유연함과 수준 높은 맞춤식 구성을 보장한다. Express의 작동방식 1. 컨트롤러, 유틸리티, 도우미, 모델과 같은 자체적인 모듈을 비롯한 서드파티 의존 모듈을 포함한다. 2. 템플릿 엔진과 해당 템플릿 엔진의 파일 확장자와 같은 Express.js 앱 설정을 구성한다. 3. 오류 핸들러, 정적 파일 폴더, 쿠키 및 기타..
[axios] axios와 사용법 axios란? HTTP Cilent 라이브러리로써, 비동기 방식으로 HTTP 데이터 요청을 할 수 있다. 또한 내부적으로는 직접적인 XMLHttpRequest를 다루지 않고 'Ajax 호출'을 할 수 있다. Ajax란? Asynchronous Javascript And XML의 약자로 jQuery의 비동기적인 웹 애플리케이션을 제작할때 사용하는 기법이다. 비동기식 자바스크립트 XML이라고 할 수있다. axios 설치방법 npm install --save axios axios 사용방법 설치 후 서버 파일이 될 js파일 상단에 선언해준다. const axios = require("axios"); GET API 호출 const axios = require('axios'); // Make a request fo..
[Sequelize] Sequelize와 사용법 그리고 sequelize query Sequelize Sequelize란 node.js에서 mysql등 관계형 데이터베이스를 쉽게 다룰수 있게 도와주는 라이브러리이다. Sequelize는 대표적인 node.js의 ORM(Object Relational Mapping)이다. ORM이란? 2020/09/28 - [학습노트/기초지식] - [ORM] Object Relational Mapping이란? [ORM] Object Relational Mapping이란? 프로그래밍을 하다보면 자신이 원하는 서비스를 만들고 싶을 때 많은 개념들을 접하게 됩니다. 저도 마찬가지로 프로젝트 진행중에 ORM이라는 개념을 보게되어 공부하고 정리하려고 합니다. 1. O ukcasso.tistory.com 위에 ORM을 정리해놓은 글을 보아도 좋지만 간단하게 말해서 ..
[MySQL2] MySQL과 MySQL2의 차이점 공부를 하다보면 DB와 node.js서버를 연결시킬 일이 생긴다. 그런데 우리는 지금까지 MySQL만 들어봤지 갑자기 MySQL2도 나오고 두 가지의 차이점이 무엇인지 알아보고 싶었다. 이번 포스팅은 정말 두가지의 차이점만 쓰고 끝낼 것이라서 간단한 글이 될것같다. MySQL과 MySQL2의 차이점은 바로 promise이다. mysql은 callback기반이기 때문에 promise를 사용하지 못하고 npm에 있는 promise-mysql 모듈을 따로 설치해서 사용해야한다. 하지만 mysql2는 promise를 지원하기 때문에 다른 모듈을 설치하지 않고 사용이 가능하다. promise란? promise로 구현된 비동기 처리 함수는 콜백을 예측 가능한 패턴으로 사용하도록 도와준다. 순차적이지 않은 비동기함수..
[WEB API] Web API란? (REST, RESTful, URL, URI, HTTP 응답 코드) 1. API란? API는 Application Programming Interface의 약자로 응용 프로그램에서 사용할수 있도록, 운영체제나 프로그래밍 언어가 제공하는 기능을 제어할 수 있게 만드는 인터페이스를 뜻한다. 주로 파일 제어, 창 제어, 화상 처리, 문자 제어 등 자신이 원하는 기능을 제어할 수 있도록 하는 인터페이스를 제공한다. 따라서 원하는 기능을 제어하는 API를 직접 만들 수도 있다. 2. WEB API란? 웹 서버 또는 웹 브라우저를 위한 애플리케이션 프로그래밍 인터페이스이다. HTTP 서비스이고 다양한 클라이언트에서 접근이 가능하도록 설계되어있다. Web 환경을 통해 제공되는 데이터 CRUD인터페이스를 제공한다. HTTP 표준 접근 방식을 이용하며 플랫폼 환경, 클라이언트 환경의 제..
[ORM] Object Relational Mapping이란? 프로그래밍을 하다보면 자신이 원하는 서비스를 만들고 싶을 때 많은 개념들을 접하게 됩니다. 저도 마찬가지로 프로젝트 진행중에 ORM이라는 개념을 보게되어 공부하고 정리하려고 합니다. 1. ORM이란? Object Relational Mapping의 약자로 관계형 데이터베이스 관리 시스템(RDBMS, Relational Database Management System)와 객체 지향 프로그래밍 언어(OOP, Object Oriented Programming)간에 호환되지 않는 데이터를 맵핑해주는 프로그래밍 패러다임이다. 2. 사용 예 클래스로 스키마(Schema)를 매핑하고, 메소드(Method)로 쿼리(Query)를 작성하여 객체로 이뤄진 테이블을 가져온다. 3. ORM 장점 - SQL문을 사용하지 않고 ..