데브코스

메모리배열과 객체scope, closer네트워크암호화객체지향 프로토타입모듈쿠키와 세션, 웹 스토리지자료구조& 알고리즘해야할 것들이 생각보다 많아 정신 없이 이틀을 보낸것 같다. 요즘 하루의 시간이 짧게 느껴진다. 시간 분배를 잘해서 학습한 내용을 내 것으로 만드는 시간

📚TIL day2 시간복잡도 상수시간 - 로그시간 - 선형시간 - 선형로그시간 - 이차시간 - 지수시간 - 팩토리얼 시간 Big-O 표기법 : 불필요한 연산을 제거하여 알고리즘분석을 쉽게 하기 위해 사용 Big-O 표기시 상수항은 무시! 가장 큰 외항 외엔 무시!

📚TIL day3 큐(Queue) FIrst In First out이라는 개념을 가진 선형 자료구조 DeQueue - 요소를 빼는 곳, EnQueue - 요소를 넣는 곳, Front - 큐의 맨 앞, Rear - 큐의 맨 뒤 션형큐(Linear Queue) : Arr

방향 그래프이며 정점을 가리키는 간선이 하나밖에 없는 구조root - 가장 상위, node - 각 정점, leaf node - 자식이 없는 정점, level - 루트로 부터의 깊이 값, degree - 한 정점에서 뻗치는 간선 횟수하나의 부모 정점만을 갖기 때문에 정점

정렬되어 있는 요소들을 반 씩 제외하며 찾는 알고리즘으로 O(log n)만큼의 시간 복잡도가 소요됨반드시 정렬되어 있어야 하며 배열과 이진트리를 이용하여 구현 가능이진 탐색 트리 : 이진 탐색을 위한 이진트리이며 루트보다 작은 값은 왼쪽, 큰 값은 오른쪽에 모여있음이진

DOM은 트리구조로 이루어짐 : 문서노드 - 요소노드 - 속성노드 - 텍스트노드DOM Tree는 preOrder로 순회DOM 선택 : getElementById, getElementByClassName, getElementByTagName, querySelector,

이터러블 : 이터레이터를 리턴하며 Symbol.iterator를 값으로 가진 값이터레이터 : {value, done} 객체를 리턴하는 next()라는 메서드를 가진 값이터러블/이터레이터 프로토콜 : 이터러블 for ...of, 전개 연산자 등과 함게 동작하도록한 규약J

제때 계산법, 느긋한 평가제너레이터/ 이터레이터 프로토콜을 기반으로 구현지연 평가 : 가장 필요한 순간까지 평가를 미루다 필요한 순간이 되면 해당 코드를 평가하여 값을 만듦엄격한 계산에 비해 효율성이 좋음설정한 길이의 배열 또는 이터레이터를 만드는 함수값을 원하는 길이

웹을 사용하다 보면 페이지를 새로고침하거나 브라우저를 다시 실행시키는 경우 데이터가 사라진 경우를 경험해봤을 것이다. 이 부분을 http 프로토콜의 특징 때문이다. 📍HTTP 프로토콜 HTTP(Hypertext Transfer Protocol)는 인터넷상에서 데이터를

📚TIL day8 지연성(Lazy Evaluation) 제때 계산법, 느긋한 평가 제너레이터/ 이터레이터 프로토콜을 기반으로 구현 지연 평가 : 가장 필요한 순간까지 평가를 미루다 필요한 순간이 되면 해당 코드를 평가하여 값을 만듦 엄격한 계산에 비해 효율성이 좋음

Promise는 비동기 상황을 일급 값으로 다룬다는 점이 callback과 가장 큰 차이callback함수는 실행 이후 사용이 불가능한데 Promise는 then을 통해 추가적으로 사용 가능Promise 값으로 활용하기모나드 : 함수를 안전하게 합성하기 위한 개념Pro

then 매서드를 통해 결과를 꺼냈을 때의 값이 반드시 Promise는 아님Promise가 여러번 실행할 때 아무리 깊은 Promise라도 가장 안쪽에 있는 값을 꺼냄Promise가 중첩적으로 실행되고 있어도 단 한번의 then을 통해 실행할 수 있음위 말은 Promi

