클로저, delete 객체 지향 프로그래밍 vs 절차 지향 프로그래밍 : 객체 지향 프로그래밍은 데이터와 기능을 한 곳에 묶어서 처리한다 : 속성과 메소드가 하나의 '객체'라는 개념에 포함 자바스크립트 내장 타입인 object와는 다르게 클래스라는 이름으로 부른다
어떤 문제를 동일한 구조의 더 작은 문제로 나눠 각각을 해결함으로써 전체를 해결하는 방법어떤 함수가 스스로를 호출하는 것 키워드 : 동일한 구조 + 더 작은 문제 input - output input을 기준으로 1)경우의 수를 나눈다 2)반복되는 동일한 구조의 해결방법
POINT JSON.parse <-> JSON.stringify 네트워크에서 다른 프로그래밍 언어를 사용하는 수신자와 발신자 사이stringify : 메모리 때문에 string(JSON)으로 전송, parse : 객체로 만들어서 사용유의점 1\. 객체를 문자열화하
Graph 자료구조의 그래프는 여러 개의 점들이 선으로 이어져 있는 복잡한 네트워크망과 같은 모습 여러 개의 점들이 서로 복잡하게 연결되어 있는 관계를 표현한 자료구조 직접적인 관계 : 두 점 사이를 이어주는 선이 있다 간접적인 관계 : 몇 개의 점과 선에 걸
1)초기값의 유무로 if, else: 없으면 idx=0일 때만 acc = arr0으로2)acc = iteratee(acc, ele, idx, arr) 📌이후 비동기를 학습하기 위해 필요한 단계
underbar sprint 참고: 다른 함수의 전달인자로 넘겨주는 함수 : 파라미터를 넘겨받는 함수는 callback 함수를 필요에 따라 즉시 실행할 수도 있고 아니면나중에 실행할 수도 있다 1)반복 실행하는 함수 : iteratorex. map(callback)2)
브라우저에서 사용할 수 있는 비동기 흐름은 타이머 혹은 DOM 이벤트와 관련된 상황으로 다소 한정적 Node.js의 경우 많은 API가 비동기로 작성 Node.js는 '로컬 환경에서 자바스크립트를 실행할 수 있는 비동기 이벤트 기반 자바스크립트 런타임'cf.런타임 :
네트워크 요청은 비동기 요청이다 URL로 요청하는 경우가 가장 흔하다: url로 요청할 수 있게 하는 API가 바로 fetch API입니다. 최신 뉴스나 날씨/미세먼지 정보가 바로 동적으로 데이터를 받아와야 하는 정보 많은 웹사이트에서는 해당 정보만 업데이트하기 위해
파일 안에서 console.log 등을 보고 싶을 때 vscode의 터미널에서 파일이름을 실행한다 왼쪽에 breakpoint 설정 디버그 탭 클릭 디버그하기 node.js 등 해당 환경 선택하기 다음 점으로 넘어가기 또는 안으로 들어가는 버튼 선택해서 확인 조사식 탭에
동작 방식 이해 request와 response 구분 응답 메시지 찾아본다 Chrome Network Tab 이해 사용방법 익히고 사용할 수 있다 Self Guided Lessons how the internet works DNS정보를 제공하는 주체 어딘
404 에러 내가 원하는 주소에 아무것도 없다웹에서 사용되는 데이터나 리소스를 http uri로 표현하고 http 프로토콜을 통해 요청과 응답을 정의하는 방식 하나의 규범많은 사람들이 하는 거라서 규범을 지켜야 한다 restful api 네이버 그런 rest api로
Main.jsSearch.js화면
백엔드 node.js를 이용api server 구현express, 라우팅, server-side 디버깅하는 방법 학습 브라우저와의 차이 node.js 환경에서 commonJS, 모듈 등 브라우저에서 찾아볼 수 없는 다소 생소한 개념들 포함 백엔드뿐만 아니라 프론트엔드에
방법1. console방법2. 1)nodemon 설치 : npm -g install nodemonpackage.json의 start: 'nodemon 파일이름'2)postman
최민철 크루님 약력 비전공자삼성전자 임베디드 SW 입사컨설팅, 코드스테이츠 2년차 인하대 등 겸임 교수자료구조란?자료에 대한 구조 data structure자료를 어떻게 저장하고 어떻게 조회하고 써먹을지에 대한 방법들알고리즘이란? how to solve 문제를 해결하는
MERN stack : JS 생태계에서 인기 있는 프레임워크인 MongoDB, Express, React, Node Express.js : Node.js 환경에서 웹 서버 또는 API 서버를 제작하기 위해 사용되는 인기 있는 프레임워크 중요한 에러 : app.use
ModalContainer ModalBackdropModalBtnModalView=> Modal로 export 관전 포인트 중괄호를 이용한 조건부 렌더링 state변수를 이용해 모달 상태 컨트롤styled-components 이용 : 컴포넌트, 안의 태그까지 수식 가능
1.express 사용const express = require('express');const app = express();cf. app.use(): 모든 요청에 대해 적용2.cors 처리const cors = require('cors');app.use(cors());
js에서 제공하는 비동기 간편 처리 JS 내장 Object 정해진 장시간의 기능 수행 후 정상적으로 수행하면 실행, 에러가 생기면 에러 실행 promise의 상태: 기능 수행 중인지 완료했는지 1)promise object를 만들어서 수행 중이면 pending 2)완료
선언형컴포넌트 기반 범용성 단방향 흐름 (상향식 데이터 흐름) 기능을 먼저 생각한 개발 \-> class, function을 이용해 기능 위주의 코드 모음인 컴포넌트를 만들어서 사용 효과 재사용성, 효율성 극대화 하나의 기능만 담당하므로 효율성 하나의 기능만 담당한다는
Achievement Goals상태 관리 라이브러리가 왜 필요한지 이해할 수 있다.Redux (혹은 Flux Pattern)에서 사용하는 Action, Reducer 그리고 Store의 의미와 특징을 이해할 수 있다.Redux의 3가지 원칙이 무엇이며, 주요 개념과 어
리액트는 상태(state), 속성(props)을 이용한 컴포넌트 단위 개발 아키텍쳐 리덕스는 상태 관련 라이브러리 cf.react 관련 라이브러리가 아니라 무관한 상태 관련 라이브러리다 컴포넌트와 상태를 분리해준다 어떻게 상태 변경 로직을 컴포넌트로부터 분리할 수 있는
\-정적 웹사이트 vs 동적 웹사이트\-빌드란?\-정적 웹사이트 형태로 만들어지는 현대의 웹 앱이 왜 빌드 과정을 필요로 하는지 알 수 있다.\-정적 웹사이트 배포, 디버깅\-Landing Page라 불리는 정적 웹사이트에서 사용하는 다양한 프론트엔드 기술들을 스스로
html을 어디서 다루느냐가 핵심적인 차이 client가 일을 하는지 server가 일을 하는지에 따라과거 ssr완성된 html파일을 그대로 전송 그러므로 상호작용을 할 수 없었음 : 댓글, 좋아요 등의 기능 사용하기 어려웠음 url을 클릭하면 다른 페이지로 이동한다
1차 대충 한번 보기 완료 2차 대충 정리 완료 3차 실행 필요 4차 백지 정리 필요 5차 안보고 블로그 정리 필요 6차 section1의 리눅스 내용 복습 필요 끝 사용권한 1)사용 권한과 소유자 이해 : ls -l 2)폴더나 파일의 사용 권한을 변경하는 방법 :
목표 3 Tier Architecture 를 이해한다. : server - client - db 영속성의 개념을 이해하고, 데이터베이스의 필요성을 인지한다. : persistency : db의 필요성(목적) 데이터베이스 종류를 이해한다. 관계형 데이터베이스 vs N
dotenv출처 : https://github.com/motdotla/dotenvDotenv is a zero-dependency module that loads environment variables from a .env file into process.en
: 기능에 따라 디자인한다 팔로우 유저와 팔로워 다대다 follw_follower 정보는 따로 저장해야 하는 것나를 팔로우한 사람은 다른 사람도 팔로우해시태그 다대다 comment, like포스트 - like. commnet : 일대다그때그때 계산하는 거보다 저장하고
출처 : 생활코딩https://opentutorials.org/course/3347/21185공식문서 : npm의 mysqlnode.js가 mysql의 클라이언트로 작동하게 되는 것!!node.js에서 mysql서버에 접속해서 정보를 가져오고 수정하는 방법은?
만들어지게 된 배경 : 코드가 많아지면 많아질수록 1)코드를 파악하기 힘들어지고 2)기능 수정 시 갈아엎어야 함 \-> 즉 유지보수가 힘듬 그러므로 효율적으로 유지보수하기 위해 mvc 패턴 탄생 mvc패턴의 예시구글에 코딩이라고 검색 controller는 모델에게 데이
MVC model view controller 소프트웨어 디자인 패턴 패턴으로 만들어진 라이브러리나 프레임워크가 있다 처리를 기능별로 나누어서 model controller view 일종의 정돈된, 의도된 코드를 할 수 있다는 특징이 있다 코드 가독성을 올려줄 수 있다
mysql과 연결하기홈 > 원하는 connection 생성 > test connection (안되면 mysql 키기) 원하는 db 클릭 > 왼쪽 상단 + > query문 작성 > 아래 result가 뜬다
Obejct Relational Mapping : ORM을 통해 관계형 데이터베이스를 객체로 출력 사용하는 이유 : 인스턴스 = 엔티티를 통해 하나의 레코드를 만드는 것 : 객체의 속성 = 필드의 값으로 들어간다 JOIN 테이블 의 경우 OOP : id에 대한
Obejct Relational Mapping : ORM을 통해 관계형 데이터베이스를 객체로 출력 사용하는 이유 : 인스턴스 = 엔티티를 통해 하나의 레코드를 만드는 것 : 객체의 속성 = 필드의 값으로 들어간다 JOIN 테이블 의 경우 OOP : id에 대한
대표적인 NoSQL 도큐먼트 데이터베이스도큐먼트 데이터베이스: 데이터를 테이블이 아닌 문서처럼 저장하는 데이터베이스 : JSON 유사 형식으로 데이터 문서화: (필드 - 값 형태) \* n = 컬렉션 ✅NoSQL의 장점 및 특징✅MongoDB의 도큐먼트(Document
Http + s : 암호화를 통해 유출을 방지한다 사용하는 방법 \-인증서 : 데이터를 보낸 서버가 정말 서버인지 인증 확인 용도: 서버 도메인 관련 정보가 있어서 인증을 용이하게 한다 인증서와 함께 응답 전송, 클라는 그걸 받아서 인증서의 도메인과 응답에서 확인한 도
목표 1\. 회원 가입 및 로그인, 로그아웃과 같은 기능 2\. 이르 통해 인증(authentication) 이해클라이언트, 서버, 데이터베이스 모두를 다루면서, Full Stack 개발 환경에서의 전체적 흐름 및 작동을 직접 확인📌 암호화, hashing, salt
![](https://images.velog.io/im
2010~: 유니코드로 통일하지만 프로그래밍 언어마다 문자열을 다루는 자료형이 다르다 ex. string, varchar 등 \-> 이를 이해하기 위해 문자열을 다루는 기본적인 방식을 알고 있어야 한다유니코드 협회(Unicode Consortium)가 제정하는 전 세계
node.js의 이벤트 루프를 막으면 안되기 때문에 비동기 작업으로 할 수 있는 일은 최대한 비동기로 한다왼: 멀티 스레드 오 : 이벤트 루프 오로 하면 하나의 작업을 굉장히 오래하게 된다 순서대로 해버리니까 왼처럼 한번에 여러개를 할 수 있도록 하는 것 프로세스를 처
배포 1\. 서버 2\. 클라 3\. db 4\. https(보안 강화)이전에 물리적인 서버실이 있었는데 이제 가상화를 했다 클라우드 얼마나 어느 범주만큼 하는지on-site : 서버실 SaaS : 앱까지 해준다 (들어가면 바로 쓸 수 있다) ex. 넷플릭스 비용
Credentials:쿠키, 인증헤더, TLS client certificates(증명서)를 말한다.다른 도메인간에 쿠키 공유를 허락하는 옵션 default는 false서버간 도메인이 다른 경우 이 옵션을 활성화하지 않으면 로그인되지 않을 수 있다 header의 Acc
컨테이너 기술이 무엇인지, 도커가 왜 필요한지 알 수 있다.컨테이너와 이미지, 레지스트리가 무엇인지 이해할 수 있다.대표적인 레지스트리인 Docker Hub에서 이미지를 검색하고, 사용할 수 있다.한 개의 이미지를 이용해서 컨테이너를 구축할 수 있다.두 개 이상의 이미
ec2랑 연결해서 찾아야 함0번째 에러 log파일을 찾을 수 없음 해결방법 codedeploy-agent 설치https://docs.aws.amazon.com/ko_kr/codedeploy/latest/userguide/codedeploy-agent-opera
잘 사용되지 않는 메서드들 현재 state 또는 props의 변화가 컴포넌트의 출력 결과에 영향을 미치는지 여부를 React가 알 수 있다 기본 동작 : 매 state 변화마다 다시 렌더링을 수행하는 것 새로운 값으로 갱신되어서 렌더링이 발생하기 직전에 호출기본 값은