TIL

redux리덕스 프로젝트폴더 생성하기npx create-react-app redux-start dirname npm i redux1.자식컴포넌트 또는 형제컴포넌트 사이의 상태 이동은 부모컴포넌트 --> 형제컴포넌트의 형태가 디폴트값이다. 2.state의 전달은 컴

UI에 동적으로 표현될 데이터 ( 웹화면에서 변하는 데이터 전부 )컴포넌트끼리 상태를 주고받는다.(단방향으로. 부모->자식)상태의 두가지 구분1\. 로컬 : 특정 컴포넌트 안에서만 관리되는 상태 => 하나의 컴포넌트 내에서만 영향을 끼친다.(form데이터 등) 2\.

painless maintenace 속성컴포넌트에 스타일을 상속하는 속성을 찾기때문에 다른 css파일들을 검색하지 않으므로 크기가 커져도 유지보수가 수월하다 두개는 같은 코드이다.리액트에서 상태핸들링함수 만들때 유의사항핸들링함수를 컴포넌트에 전달할때, 3가지 방식으로

오늘배운것 storybook styled component useRef

express.js 로 좀 더 쉽게 서버를 구현하기 미들웨어body-parser 현재는 express에 내장되어있는것으로 요청바디를 읽어올 수 있음 !!node.js = 코드를 실행할 수 있는 하나의 방법. js의 런타임이다. routing = 특정 엔드포인트에 대한

오늘 배운것 매우 기본적인 서버 구현 서버에서 client가 보낸 요청바디 불러오기 express를 이용하여 리팩토링 해보기 등

오늘 배운것

JSON / StirngifyJSON구조는 Tree구조이다. (즉, 재귀함수를 사용할 수 있다!!)JSON.stringify 그리고 JSON.parse를 이용하여 자바스크립트값과 JSON값을 사용한다.JavaScript Object Notation.데이터 교환을 위해

cli로 간단한 리액트앱 실행할 수 있다. npx create-react-app 선언형명시적인 JSX를 사용한다컴포넌트기반하나의 기능 구현을 위해 여러 종류 코드를 묶어둠. 재사용성, 독립성범용성class사용시 className을 사용해야함 class로 사용할시 , J

클래스와 인스턴스 객체지향 프로그래밍클래스와 프로토타입프로토타입 체인 객체지향 프로그래밍은 모델로써의 '청사진'을 생성하여, 그 청사진을 바탕으로 한 객체를 만드는 패턴을 말함. 청사진 만들기 (class만들기)일반함수와 같다. 단, 구분을 위해 대문자 + 심플한 일반

오늘배운것 고차함수 리뷰 메소드 구현해보기 고차함수 고차함수란? filter filter 등 자바스크립트 내장 메소드가 있는데, 고차함수에 해당된다? filter는 배열의 요소들 중 특정 조건을 만족하는 요소들을 걸러낸다. **파라미터로 전달되는 callback

할당이 없는 변수는 let myname; console.log(myname); // undefined숫자문자열boolean여러 타입이 섞인 타입 undefined 는 타입함수는 타입원시 자료형 string, number, boolean, undefined의 의미를 이해

정리 및 느낀점

오늘배운것 상태 끌어올리기 effect hook 상태 끌어올리기

CORS (cross origin resource sharing) mini server 구현해보기 대규모의 웹서브시가 늘어나게 되면서, 외부호출에 대한 니즈가 점점 늘어나게 되었다. 이때 조금더 안전하게 서버간의 교차통신을 하게끔 하기 위한 정책? 서버가 한 orig

fs모듈fetch apievent loop정리 및 느낀점

HTTP는 HTML과 같은 문서를 전송하기 위한 어플리케이션 레이어 프로토콜. 전동적인 클라이언트-서버 모델에서 ct가 양식에 맞춰 요청을 보내면 서버도 양식에 맞춰 응답.무상태성!! 특정항태를 유지하지 않는 특징을 가진다. Requests    /   Response

재귀적 사고 연습하기 factorial로 알아보는 재귀 재귀 알고리즘 문제들어떤 함수가 스스로를 호출하는 것. 주어진 문제를 더 작은 문제로 나눌 수 있는 경우 중첩된 반복문이 많거나 반복문의 중첩횟수를 예측하기 어려운 경우 재귀 함수의 입력값과 출력값을 정의하기 문

