Today I learned

오늘부터 본캠프가 시작되었고 시작하자마자 팀미니프로젝트가 시작됐다.<span style="background-color:- 팀프로젝트 역할‘웹개발 종합반 강의’ 4주차 다시 복습자바스크립트 반복문에 대해 알아보기였는데... 결국 다하진 못했다..오전에 GIT 협업

오늘은 일단 팀프로젝트를 엄청 뿌시기로 마음먹었다!!!<span style="background-color:- <팀프로젝트> 서버 연결하기, 모달창만들기‘웹개발 종합반 강의’ 4주차 다시 복습반복문에 대해 알아보기오늘 한 새벽 1시까지 git이랑 싸우고 겨우

<span style="background-color:- <팀프로젝트> css 보강하기2년 전 썼던 낡은 코드라 지금도 쓰는지는 모르겠지만..저렇게 텍스트들이 이미지 위로 올라가 정렬이 안맞는 모습이였다..그래서 검색해보니 요런게 있었다.vertical-al

<span style="background-color:- 팀프로젝트 역할어제 새벽 한 2시까지 공부하다가 팀원분들이랑 다같이 일단 자자!! 해서 바로 잠자리에 들었다.새벽 2시까지 댓글부분 만들기 성공하신 팀원분 코드 분석하다가 잤는데 덕분에 오늘 아침에 일단 d

<span style="background-color:- ‘혼공스’ Ch.04 반복문회고록 작성오늘이 팀 프로젝트 마지막날이여서 오전에는 오랜만에 '혼자 공부하는 자바 스크립트' 책을 펼쳤다.ch 04. 반복문 부분을 공부했다.배열 요소를 하나하나 꺼내서 특정 문

<span style="background-color:- ‘혼공스’ Ch.05 함수하루의 15분씩 '모던 자바스크립트' 책을 읽는데 오늘은 다음 내용을 알게 되었다!!변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징을 변수 호이스팅

<span style="background-color:- ‘혼공스’ Ch.05 함수월요일에 쓰는 일요일 TIL일요일에는 약속이 있었어서 집에 돌아와 잠깐이지만 함수 공부를 했다.배열을 전개해서 함수의 매개변수로 전달해줌.함수 이름(...배열)기본 매개변수매개변수에

<span style="background-color:- JavaScript 문법 종합반 1주차\-Infinity는 처음봤다...concat을 이용해서 프로그래머스 '문자열 섞기'를 풀어 보았다!!<문제>길이가 같은 두 문자열 str1과 str2가 주어집니다

오늘의 study 목표!!! JavaScript 문법 종합반 2주차 강의를 듣다가 그동안 모르고 있던 내용정리!! // ES6 //2015년도 이전 => var // (1) es6 => let(변수), const(상수) // (2) arrow function /

오늘의 study 목표!!!JavaScript 문법 종합반 3주차오늘 들은 강의는 특히 더 어려웠던거 같다..왠만해서 TIL에 강의 정리가 아닌 몰랐던 부분을 깨달은걸 쓰려고 했는데 이번주차는 그냥 몽땅 모르기에...😭 그래서 복습겸 정리를 해보려한다.기본형Numbe

오늘은 지금까지 배웠던것 중 제일 어려웠던 this를 정리하면서 복습해보려 한다.오늘의 study!!!JavaScript 문법 종합반 3주차 (this)이 말을 this를 bind한다(=묶는다) 라고도 한다.this는 함수를 호출할 때 결정된다.전역공간에서의 this는

오늘도 4주차 콜백함수를 정리하면서 복습해보려합니다.비동기 작업의 동기적 표현.. 저만 이해 안되는건가요..?? Promise 저만 어려워요..??오늘의 study 목표!!!JavaScript 문법 종합반 3주차다른 코드의 인자로 넘겨주는 함수콜백 함수를 넘겨받은 코드

개인과제가 발제되었다.. 주제는 영화 검색 사이트 만들기!!오늘의 목표개인과제 와이어 프레임 만들기개인과제 html, css 진행하기<필수요건>❔ TMDB에서 받아온 데이터를 브라우저 화면에 카드 형태의 데이터로 보여줍니다.❔ 카드에는 title(제목), over