📚TIL day9 async/await javascript에서 비동기 상황을 보다 동기적인 코드로 다루기 위한 방법으로 보다 쉽게 비동기 상황 제어 가능 async/await 기본적인 사용법 🌊하루를 마치며 드디어 길고 긴 9일차 강의가 끝났다. 함수형 프로그

📚TIL day9 Promise.then의 중요성 then 매서드를 통해 결과를 꺼냈을 때의 값이 반드시 Promise는 아님 Promise가 여러번 실행할 때 아무리 깊은 Promise라도 가장 안쪽에 있는 값을 꺼냄 Promise가 중첩적으로 실행되고 있어도 단

오늘은 지금까지 배운 함수들을 더 응용해서 사용하는 과정을 배웠다. 처음에는 낯설었던 함수형 프로그래밍도 자주 봐서 그런지 익숙하고 어느정도 이해도 따라왔다. 아직도 직접 하라고 하면 어렵겠지만 ..! 수업 중에서 가장 기억에 남는 부분은 객체를 이터러블로 다루는 부

컴퓨터가 수행할 명령들을 순서대로 써 놓은 것어떻게 구현하는지를 디테일하게 기술명령형은 순서에 의존하기 때문에 순서가 꼬일 수 있어 코드 추가가 어려움무엇을 나타내야 하는지를 기술대표적인 선언형 : HTML - 무엇을 나타내야하는지를 쓰면 브라우저가 알아서 생성해 줌명

남은 10일차 강의와 14일차 강의를 모두 들었다! 매우 고됐던 함수형 프로그래밍 강의가 끝났다는 것에 행복했다..! 14일차는 module과 promise에 관련된 강의였다. module에 대해서 배웠는데 이 부분은 몰랐던 부분들이어서 생소했던 개념이지만 어렵지 않

비동기 http 요청을 쓰기 편하게 해주는 APIXMLHTTPRequest를 대체Promise 기반으로 동작IE, 옛날 버전의 브라우저는 지원하지 않음fetch의 기본 응답 결과는 Response객체Response객체를 얻은 후 JSON으로 또는 text로 변경하는 등

우리가 사용하는 네트워크는 어떻게 통신하여 화면을 출력해주는 것일까? 네트워크 통신을 통해 데이터를 전송하는 일련의 과정들을 7단계로 나누어 놓은 것을 'OSI 7계층'이라고 한다. 📍OSI(Open System Interconnection) 7계층 이름을 해석한

오늘 서버와 클라이언트 사이에서 각각 수행하는 역할의 변화와 함께 더 효율적인 웹 페이지를 띄우는 위한 방식의 변화들을 공부했다. 언젠가 개발자 도구를 통해 html파일을 들여다봤을 때 html내용이 거의 없던 것에 의아했던 기억이 있었다. 오늘 강의를 통해 그 페이

📚TIL week3 Mission this.state 컴포넌트 내에서 별도의 상태가 필요한 경우 사용 this.state는 초기값 설정이 필수 React.js의 경우엔 값을 변경할 때 state를 직접 조작하지 않고 setState 메소드 이용해야함 state 값을

📚TIL week3 Mission try-catch 코드블럭을 표시하고 예외가 발생할 경우 응답을 지정함 에러로 인해 스크립트가 중단되는 것을 방지하며 콘솔에 에러 출력 런타임 에러에만 동작하며 문법적 오류에는 동작하지 않음 try-catch는 동기적으로 동작 thr

회고에 들어갈 내용은 뭐가 있을까? 내가 이번주 하고자 했던 것📜🌟⭐🔥 내가 이번주 완료한 것 나를 칭찬해보기: 어떤 걸 잘했지? 내가 뭘 이뤘지? 난 멋져멋져 프롱이야! 아쉬웠던 점 짚어보기: 비난하지 않고, 앞으로 개

📚TIL Day 17 Element.closest() 선택한 Element로부터 부모 요소 단위로 출발해 인자로 들어간 선택자와 동일한 선택자를 찾음 가장 가깝게 조건에 만족한 부모 요소가 반환 조건에 만족한 요소가 없으면 null 반환 낙관적 업데이트 서버에 요청

