복기 혹은 되새김질

2023년 7월 10일에 시작 된 패스트캠퍼스X야놀자 : 프론트엔드 개발 부트캠프 오늘은 2일차,첫 실시간 온라인 강의.아예 처음 배우는 내용이라 복습할 겸 저장해놓기로 한다.ls : 폴더 내 목록 확인cd (폴더명) : 이동cd.. : 뒤로가기mkdir (폴더명)

~ 오늘은 3일차 ~복기 내용은 이번에도 맨 하단에 있다.(1) 생성 : git branch (branch명)(2) 생성 후 바로 전환 : git switch -c (branch명)(3) 전환 : git switch (branch명)(4) branch 목록 확인 :

~ 오늘은 4일차 ~git flow, github flow, gitlab flowtrunk : 기본적으로 하나의 중심 브랜치로만 관리하는 것\-> 보통 소규모에서 사용5종류의 브랜치 (master, hotfix, release, develop, feature)큰 규모의

~ 오늘은 4일차 ~Chrome V8 JavaScript 엔진으로 빌드 된 JavaScript 런타임여기서 런타임이란, '프로그래밍 언어가 동작하는 환경'개발을 좀 더 효율적으로 할 수 있도록 모듈을 설치하고, 브라우저에서 동작이 되지 않는 모듈을 node.js를 이용

~ 오늘은 6일차 ~Hyper Text Markup Language웹 페이지 표시를 위해 개발된 지배적인 표준 마크업 언어콘텐츠를 삽입할 수 있게 해주는 요소들로 구성된 지극히 간단한 언어웹을 이루는 가장 기초적인 구성 요소 ① tag : 웹 문서를 구성하는 명령어

~오늘은 9일차~ - 목차 1. Button 만들기 2. Merge & Merge Conflict 3. Pull Request 4. Github 자체 기능 활용 (issue, milestone 등) + 복기일기 1. Button 만들기 이 버튼을 (1) ①

~ 오늘은 10일차 ~ - 목차 1. Flexbox 2. Flex-direction 3. Pull Request 4. Github 자체 기능 활용 (issue, milestone 등) + 복기일기 1. Flexbox 요소를 효율적이고 동적으로 배열할 수 있는 1차

~오늘은 11일차~격자 (바둑판과 같은) 형태로 요소들을 배치① gap : 간격을 정의하는 속성, gap: (row-gap) (column-gap);으로도 가능② grid-template-columns / grid-template-rows : 각각 열, 행의 크기 및

~오늘은 12일차~사용자 지정 속성(CSS 변수, 종속 변수)은 CSS를 작성하는 자가 정의하는 개체로, 문서 전반적으로 재사용할 임의의 값을 담는다.전용 표기법을 사용해 정의, var() 함수를 사용해 접근 가능하다.많은 값을 반복적으로 사용할 때 사용 시 한 영역에

22일차!codepenSKY-PEY/embed/dyQwOVo?default-tab=js%2Cresultjs 첫 시간.기존에 온라인 강의로 js 기초를 듣고 있었지만 스탑워치를 만들 때 쓰이는 내용은 아직 알지 못하는 상태라서 바로 만들기엔 부족했다.기초적인 html과

23일차오른쪽의 새로운 TODO추가하기 버튼을 눌러 아래의 분홍색 박스를 추가한다.item이라는 박스에 들어갈 세부 요소를 만든다. 자식 요소를 부모 요소에 넣는다.자세히 뜯어보기editBtnEl라 선언, <button>요소 만들기editBtnEl의 클래스리스트

24일차이벤트 부분 작성addEventListener 정리 후에 함수를 추가했다.저장하는 함수는 처음에 만든 새로운 객체 생성 함수에도 넣어준다.filter사실 이 부분의 해석이 헷갈려서 질문을 해놓은 상태다.t라는 투두리스트의 id가 item.id와 같지않다면 살리는

25일차Class를 이용해 간결하게 객체 생성이 가능하다.새로운 건 이것 뿐이지만, 전반적인 흐름을 읽는게 어려워서 강사님께 질문 후 내일 다시 정리할 생각이다.

26일차시트 만드는 함수시트를 만들어 내보내는 함수완성본은 여기!codepenSKY-PEY/embed/PoxLpRV?default-tab=js아직도 자세히 해석해보라고 하면 버벅 거릴 것 같다.우선 혼자서 투두리스트를 만들어보고 그 다음에 도전해볼 예정.전체의 흐름 파

~ 30일차 ~동기 동작 : 함수나 일정한 코드가 순서대로 실행-완료, 실행-완료되는 것비동기 동작 : 함수나 일정한 코드가 실행 순서와 상관없이 완료되는 것을 말합니다비동기에서 발생하는 에러를 해결하기 위해, 콜백 함수 (Callback Function)를 사용콜백

~43일차~React는 사용자 인터페이스를 만들기 위한 JS 라이브러리인터렉션이 많은 웹 앱 개발에 주로 사용Framework : 앱을 만들기 위해 대부분의 것(Library 포함)을 가지고 있는 것Library : 특정 기능을 모듈화 해놓은 것Framework > L

~44일차~<span style="background-color:const \[value, setValue] = useState("");value : 변수이름, gettersetValue : State를 정하는 함수, setteruseState : value, s

~45일차~실습을 진행하며 나중을 위해 기억하고 싶은 내용만 몇가지 추려봤다.인용구로 작성한 내용은 실습 중 만들어진 코드로, 간단한 설명을 주고 있다.valueAsNumber : value를 숫자로 가져온다. \-> number를 씌워 받아올 수도 있지만 코드를 더욱

~46일차~강의자료(비공개)와 해당 블로그 를 참고해 가볍게 복기 겸 정리를 했습니다.정확하지 않는 표현이나 내용이 있다면 편하게 댓글 부탁드립니다.\*기본적으로 state가 변경될 때마다 렌더링을 하는데, 불필요한 렌더링을 할 수록 웹이나 앱이 느려질 수 있다.처음부

~52일차~JS 코드를 단순화하여 더 쉽게 읽고 디버그 할 수 있도록 한다.코드 유형 검사를 통해 JS 작성 시 개발자가 일반적으로 겪는 버그를 피하는데 도움이 될 수 있다.npm이 설치된 환경을 기반으로 터미널에서 설치를 진행한다.① root 폴더에 build폴더,

~53일차~타입의 이름을 지정하는 방법으로 매우 유사대부분의 경우 자유롭게 선택 가능① Interface : extends으로 확장② Type : Intersection으로 확장① Interface : 선언 병합 가능② Type : 선언 병합 불가속성의 이름은 모르지만

~79일차~Css-in-JS라고 하는 JavaScript 파일 안에서 CSS를 처리할 수 있게 해주는 대표적인 라이브러리https://styled-components.com/docs/basics@latest 없이도 설치가 가능하지만 간혹,npm ERR! Can

~87일차~렌더링에 필요하지 않은 값을 참조할 수 있는 React Hook변수 관리, 특정 DOM을 선택 할 때 사용state를 사용 시 state가 변하면 컴포넌트가 다시 렌더링되지만, ref를 사용하면 렌더링 되지 않는다. (생명주기 동안 ref값은 유지)js에서는

~106일차~todos 앱을 배우며 모르는 부분이 있어 질의응답으로 이해한 부분을 기재한다.type, id를 객체로 받으며 payload에 할당notes가 버라이어티한 string값이기 때문에state.mainNotes = state.mainNotes.map 처럼sta