오늘의 개인과제 진행상황을 적어보려합니다!!오늘의 목표바닐라 자바스크립트만써서 코드 짜기TMDB에서 받아온 데이터를 브라우저 화면에 카드 형태의 데이터로 보여주기카드 클릭 시에 클릭한 영화 id 를 나타내는 alert 창 띄우기영화 검색기능 구현하기일단 TMDB에서 받

개인과제를 마치며...개인과제를 시작하는 마음가짐처음에는 막막해서 잠도 못자고 어떻게하면 좋을까... 이랬지만 이왕 하는김에 제대로 해보고 싶어 과제 노션도 만들고 간략하지만 와이어 프레임도 만들며 천천히 시작해보았습니다.개인과제를 진행하면서 느낀 점!!갈 길이 구만리

Document(HTML 파일)를 Javascript가 알아먹을 수 있는 Object 형태로 Modeling 한 것.API는 다른 시스템에서 제공하는 기능을 사용할 수 있도록 도와주는 중간자 역할.브라우저의 경우, 기본적으로 DOM과 관련된 API를 제공함으로써 브라우

자바스크립트 30문 풀다가 모르겠는 내용 정리!!오늘의 study 목표!!!팀과제 진행자바스크립트 예제 30문메서드는 출처 객체들의 모든 열거 가능한 자체 속성을 복사해 대상 객체에 붙여넣습니다. 그 후 대상 객체를 반환합니다.const obj = { a: 1 };co

오늘은 이전 팀프로젝트를 하면서 유효성 검사부분 중 피드백으로 받은 정규표현식 비밀번호에 대해 알아보고자 만들어봤다html자바스크립트정규식이라는걸 오늘 처음알았는데 뭔가 무궁무진해보였다..근데 알아두면 확실히 나중에 더 활용하기 좋을거 같기 때문에 팀과제가 끝나면 더

개인과제가 마무리되자마자 팀과제가 시작되었다.팀과제 주제는 '팀원분들의 개인과제 결과물 중 하나를 대표로 선택해 바닐라 JS로 온전히 결과물을 만들기'였다.필수 요구사항TMDB 또는 영화진흥위원회 오픈 API 이용(택 1 또는 중복 사용) 영화정보 상세 페이지 구

오늘부터 리액트 강의가 시작되었다. 생전 처음 배워보는 내용이기에 걱정 반 설렘 반으로 강의를 들었는데 아직까지는 자바스크립트보다는 이해가 잘되는 편이다... 아직 강의를 반밖에 안들었지만..😂강의를 계속 듣다가 또 까먹을 수 있기 때문에 오늘 TIL에 정리를 해보려

강의 듣다보니 html문법?과 리액트 문법이 섞여 내 머릿속은 아수라장이 되었다..강의를 계속 듣다보면 문제점이 앞에 들었던 강의 내용을 까맣게 잊어먹는다는거다ㅠㅠㅠㅠ그래서 오늘도 정리해보는 리액트 입문 강의 내용!!오늘의 study 목표!!!리액트 입문 주차 강의 완

컴포넌트 간의 정보 교류 방법부모 컴포넌트가 자식 컴포넌트에게 물려준 데이터.props는 반드시 위에서 아래 방향으로 흐른다.부모 → 자식 방향으로만 흐른다(단방향)props는 반드시 읽기 전용으로 취급하며, 변경하지 않는다.props란 결국 부모 컴포넌트가 자식에게

리액트 입문주차 복습 겸 정리!!!컴포넌트 내부에서 바뀔 수 있는 값을 의미.바뀌어야 하는 이유. UI(엘리먼트)로의 반영을 위해.State를 만들 때는 useState()를 사용한다.State를 변경할 때는 setValue(바꾸고 싶은 값)를 사용한다.불변성이란 메모

목표를 아래와 같이 정했지만 결국 1-10까지밖에 듣지 못했다... React.memo부터 망해버렸다... > 오늘의 목표!! [ ] 리액트 숙련주차 강의 1-11까지 듣기 [x] 자바스크립트 30문제 오답 부분 정리 [ ] 리액트 입문 과제 코드리뷰 강의 듣기

그동안 적지 못했던 리액트 훅에 대해 정리를 해보려 한다.훅은 함수형 컴포넌트에서 상태 및 다른 React 기능을 더 간결하고 표현적으로 다룰 수 있는 방법을 제공가장 기본적인 hook, 함수 컴포넌트에서 가변적인 상태를 가지게 해준다.원래는 useState 라는 함수