비교의 결과는 늘 Boolean두가지 조건을 한번에 적용하기 ( 또는 if문 중첩도 가능)&& (AND)학생이면서 여성일때 '통과'isStudent && isFemale || (OR)학생이거나, 여성일때 '통과'isStudent || isFemale ! (NOT연산

클라이언트-서버 아키텍쳐 프로토콜HTTP, APIssr/ ssrcors2-Tier 아키텍쳐 : 리소스가 존재하는 곳(서버)과 리소스를 사용하는 앱(클라이언트)을 분리시킨 것 빈번한 업데이트가 요구되는 경우, 두 곳을 분리해주어야 함. client : 리소스를 받아 브라

REST APIPOSTMAN 사용법HTTP가 가진 능력을 가장 잘 이용하기 위한 모범사례라고 볼 수 있다. API설계는 서버개발자에게 달려있는데, REST API는 API의 대표적인 아키텍쳐. 웹에서 사용되는 모든 리소스를 http uri로 표현하고, 메소드를 사용해서

vertex 추가하는 메소드 만들기vertex 존재하는지 확인하는 메소드 만들기

자료구조란?StackQueueGraphTreeBinary Tree / Binary Search Tree 추가적인 사항1.Array.prototype.findIndex() 2.fill()여러 데이터들의 묶음을 저장하고, 사용하는 방법을 정의해준것. 선형구조(스택, 큐)

그래프Math.max()에 배열안에 요소를 검사할때, ...스프레드 연산자를 사용해서 풀어주어야 한다.프로퍼티 접근.변수로 접근할때에는 \[]브라켓을 사용해서 접근해야 한다. 그렇지 않으면, undefined가 뜸. 정리 및 느낀점

achievement GOALuser 파일의 소유자. 기본디폴트는 파일을 만든사람이 소유자group 여러 User가 포함될 수 있다.그룹에 속한 모든 user는 파일에 대한 동일한 그룹엑세스 권한을 가짐. ( user들을 group에 추가하여, 파일에 대한 권한을 주면

sql 기본개념mysql설치데이터베이스 관련 명령어 (데이터베이스 생성 등)sql 명령어 basic데이터베이스in-memory( 끄면 데이터 휘발 : 임시저장 ), file I/O('데이터 전체'를 단위로 운용 like 엑셀파일 : 필터링 불가) 이 두가지의 단점을

ct와 연결된 서버 구현해서 데이터 브라우저로 보내주기.MySQL에 접속해서 필요한 데이터베이스를 생성한다. CREATE DATABASE 데이터베이스이름; mysql -u root < server/schema.sql -p -D데이터베이스이름작업해둔 schema.

공식문서 https://sequelize.org/sequelize 설치 npm install --save sequelizesequelize-cli 설치마이그레이션(스키마 변경에 따른 데이터 이주?)을 할 수 있도록 돕는 툴,=>> 데이터를 선택, 준비, 추출

sequalize사용해서 Association 해보기시퀄라이즈로 테이블 생성하기 (명령어)\-> 이때 마이그레이션 파일도 함께 생성됨\-> 마이그레이션 실행하기 (명령어)\-> 이 과정까지 마쳐야 테이블 생성이 완료.\-> 이때 생성된 테이블은 FK가 존재하지 않음 모

http가 ssl을 이용한것이 https그렇다면 ssl이란?디지털인증서. 클라이언트와 서버의 통신을 제3자가 보증해주는 전자화된 문서ct가 요청을 보내면 server가 to ct 인증서 정보를 전달. ct는 인증서가 신뢰할만한 것인지 검증한다. ssl로 얻을 수 있는것

auth 스프린트 구현 쿠키정리 세션정리서버구현1. 로그인페이지 포인트db에서 어떤 정보를 찾아올때 req.body에 보통 저장된다. 1.express-session을 사용하면 request.session 이라는 객체가 생성된다.2.해당하는 객체에 property를 할

AWS에서 제공하는 클라우드 컴퓨터 서비스=> 원격제어가 가능한 가상의 컴퓨터 한대를 빌리는 것 (1대 = 1인스턴스)연결을 마치면 위 사진과 같이 로컬이 아닌 aws에서 제공하는 서버에서 제어가 가능해진다.AMI (amazon machine image) like t

https://www.emailjs.com/docs/sdk/installation/서브프로젝트 메인페이지에 contact를 적용했다. 백엔드 건들지 않고 프론트딴에서만 적용할 수 있는 emailjs 라이브러리를 이용.프론트에서만 메일보내기 해결가능자동응답 메일