Act99 기술블로그

먼저 노드 버전을 14버전 이상인지 확인한다. 다음 16버전 이상이면 이런 에러가 발생할 수 있다. please remove any global installs with one of the following commands 이는 create-react-app 을 4.0.3 을 사용할 때 발생한다. 먼저, npx clear-npx-cache 를 통해 5.0.0 이상을 맞춰주기 위한 작업을 한다. 그럼 잘 된다.

*자바스크립트에서 유사배열과 배열의 차이는 무엇인가? 또한 유사배열의 각 요소를 수정하고 싶다면 어떤 과정을 거쳐야 하는가? 유사배열의 한 예시는 HTMLCollection Array 가 있다. 유사배열은 Array의 내장함수를 바로 사용할 수 없다. 때문에 배열의 프로토타입에서 forEach 등의 내장함수 메서드를 빌려오는 방법이 있다. 그것은 바로 call 과 apply 이다. 가장 흔하게 사용하는 것은 Array.from이 있다. let nodes = document.querySelectorAll('div'); // call 사용 Array.prototype.forEach.call(nodes, (el) => {console.log(el)}) // Array from 사용 Array.from(node..

Set const array_num01 = [0, 1, 2, 3]; const array_num02 = [3, 4, 5]; const merge = [...new Set([...array_num01, ...array_num02])]; console.log(merge); // 0,1,2,3,4,5 굳이 합친 값을 let set = new Set(합친값) 형태로 안해도 되고 이런 방법을 사용할 수 있다. Array.from // 배열화 하자! const my_name = "jooseok"; const my_name_array = Array.from(my_name); console.log(my_name_array); // 길이가 문자열과 같고, 0부터 4까지 숫자를 요소로 갖는 배열 const text_arr..

먼저 결과물을 이렇다. 캘린더를 누를 때 상태값을 유지시키고, 고양이 버튼을 클릭하면 글쓰기 모달페이지로 넘어간다. 글을 저장시키면 파이어베이스 파이어스토어에 저장되며, db 구조는 해당 날짜와 다이어리에 적은 일기, 별점 데이터이다. collection의 doc은 다이어리 날짜로 구성되며, 같은 doc이 있을 시, 글쓰기에서 중복방지 기능으로 저장이 안되게끔 만든다. 그리고 해당 날짜의 일주일 전 데이터는 우측 하단에 리스트 형태로 나타나며, 이 리스트를 클릭하면 해당 일기를 볼 수 있다. 마지막 수정해야하는 사항은 일기가 있을 때 글쓰기 버튼을 누르면 update 형태로 바꿔주는 것이다. 하지만 항해99 기본과제 수행을 위해 프로젝트를 마무리짓고 수정사항은 추후 수정할 계획이다. https://git..

ES 란? ES 란 ECMASCRIPT의 약어로 자바스크립트 표준 규격을 의미한다. ES5 와 ES6의 차이 1. var => let & const 기존의 var 키워드에 비해 블록 레벨 스코프를 가지며 재할당이 가능한 let, const 키워드가 추가되었다. 변수의 생명주기에 영향을 끼치며, 키워드를 시각적으로 보아도 변수의 변화가 생기는지 안 생기는지 알 수 있다. 또한, 호이스팅 문제를 해결할 수 있다는 측면에서 현재 let 과 const 를 사용하라는 의견이 빈번하다. 2. Arrow function 추가 화살표 함수가 추가되어 함수를 간결하게 나타낼 수 있다. 가령, // ES5 function plus(a,b) { return a+b; } // ES6 const sum => (a,b) => a..

이 글은 회고록입니다. 항해99 3주차 주특기 기본주차의 2일차가 되었다. Redux 상태관리와 DB 연결 , useEffect를 통한 렌더링을 완료시킨 상황이다. 오늘의 결과물을 대략 이렇다. 현재 상태관리하는 것은 날짜 데이터, 다이어리 데이터, 기분을 나타내는 하트 데이터 총 3가지이다. DB 역시 이 데이터로만 구성되어있다. 캘린더 클릭 시 날짜의 State가 RootState 에 저장되며, 다른 날짜를 클릭 시 데이터가 dispatch된다. 글쓰기 컴퍼넌트는 모달을 이용했다. 하트를 클릭하거나 일기를 작성할 때 역시 State 가 RootState에 저장되며, State는 event의 value가 변화될 때마다 변한다. 그리고 저장버튼을 클릭 시 홈 화면으로 넘어가고, 해당 데이터가 보인다. 하..

이 글은 회고록입니다. 항해99 3주차가 시작되었다. 다시 팀이 바뀌었으며, 새로운 마음으로 주특기를 배우는 주이다. 이번주 과제는 이렇다. - 한 주의 기분 상태가 어떤지 별점으로 나타내는 페이지 만들기 나는 더 나아가 캘린더를 누를 시 누른 날짜의 일기와 기분을 나타내고 한 주의 일기를 요약한 데이터를 Accordion 형식으로 나타내는 캘린더 사이트를 만들 예정이다. 현재까지 구현한 것은 이렇다. 캘린더를 클릭 시 => Redux 상태관리를 통해 클릭한 날짜 State를 관리한다. 이유는 부모 Props를 자식 컴퍼넌트에게 전달하는 방식은 과거 너무 많이 사용했으며, Redux 사용 방식에 더 친숙해지기 위해서도 있으며, 한 페이지에 컨테이너와 컴퍼넌트들로 구성할 예정인데, 컨테이너 Prop을 자식..

항해 99 2주차 알고리즘 기간 (기간 : 7일) B반 2조 팀원 : 이주석(본인), 전해강님, 안진희님, 유동건님 목표 : Javascript 문법 이해 / 프로그래머스 Javascript level 1 문제 다 풀기 [54문제] 커뮤니케이션 : Slack, Gather 과정 : 매일 10문제 씩 / 난이도 중 이상의 문제의 경우 8문제씩 결과: 성공 https://github.com/act99/coding-test GitHub - act99/coding-test: coding-test coding-test. Contribute to act99/coding-test development by creating an account on GitHub. github.com 2주차 회고록 나는 코딩테스트 문제라..