📚TIL Day 17 디바운스 dispatchEvent 자동 저장 편집기 실습 🌊하루를 마치며

📚TIL day16 fetch API - Product 실습 day17 To do App 🌊하루를 마치며 오늘은 fetch API를 사용해서 Product

📚TIL day11 Javascipt의 특징 : new 생성자 javascript는 함수를 실행할 시 new 키워드를 통해서 실행 new 키워드를 붙이면 Cat 함수 내의 this는 윈도우가 아닌 new를 통해 실행된 Cat 함수의 새로운 객체를 가르킴 new 키워

요소를 수평정렬 하기 위해 float 속성 사용float를 적용한 마지막 요소의 다음 요소에 clear를 통해 해제해줘야 레이아웃이 꼬이지 않음float 해제법 : 가상클레스를 만들어 부모요소에 클레스 추가float를 해제하는 부모요소 내부에는 float를 사용하는 요

📚TIL day26 Project Depoly history API 기반의 SPA를 배포하기 위해선 404에러를 처리할 수 있는 옵션이 필요 클라우드 서비스 : EC2, GCP, Azure, cafe24 ... 서비스마다 배포 원리는 같지만 과정들에 대한 추상화가 다

📚TIL day27 무한스크롤 일반적으로 모바일에서 사용하며 컨텐츠를 페이징하는 기법 중 하나 구현방식1 : window scroll 이벤트를 통해 스크롤링이 일어남 구현방식2 : Intersection observer 방식 푸터에 접근하지 못한다는 단점이 있음 쓰로

코드를 작성하기 전에 어떤 컴포넌트를 만들고 조합할지 정리해보기최대한 의존성 없게 컴포넌트 구성하기상태값은 상위 컴포넌트인 App.js가 가지고 있으며 하위 컴포넌트들은 App.js에서 보낸 상태 값에 따라 컴포넌트 변화고양이 사진첩 실습을 했다! 실습을 하면서 브레드

드디어 바닐라 자바스크립트 주간이 끝났다! 지금까지 배운 파트 중에 가장 재밌는 파트였다. 물론 프로젝트 주간에는 컴포넌트와 상태관리를 이해하지 못해서 괴로웠지만 그만큼 많은 것들을 배울 수 있던 시간이었다. 이 주간동안 가장 기억에 남는 점은 api사용을 배운 부분

사진 검색기 실습을 했다! 검색했을 때 검색어를 추천해주는 API를 사용해서 추천 검색어를 보여주는 기능을 구현했다. 사용하던 것들을 하나하나 만들어가는 즐거움이 있다. 그리고 검색어 추천 API에서 1주차에 배웠던 트리를 사용한 검색어 추천기능을 떠올렸다. 배운 것

repeat minmaxgrid-row/columnsfit-contentfraction(fr)min/max-contentword-breakauto-fill다시 CSS 강의 주간으로 돌아왔다 ㅎㅎ CSS를 제대로 공부한 적 없기 때문에 배우는 모든 것들이 새로웠다! 함수

📚TIL day31 Transform 3D transform-origin : transform이라는 속성을 통해서 변환될 때의 기준점 설정 transform-duration : 전환효과를 지속하는 시간 설정 rotateX/ rotateY : x축, y축을 기준으로 회

개발을 하면서 CORS 에러를 접해본 경험이 있을 것이다. 이 에러는 CORS 정책을 위반할 때 발생 하는 에러로 서버쪽에서 발생한 문제이다. 우선 SOP에 대해서 사전에 알고 CORS를 얘기하는 것이 좋다. 정확하게 하는 일을 알아보기 위해 URL 구조를 파악할

스타일을 정의해서 필요한 곳에 재활용 할 수 있음@mixin : 이름을 지정 후 브라켓 내부에 재활용할 내용을 입력@include : 정해놓은 스타일을 가져와서 사용할 수 있음변수와 기본값의 사용삼항 연산자 : if(condition, true, false)mixin

content(data) : 소괄호로 데이터를 전달하여 using을 통해서 받아 styleblock에서 사용 가능SCSS와 SASS의 차이 : 대부분 중괄호와 세미콜론의 차이이지만 SASS는 @mixin을 =으로 @include을 +으로 사용@extend : 작성해놓은

