웹 풀 사이클 데브코스

전체조회Map이 key-value 쌍으로 생성되어도, JSON형식으로 바로 브라우저에 보낼수는 없다. 입력정제가 필요하다~ forEach() 자바스크립트 함수`JSON.stringify` 메소드 : app.get("/youtubers", (req, res) => { let youtubers = {}; db.forEach((val, key) => (youtubers[key] = val)); res.json((youtubers));}); for + each " 개선된 for문"배열 + 일반적 사용까지 확대객체(배열)에서 요소를 하나 꺼낸 다음 매개변수로 그 요소를 전달하여 호출하는 콜백함수const arr = [1,2,3,4,5];arr.forEach((val, idx, all)=>console.log..

http 메소드 postex. 회원가입post는 url이 아니고 숨겨서 body에 담아서 전송하게 된다.웹 브라우저에서 확인할 수 없고, Postman에서 테스트를 돌려서 확인할 수 있다. Postman API Platform | Sign Up for FreePostman is an API platform for building and using APIs. Postman simplifies each step of the API lifecycle and streamlines collaboration so you can create better APIs—faster.www.postman.compc에 설치해서 사용하는 것을 권장한다. 웹 버전에서는 불가능한 기능이 많기 때문! Postman여러 메서드(GET,..

string만 담던 MapKey (id)Value (productName)1"notebook" / 10000002"cup" / 130003"chair" / 2100004"diary" / 26000문자열 + 부가 정보들(가격)let db = new Map();let nodebook = { productName: "notebook", price: 1000000,};let cup = { productName: "cup", price: 13000,};let chair = { productName: "chair", price: 210000,};let diary = { productName: "diary", price: 26000,};db.set(1, nodebook);db.set(2, cup);db..

💡parseInt자바스크립트는 숫자와 문자, 자동을 형변환을 해준다. 편리한 점이지만, 어느정도 문제가 생길 가능성이 있다!"숫자" `문자` 숫자 `숫자`parseInt(`변환할 변수(문자상태)`) parseInt() - JavaScript | MDNparseInt() 함수는 문자열 인자를 파싱하여 특정 진수(수의 진법 체계에서 기준이 되는 값)의 정수를 반환합니다.developer.mozilla.org Params , Query Stringapp.get('/:nickname', function(req, res) { const param = req.params res.json({ channel : param.nickname })})링크 채널, 영상, 타임라인 모두 url params 로 처리..

http VS expresshttp : 웹서버처럼 사용할 수 있는 내장 모듈express 안에 http가 포함되어있다. expressFast, unopinionated, minimalist web framework. Latest version: 4.19.2, last published: a month ago. Start using express in your project by running `npm i express`. There are 79273 other projects in the npm registry using express.www.npmjs.comconst express = require('express')const app = express()app.get('/', ..

HTML 메소드HTTP에 담아 보내는 나의 목적 =  HTTP method생성 : POST조회 : GET수정 : PUT(덮어쓰기) / PATCH삭제 : DELETEHEAD, OPTIONS, CONNECT, TRACE : 많이 사용하지 않는다. * PATCH : 일부, 부분 수정. put 보다 조금 까다로운 편! ex) 마이페이지 : 연락처, 이메일, 집주소, 이름 중 `부분 수정` Node.js백엔드에만 사용하는게 아니다!페이팔, 이베이... 결제 시스템에서도 사용한다.+ 리액트, 뷰 등 프론트엔드 프레임워크 기술에서도 사용된다!웹 밖에서도 JavaScript를 사용할 수 있게 하는 플랫폼이 Node.js특징싱글 스레드 : 동작이 계속 밀려들어와도, 혼자서 어떻게든 작동..

백엔드 구조 웹서버 - 웹 어플리케이선 서버 - 데이터베이스 모두 통틀어서 백엔드라고 한다. 웹 브라우저는 클라이언트도 될 수 있고, 프론트 개발분야라고도 할 수 있다. - 웹서버 : 정적 페이지 동적페이지는 직접 처리하지 않고, 웹 어플리케이션 서버로 전달한다. API : Application Programming Interface 운영체제와 응용 프로그램 사이의 통신에 사용되는 언어나 메시지 형식 라이브러리(데이터)에 접근하기 위한 규칙들을 정의한 것 Interface 인터페이스 중간에서 양단의 플랫폼을 중재, 매개체가 되어주는 역할이다. 방법 GUI : 화면 CLI : 글자 입출력 NUI : 인간의 신체, 움직임, 음성, 터치, 홍채 OUI : 현실에 존재하는 모든 사물이 입출력 장치가 될 수 있다..

간단 테니스 쇼핑몰 페이지 제작하면서 직접 동작시켜보자! 백엔드 웹서버, 웹 어플리케이션 서버, 데이터베이스 모두 백엔드 웹서버, 웹 어플리케이션 서버, 데이터베이스 웹서버 : 정적 페이지에 대응. 동작페이지에 대한 처리를 직접하지 않고, 웹 어플리케이션 서버에 전달한다. 정적 페이지 : 화면의 내용/데이터 등의 변동이 없는 페이지 동적 페이지 : 데이터 처리/연산을 통해 화면의 내용, 데이터가 변하는 페이지 웹 어플리케이션 서버 : 동적 페이지를 처리한다. 연산을 위해 데이터베이스와 연결되어있으며 데이터 조회, 수정, 삭체 등 처리를 요청한다. 데이터페이스 : 데이터를 통합해 효율적으로 관리하기 위핸 데이터 집합체 Node.js 자바스크립트가 백엔드에서 동작할 수 있게 지원하는 플랫폼이다. 프로그램을 ..

CSS Cascading Style Sheets 약자, 꾸며주는 언어. 태그별로 하나하나 꾸며준다 - 인라인 inline : HTML 태그 안에 같이 작성한다 - 내부 스타일 시트 : HTML 문서 안에 같이 작성한다 - 외부 스타일 시트 : HTML 문서 밖에 같이 작성하고 연결한다 *HTML 태그 한쌍 또는 닫힌태그 하나를 element 라고 부른다. 인라인 Login ID : PW : 태그 안에 `style = " ~ ; "` 구성으로 삽입한다. 내부 스타일 시트 Login ID : PW : HTML 문서 상단 태그 바로 위에 태그 생성 후 그 안에 작성한다. class이름 `.`, id이름 `#` 으로 css 에서 이름선언한다. class VS id 한개의 class, n 개의 element 한개..