본문 바로가기

분류 전체보기

(85)
백엔드 심화: 인증과 비동기처리(1)-데이터베이스란(DB) 데이터베이스란?테이터를 통합하여 효율적으로 관리하기 위한 데이터 집합체를 데이터베이스(Database; DB)라고 한다.데이터를 구조화하여 관리함으로서 데이터 중복을 막고 효율적이고 빠른 데이터 연산을 가능하게 한다. 내가 생각하는 데이터베이스의 장점?🔸데이터베이스가 없다면 프론트에서 객체나, 배열에 담아서 저장해야하는데,데이터들이 추가적으로 저장이 될 때마다 웹이 무거워지고, 소스코드를 확인했을 때,어떤 데이터들이 담겨있는지 모두 확인이 가능하여 캡슐화가 쉽지않다.게다가 스토리지를(세션이 만료되긴 하지만)  사용하지 않는다면 새로고침으로 데이터가 날아갈 수도 있고직접 접근하여 데이터의 수정이 가능하므로 무결성이 보장되지 않는다.데이터베이스는 API를 가지고 와서 프론트에서 뿌려주지 않는 이상 바로 눈..
백엔드 기초: Node.js + Express 기본(10)-node.js route().post().get() Server와 Router의 역할Server: Request를 받음Router: Request의 URL에 따라 루트(route)를 정해줌 Node.js의 라우팅(Routing)이란?Request(요청)이 날아왔을 때, 원하는 경로에 따라 적절한 방향으로 경로를 안내해주는 것. URL, method => 호출 콜백함수 ❄️여러개로 나눠놓은 파일을 모듈화하여 app.js로 require하기❗🔸디렉토리구조🔸파일상단 requireRouter() 모듈을 가지고와서 app으로 된 부분을 router로 변경한다.🔸파일하단 module 선언, 모듈화🔸app.js포트번호는 여기서 주고각 파일을 require해 와서app.use('/', require파일 변수명)으로 각각 모듈화 한 파일을 불러준다.app.use안..
백엔드 기초: Node.js + Express 기본(9)-빈 객체 확인, 채널 설계 ❄️유튜브 운영하는것처럼 설계 실습해보기처음에 나는 배열안을 map으로 돌고, 그 안에서 if-else 처리를 해주었다.강의도중 map은 반복문이니 그 안에서 조건문을 처리하려면 비효율적이게 돌아야 해서강사님 말대로 변수를 하나 빼서 넣어주고 그것으로 밖에서 처리하는게 효율적이라는 생각이 들어다시 코드를 수정해보았다. 빈 객체 확인하는 방법 3가지Object.keys()for inlodash: isEmpty문자열도 객체로 처리된다.하지만 constructor를 사용하면 객체가 아니게 된다!https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/constructor Object.prototype.construc..
백엔드 기초: Node.js + Express 기본(8)-HTTP status, 유튜브데모 users 설계 핸들러(handler)란?HTTP request가 날아오면 자동으로 호출되는 메소드❄️노드: 콜백함수, app.HTTPmethod(path, handler)cf. 스프링: 컨트롤러 ❄️과일 REST API 연습하기✨✨예외처리✨✨res.status(404).send() // res와 send 사이에 status(404)가 끼였다.🤣사용하여 통신 에러의 status를 보내줄 수 있다.🔥HTTP status code는 클라이언트와 소통을 정확하게 하기 위함🔥❄️ 2**: 성공200: 조회/수정/삭제 성공201: 등록 성공❄️ 4**: 클라이언트 문제400: 요청한 연산(처리)을 할 때 필요한 데이터(req)가 덜 왔을때404: 찾는 페이지(리소스) 없음(url에 맞는 api 없음)❄️ 5**: 서버 문제..
백엔드 기초: Node.js + Express 기본(7)-method (DELETE), 리펙토링, HTTP status ✨유튜브데모 업그레이드전체조회시 나는 배열안에 키값없이 객체들을 넣어줬었고,그것을 편하게 하기 위해 db를 배열로 만들어 map으로 돌려줬었다.강사님은 객체안에 키:{} 형식으로 넣는것을 보고 다시 수정했다.https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/map Array.prototype.map() - JavaScript | MDNmap() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환합니다.developer.mozilla.org  mdn 사이트를 참고하여 수정했다❗ 물론 Map Object형태에서 forEach로 사용해서 value,index(key..
백엔드 기초: Node.js + Express 기본(6)-POSTMAN, method (POST, GET) POST 사용해보기!❌❌웹 브라우저에서는 POST를 test하지 못 한다❗❌❌ ❄️POST를 사용하는 상황 & 목적회원가입시 => id, password, name, email, contactGET을 이용하여 URL 쿼리스트링 || /:id으로 보낼 수 있지만 개인정보를 오픈해서 보낼 수 없다❗✨POST를 사용하여 body안에 넣어서 안전하게 보내야함❗❗ POSTMAN웹버전 사용하는 것은 반대❗🤣안되는 기능이 너무 많다❗우리가 POST를 테스트하기 위한 프로그램➡️ 여러 방법의 method로 test가 가능하다❗➡️ 내가 포트:1234 GET으로 설정한 화면이 밑에 바로 뜬다 ❗🤩➡️ 🔥웹브라우저에서는 Cannot Get 이 되었던 POST method가 포스트맨에서 실행됐다❗✨✨ POSTMAN으로..
백엔드 기초: Node.js + Express 기본(5)-map에 Object, express 애플리케이션 생성 처음해보기 ✨String만 담던 Map에 Object 넣기! ✨객체를 넣은 Map과 통신해보기!res.json({}) 안에서 스프레드 연산자를 사용하여 json안에 넣어주었다! ✨유튜버 데이터로 한 번 더 실습해보기! 🗝️express 구조웹 프레임워크: 내가 만들고 싶은 웹 서비스를 구현하는데 필요한 모든 일을 틀 안에서 할 수 있는 것  https://expressjs.com/ko/ Express - Node.js web application framework expressjs.com Express 애플리케이션 생성yarn add express-generator -g를 사용해서 설치!express --view=jade명령어를 사용해보기✨다음과 같이 디렉토리들이 생기는데, bin/www와 app.js파일이 제일..
백엔드 기초: Node.js + Express 기본(4)-구조분해할당, 네이밍케이스, map ❄️JavaScript의 데이터형JavaScript는 숫자로 된 문자열이 들어와도 계산을 할 때 알아서 데이터형을 숫자로 바꿔 계산한다.js를 사용하는 입장에선 편리할 수도 있지만,다른 언어들은 정해진 데이터형의 변환이 어렵기때문에,언어의 확장성을 위해 처음부터 데이터형을 맞춰서 코드를 짜는 연습이 필요하다. ❄️req.params는 변수명에 넣어 간결하게 사용을 더 많이 한다! 쿼리스트링으로 JSON 가지고오기! ❄️비구조화.구조분해할당🗝️객체의 비구조화구조분해할당으로 가지고 올 때, 스트링쿼리와 같은 변수명으로 받아와야 값을 받아올 수 있다. 🗝️배열의 비구조화인덱스 순서대로 들어오기 때문에 변수명은 자유지만,내가 사용하고 싶은 변수명에 원하는 값이 있다면, 변수명 위치와 인덱스 위치를 맞춰야 한..