일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 | 31 |
- oauth
- 코멘토 #코멘토실무PT #실무PT후기 #실무강의 #리액트강의 #웹프로그래밍 #react #웹개발실무
- this
- 모던 자바스크립트
- TypeORM
- AWS
- concurrency limit
- invalid_grant
- 우아한 테크코스
- 우아한테크코스
- Dev-Matching
- NestJS
- bucket4j
- redis
- api 요청 수 제한
- 타입스크립트
- Deep Dive
- 음악 url 파일 다운로드
- 검색
- compateto
- api 비동기처리
- 딥다이브
- 유효시간 설정 url
- 프로그래머스
- 파일 url
- 프론트엔드 과제
- 프리코스
- 프론트엔드
- 스프링부트
- 자바스크립트
- Today
- Total
목록전체 글 (174)
개발 알다가도 모르겠네요
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/rP2Nh/btrsxhIeJMN/sGK2J9aVgrDak87giW878k/img.png)
LIVE로 배우는 실무 PT ㅣ 코멘토 8명 소수정예 라이브로 배우는, 진짜 실무 퍼스널 트레이닝! comento.kr 1.디자인 시스템 세팅 2.Atomic 디자인 뷰를 Atoms(원자) -> Molecules(분자) -> Organisms(유기체) -> Templates -> Pages 순으로 작은 것들을 만들고, 결합해 좀 더 큰 단위의 뷰를 만들어 나가는 디자인 시스템. 3.반응형 웹 4.프로젝트를 진행하면서 알게 된 점 CSS 1. reset.css를 적용해야 html페이지에서 기본적으로 생기는 양 쪽 끝의 공백이 사라진다. 2. absolute를 쓸기 위해서는 부모의 position을 relative로 지정해야 한다. 그래야 절대적인 기준이 있기 때문에 다른 위치로 튀지 않는다. 3.marg..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/ca6rnU/btrsHGsEcwH/bYGirBaCFBqEdXxmQ3NyNk/img.png)
LIVE로 배우는 실무 PT ㅣ 코멘토 8명 소수정예 라이브로 배우는, 진짜 실무 퍼스널 트레이닝! comento.kr 1. Typescript를 쓰는 이유 자바스크립트가 동적타입 이라서 생기는 문제. if ("" == 0) { //참 } if (1< x < 3) { //어떤 x값이던 참 } JS의 동일 연산자는 (==) 인수를 강제로 변환하여 예기치 않은 동작을 유발. const obj = { width: 10, height: 15}; //철자 틀림 NaN const area = obj.width * obj.heigth; 존재하지 않는 프로퍼티의 접근을 허용. 타입스크립트는 프로그램을 실행시키기 전에 type을 기반으로 프로그램의 오류를 찾음. Javascript와 Typescript 차이점 Javas..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/bsdyAl/btrqGryVFeJ/aSYXVhdWs0Q32kApzTrXRk/img.png)
코멘토란? 코멘토는 온라인 취업 멘토링 및 채용서비스이다. 여러 분야의 직무캠프나 실무PT를 신청할 수 있고 특히 자소서 첨삭으로 많이 이용하는 듯하다. 학교와 제휴를 맺어서 이름은 들어본 적이 있었는데 이렇게 실무PT에 참여하는 건 처음이다. LIVE로 배우는 실무 PT ㅣ 코멘토 8명 소수정예 라이브로 배우는, 진짜 실무 퍼스널 트레이닝! comento.kr 내가 수강한 강의 주니어를 위한 React - 실무 프로젝트로 역량 업그레이드 6주 동안 매주 일요일 3시간씩 실시간 수업이 진행된다. 수업 내용을 바탕으로 매주 과제가 제공된다. 매주 월요일마다 1시간의 그룹스터디가 진행된다. 강의를 들으면서 느낀 점 실시간으로 수업이 이루어지다 보니 빠른 피드백이 가능하다. 현직자 분의 멘토링으로 최신 트렌드..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/z1PYY/btrqvyFmgp7/qCr5MWkSlIblcjAZS28ki0/img.png)
컴포넌트의 생명주기 모든 리액트 컴포넌트에는 수명 주기가 존재함. 컴포넌트의 수명은 페이지에 렌더링 되기 전인 준비과정에서 시작, 페이지에서 사라질 때 끝남. Mount DOM이 생성되고 웹 브라우저상에 나타나는 것 componentDidMount: 컴포넌트가 웹 브라우저상에 나타난 후 호출하는 메서드 Update props가 바뀔 때 state가 바뀔 때 부모 컴포넌트가 리렌더링될 때 this.forceUpdate로 강제로 렌더링 트리거할 때 componentDidUpdate: 컴포넌트의 업데이트 작업이 끝난 후 호출하는 메서드 Unmount 컴포넌트를 DOM에서 제거하는 것 componentWillUnmount: 컴포넌트가 웹 브라우저상에서 사라지기 전에 호출하는 메서드 LifeCycle Method..
1.Component Component에는 클래스형과 함수형있음. 리액트가 레고 라면? 컴포넌트는 블록. 웹 사이트의 조각(컴포넌트)을 모아서 웹사이트에 뿌림. HTML을 한 단어로 줄여서 쓸 수 있는 방법 항상 Component는 대문자로 function Modal(){ ←이름 짓고 return ( ←원하는 HTML담고 ) } return() 내부 묶을때 의미없는 쓰기 싫으면 ←fragment 문법 Component로 만들면 좋은 경우 반복 출현하는 HTML 덩어리들 자주 변경되는 HTML UI들 다른 페이지 만들때도 컴포넌트로 만듦. 2.State&Props props는 사용자가 지정하는 값에 의해 달라지는 컴포넌트의 변수 state는 컴포넌트 내부에서 사용되는 변수 이벤트는 state값을 변경하기위..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/btdT5b/btrnBMMqnXB/r8sqbbHhj3OCzDeybQpSUK/img.png)
클래스의 인터페이스를 사용자가 기대하는 다른 인터페이스로 변환하는 패턴 호환성이 없는 인터페이스 때문에 함께 동작할 수 없는 클래스들이 함께 작동하도록 해줍니다. Example public interface Adder { public int plus(int x, int y); } public class MyAdder implements Adder { @Override public int plus(int x, int y) { return x + y; } } public class UseAdder { public int add(Adder adder, int x, int y) { int r = 0; r = adder.plus(x, y); return r; } } public class Main { public..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/zgHrF/btrnBblBlzh/aHS70u3GVJOaqGCrs5DBKK/img.png)
그룹 객체와 단일 객체 사이의 차이를 느끼지 못하도록 객체를 구성하는 패턴 전체-부분의 관계를 가지는 객체들 간의 관계를 정의 할 때 유용합니다. 클라이언트는 전체와 부분을 구분하지 않고 동일한 인터페이스를 사용할 수가 있습니다. Example - 택배 비용 계산하기 택배로 보낼 수 있는 항목을 포함하는 개념(ParcelItem) 생성 “한 Box는 택배로 보낼 수 있는 항목(ParcelItem)을 여러 개 가질 수 있다”는 사실을 표현
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/do8DWv/btrnC30TTxZ/qkjPka5MuH42ULvKkSsiRK/img.png)
추상부와 구현부를 분리하여 각각 독립적으로 변경할 수 있도록 하는 패턴. 전체적인 알고리즘의 코드를 재사용하는데 유용하게 쓰입니다. 전체적으로 동일하면서 부분적으로 상이한 문장을 가지는 메소드의 코드 중복을 최소화할 때 유용합니다. - 추상부(abstraction): high-level function 제공. - 구현부(implementation): low-level function 제공 - 추상부에서 제공하는 기능을 실현하기 위해 구현부로 위임(delegation) Example Remote -> high-level operation | | delegation | TV -> low-level operation
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/DlntT/btrnBblxQ7X/E6cF7iFvy6BJKII9u7c130/img.png)
관련성이 있는 여러 종류의 객체를 일관된 방식으로 생성할 때 유용 Example - 엘리베이터 만들기 Template Method 패턴을 적용 class Motor { public void move(Direction direction) { // 1) 이미 이동 중이면 무시한다. // 2) 만약 문이 열려 있으면 문을 닫는다. // 3) 모터를 구동해서 이동시킨다. 이 부분만 LG, 현대에서 달라짐 // 4) 모터의 상태를 이동중으로 설정한다. } } class Door { public void open() { // 1) 이미 문이 열려있으면 무시한다. // 2) 문을 연다.이 부분만 LG, 현대에서 달라짐 // 3) 문의 상태를 열림으로 설정한다. } } class DirectionLamp { ..