React Hook 두 번째 이야기 🍎 React Hooks - 최적화 리렌더링이 빈번하게 일어남 (비용발생) → 최적화(Optimization) 불필요한 렌더링이 발생하지 않도록 최적화하는 대표적인 방법 memo(React.memo) : 컴포넌트를 캐싱 use

🍎 모던 자바스크립트 Deep Dive 매일 책 15분동안 읽고 새로 깨달은 부분 정리 🌳 08장 제어문 - 8.3 반복문 8.3.1 for 문 102p for 문의 변수 선언문, 조건식, 증감식은 모두 옵션이므로 반드시 사용할 필요는 없다. 단, 어떤 식도 선언

오늘은 팀프로젝트 마감일이면서 발표일이였다.내가 우리팀 발표자였는데 굉장히 부끄러웠고 아쉬움이 많은 발표였다고 한다......다음은 우리팀원들과 함께 작성한 KPT 회고록 내용이다.한 주의 흐름한 일프로젝트 명 : Stylegacy필수 작업 : 회원가입/로그인, 카카오

🍎 모던 자바스크립트 Deep Dive 매일 책 15분동안 읽고 새로 깨달은 부분 정리 🌳 08장 제어문 - 8.5 continue 문 continue 문은 반복문의 코드 블록 실행을 현 지점에서 중단하고 반복문의 증감식으로 실행흐름을 이동시킨다. break 문처

매일 책 15분동안 읽고 새로 깨달은 부분 정리개발자의 의도에 따라 명시적으로 타입을 변경하는 방법\-표준 빌트인 생성자 함수(String, Number, Boolean)를 new 연산자 없이 호출하는 방법\-빌트인 메서드를 사용하는 방법\-암묵적 타입 변환을 이용하는

동기(synchronous)적 방식이란? 현재 실행중인 코드가 끝나야 다음 코드를 실행하는 방식 비동기(asynchronous)적 방식이란? 실행중인 코드의 완료 여부와 무관하게 즉시 다음 코드로 넘어가는 방식

REpresentational State Transfer의 약자로서, 어떤 자원에 대해 CRUD를 진행할 수 있게 HTTP **Method**(GET, POST, PUT, DELETE)를 사용하여 요청을 보내는 것. 이 때, 요청을 위한 자원은 특정한 형태로 표현된다.

JSON이란? JavaScript Object Notation 자바스크립트 객체 문법에 토대를 둔, 문자 기반의 데이터 교환 형식

코드는 더 적게, 리덕스를 더 편하게 쓰기 위한 기능들을 흡수해서 만든 것. 리덕스를 사용하기 위해 작성했던 ducks 패턴의 요소들이 전체적인 코드의 양을 늘림 → 리덕스 툴킷을 통해 어느정도 자동화.

아주 간단한 DB와 API 서버를 생성해주는 패키지. 사용하는 이유: Backend에서 실제 DB와 API Server가 구축될 때까지 Frontend 개발에 임시적으로 사용할 mock data를 생성하기 위함.

Flux 패턴 Flux 패턴은 소프트웨어 애플리케이션의 상태 관리와 데이터 흐름을 다루는 디자인 패턴 중 하나이다.

Axios HTTP 클라이언트 라이브러리 node.js와 브라우저를 위한 Promise 기반 http 클라이언트 → http를 이용해서 서버와 통신하기 위해 사용하는 패키지

리덕스에서 dispatch를 하면 action 이 리듀서로 전달이 되고, 리듀서는 새로운 state를 반환한다. → 미들웨어를 사용하면 이 과정 사이에 우리가 하고 싶은 작업들을 넣어서 할 수 있다. 리덕스 미들웨어를 사용하는 이유 : 서버와의 통신

리액트 쿼리(React Query)는 리액트 애플리케이션 데이터 관리를 위한 상태 관리 라이브러리입니다. 리애트 쿼리는 API 호출, 상태 캐싱, 데이터 업데이트 및 동기화, 오류처리 등을 처리하는 간편하고 직관적인 방식을 제공합니다.

Throttling & Debouncing 이란? 짧은 시간 간격으로 연속해서 이벤트가 발생했을 때 과도한 이벤트 핸들러 호출을 방지하는 기법 (ex. 인스타그램 좋아요 버튼)