vue.js는 html구조를 데이터 옵션을 통해서 연결할 수 있음반응형 데이터, 반응성 : 데이터가 변경될 때 반응해서 연결되어있는 화면도 같이 바뀜createApp : vue어플리케이션을 생성할 때 사용하는 매소드mount : 어플리케이션과 html요소를 연결하기 위

📚TIL day33 Computed 데이터를 조작할 때 표현식이나 methods를 사용할 경우 중복실행될 때 이미 결과값을 알고 있음에도 불구하고 여러번 계산해야하기 때문에 효율성이 떨어짐 computed: 캐싱기능이 있어 첫번째 출력시 계산된 데이터를 캐싱했다 이후

📚TIL day34 list rendering 상태유지 : 데이터를 변경했을 때 변경된 데이터를 전부 다 DOM에 반영하여 변경하는 것이 아닌 최적화 과정을 거침 단방향 데이터 바인딩 : 한쪽 방향에서만 데이터가 연결되며 데이터를 가져와서 출력하는 것만 가능 양방향

오늘 webpack강의를 들었다! webpack의 기본 사용법이 parcel에 비해서 까다로워서 공부하는 것이 쉽지 않았다ㅠㅠ 그래도 필요한 기능을 파악하고 하나씩 설치해나가면 굉장히 편리하게 원하는 기능 옵션을 설정하여 사용할 수 있겠다는 생각이 들었다! 지난주 c

📚TIL day37 $translate app.config.globalProperties.$http = () => {} this.$http 통해 접근할 수 있음 $는 전역화된 기능에 붙어져있기 때문에 대부분 붙여서 사용하지만 생략도 가능 Plugin 만들기 mixin

데이터를 전달하는 방식이 점점 확장되고 있다는 생각이 들었다. props에서 provide-inject, store까지 다양한 방식의 데이터 전달이 있다는 것을 알게 됐다. 데이터를 전달하는 방식을 잘 공부하고 차이점을 파악해서 내가 필요할 때 적합한 기능을 사용하도

📚TIL day38 Vuex Store store는 전혀 관련 없는 컴포넌트들 사이에서도 데이터를 활용할 수 있기 때문에 유용 상태관리 패턴 : state(중앙집중화로 관리하는 데이터), view(화면에 보여지는 내용), action(반응성 데이터들을 동작) crea

기본적인 도메인주소로만 요청이 들어가기 때문에 다른페이지들에선 요청이 보내지지 않음기타 특별한 처리 없이도 바로 페이지를 구분해서 서비스를 만들 수 있음하나의 도메인을 사용해서 요청만 처리하기 때문에 검색 최적화의 단점이 있음해시모드에선 새로고침시 서버에 전송되는 요청

📚TIL day39 React View만 관리하는 라이브러리로 다른 부분은 책임지지 않음 react는 컴포넌트의 조합으로 View를 구성하기 때문에 컴포넌트는 react의 가장 중요한 요소 가상돔을 사용하여 필요한 부분만 한번에 렌더링하기 때문에 최적화 없이 빠른 성

함수, class를 사용하여 컴포넌트 생성props : 함수 파라미터로 데이터를 주고 받을 수 있음defaultProps : 값을 넘기지 않았을 경우를 대비해 defaultProps를 통해 default 값을 지정해 놓을 수 있음propTypes : 넘겨진 값의 타입을

사용자 정의 훅 : 기존 훅을 조합해서 생성자주 사용되는 사용자 로직을 사용자 정의 훅으로 정의하고 사용중복 코드를 제거하며 편하게 사용할 수 있음ui 컴포넌트를 모아 문서화하고 보여주는 오픈소스 툴컴포넌트를 storybook에 등록시켜 놓으면 어떤 컴포넌트가 있는지

React.createElement : html 태그 만들기ReactDOM : 리액트에서 어떤식으로 컴포넌트를 만들지 웹 화면에 실제로 구현하는 역할(렌더링 역할)state : 컴포넌트의 강점 중 하나로 상태는 바뀔 여지가 있는 부분을 설정JSX : Javascript