목록전체 글 (82)
(수근수근)
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/v1fxt/btrdI76BmON/RKb8A2KTjqktI0CkHFTGY0/img.png)
해당 글은 패스트캠퍼스의 김민태의 프론트엔드 아카데미 강의를 수강한 내용을 정리한 것입니다. 타입스크립트란 자바스크립트는 웹언어로써 유일하며 정말 빠르게 성장하고 있습니다. 또한, 자바스크립트는 웹뿐만아니라, 엔진(node.js), 데스크탑 앱에도 사용할 정도로 발전해나가고 있습니다. 하지만 왜 타입스크립트를 사용하는 것일까요? 타입스크립트는 자바스크립트의 모든기능을 기본으로 제공하고 추가적인 기능을 제공합니다. 이로써 자바스크립트와 공생을 지향하는 언어라고 할 수 있습니다. 하지만 자바스크립트가 제공하지 못하는 것이 있습니다. ❗ 데이터에 대한 유형'입니다 타입스크립트는 데이터에 대한 유형을 제공하고 추가적인 기능을 제공하며 자바스크립트의 부족한 것을 채워주는 언어입니다. 타입이 제공되면 뭐가 좋은데?..
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/njRKI/btrc9Mh428Z/Ntkc4b5lBSDWuyreZy8R61/img.png)
Redis(Remote Dictionary server)? 레디스는 NOSQL데이터베이스의 일종으로 비관계형 데이터베이스이다. Redis는 key-value의 형태로 데이터를 저장하며, 메모리기반의 저장방식이라는 것이 큰 특징이다. 메모리 기반의 'key-value' 구조관리 시스템 메모리에 저장하고 조회하기 때문에 read-write가 속도빠름 → MySql보다 10배정도 입력삭제가 빠르다. 스냅샷기능을 제공하여 .rdb파일로 저장하여 해당시점의 데이터를 저장할 수 있다. node.js에 Redis 설치하기 node.js와 redis 설치하기는 되어있다고 가정한다. 커멘드 창에 설치명령어 입력 → npm i redis 2. 모듈 불러오기 코드 작성 const redis = require('redis')..
리액트는 클래스형 컴포넌트에서 많은 기능을 수행했다. 하지만 리액트는 함수형 컴포넌트에서도 클래스형의 컴포넌트의 기능을 지원하기 위해, 리액트 v16.8에서는 Hool이라는 개념이 도입되었다. 기본적인 리액트 내장훅에 대해서 공부해보자! ⭐useState 상태관리를 위한 Hook const [value, setValue] = useState(초기값) ; 코드 상단에서 import로 useState를 불러온다 useState는 한 변수만 사용할 수 있을까요? 당연히 아닙니다... 클래스 상태관리를 해야하는 변수가 하나라면 생각만 해도 너무 힘듭니다! 리액트가 이를 모를리 없죠! 따라서 여러번 사용이 가능합니다! ⭐useEffect useEffect는 리액트 컴포넌트가 렌더링 될 때마다 발생하는 작업입니다...
![](http://i1.daumcdn.net/thumb/C150x150/?fname=https://blog.kakaocdn.net/dn/cvhQ2C/btq8OrJRd6I/e5qWyl6tJqTXNFfzyMD3l1/img.jpg)
HTTPS HTTP Secure로 HTTP Protocol의 암호화된 버전이다. 서버와 클라이언트의 데이터를 전송할 때 암호화를 하여 보안을 유지 HTTPS는 직접 TCP통신을 하지않고 SSL(TLS)을 사용하여 서버와 클라이언트간의 정보를 암호화한다. SSL을 통해 통신상 암호화를 적용하고 인증서를 통해 정단한 페이지를 확인하는 절차를 추가한다. ⇒ 데이터를 암호화하고 사이트를 인증함에 따라서 사이트에 대한 신뢰도를 높일 수 있고, 개인의 민감한 정보를 암호화하여 중간에 탈취가 불가능하므로 모든 것을 온라인으로 진행되는 요즘 필수적이라 할 수 있다. HTTPS 적용여부 확인 URL에 HTTPS확인 및 자물쇠 그림확인 어떻게 HTTPS 적용? 실제로는 인증기관 CA를 통해서 발급받는 것이 안전하다. 하지..
Layout Position 🌱absolute vs relative relative : 원래있는 자리는 유지하면서 그 자리에서 상대거리만큼의 top과 left만큼 옮겨가는 것 absolute : 근접한 부모중에서 기본 static이 아닌 부모의 기준에서 포지션이 일어난다. 🌱 Sticky vs Fixed. Sticky : 박스안에서 변경이 일어난다. 그대로 공간을 유지한다. Fixed 부모와는 상관없이 나와서 position을 유지한다. 뷰포트에서 규정된다 Alinment 속성 margin : auto 블럭레벨의 경우는 한 줄을 자동적으로 채워주는 마진이 들어있다. 브라우저에서 자동적으로 margin을 만들어 준다.(양끝의 margin을 맞춤 수직은 적용이 안된다.) text-aline : center ..
객체지향의 사실과 오해 (저자. 조영호) 이 책을 읽은 이유 내가 이 책을 읽게 된 것은 1분기가 끝나는 3월이 되면서 스스로 다짐을 했다! 그건 바로바로~ 매달 책 한 권을 읽는 것이다. ㅎㅎ... 3월 달 내가 선택한 책은 '객체지향의 사실과 오해'이다. 매달 책을 읽고 평을 글로 작성하는 것은 책 읽는 것에 무조건 포함이다! (왜냐면 그렇게 하지않으면 내가 깊게 생각 안할 것 같아서....노력에 대한 산출물!) 😳 객체지향? 당연한거아냐~? 자바로 프로그래밍을 시작했던 나는 객체라는 개념을 당연하게 받아드렸다. 클래스 객체 차이점만 이해하려고 했지 객체가 생기게 된 이유에 대해서 깊게 생각해본 적이 없었다. 맨날 붕어빵, 기계 ...객체는 상태와 함수를 가지고 있다.... 그 정도인 부끄러운 수준이..