kongom2dev

DOM DOM(Document Object Model)은 웹페이지 인터페이스 프로그램이 페이지의 컨텐츠의 추가, 구조의 변경, 스타일 수정할수 있도록 접근하는 방법 제공 data type 설명 document member 가 document type 의 object 를 리턴할 때(예를 들어 element의 ownerDocument property 는 그것이 속해 있는 document 를 return 한다. ), 이 object 는 root document object 자체이다. 는 document object 에 대한 설명은 DOM document Reference 챕터를 참조하라. element element 는 DOM API 의 member 에 의해 return 된 element 또는 element ..

kongom2week 개인 프로젝트, 나의 일주일 평점남기기 https://github.com/kongom2/kongom2week/tree/master 프로젝트 URL http://kongom2project.s3-website.ap-northeast-2.amazonaws.com/ 개인 공부 내용 컴포넌트 리액트 요소 이벤트 관리 라우팅 유사배열 사용한 라이브러리 npm install create-react-app npm install react-router-dom styled-components 사용한 리액트 훅 참조 사이트 : https://velog.io/@yiyb0603/React-Router-dom%EC%9D%98-%EC%9C%A0%EC%9A%A9%ED%95%9C-hooks%EB%93%A4 use..

404 (Not Found) 리액트를 아무런 처리없이 빌드하고 배포하고 나서, 특정 URL로 바로 접근 시 생기는 에러 리액트라서 생기는 문제이라기 보다 SPA이 가진 특징 때문에 생기는 문제 왜 이런 에러가 발생 하는가 Base가 되는 URL을 단 하나인 index.html에 연결시켜 배포하지만, 다른 URL로 접속하면 해당 URL에 맞는 html을 다시 찾으려고 하기 때문에 발생. 따라서, Base가 되는 URL이 아닌 다른 URL을 통해 사이트에 접속해도, index.html을 연결시켜 배포하는 작업이 필요 S3 서버에서의 처리 방법 S3에서는 정적 웹 사이트 호스팅 편집에서 인덱스 문서와 오류문서를 index.html 하나로 설정하면 해결 참조 https://leonkong.cc/posts/til..

🔑 Q5. Redux는 무엇이고, 왜 Redux를 사용하는가? Redux? ( ≒ MobX, Overmind.js, Recoil ) React에서 사용률이 가장 높은 상태관리 라이브러리. 자바스크립트로 만든 앱을 위한 상태 컨테이너. React에서 사용을 많이 하지만, React만을 위한 라이브러리는 아님. 자바스크립트로 만들어진 다양한 프레임워크와 작동이 가능. 구조 Flux구조를 기반으로 만들어짐. Flux 구조 Action(동작)이 발생하면, Dispatcher(관리자)에 의해 Store(저장소)에 변경된 사항이 저장되고 View가 그 저장된 사항에 의해 변경되는 패턴 Redux 구조 Action(동작)이 발생하면, State가 처리, 기능이 있으면 처리 후, 아니면 바로 Reducer로 Reduc..

React Hooks API 함수형 컴포넌트에서도 State와 컴포넌트 라이프사이클 등등의 것들을 가능하게 하는 것은 React Hooks API이다. 핵심은 Class 없이 React를 사용할 수 있게 해주는 것. 초기 리액트는 State와 컴포넌트의 Life Cycle 관리하려면 클래스형 컴포넌트만 사용가능하였고, 함수형 컴포넌트는 UI를 표현하는 것에만 주로 사용되었다. 하지만, 리액트의 16.8 버전(2019년, 2월)부터는 모든 컴포넌트를 함수형으로 만들 수 있게 되었고 React Hooks을 이용해 State와 컴포넌트의 Life Cycle 관리가 가능해졌다. 또한 상태 관리 라이브러리인 Redux 등을 사용하지 않고도 어느정도 까지는 리액트 기본제공되는 방법으로 상태 관리를 할 수있는 기대감..

새로운 팀 새로 맞이한 팀에서 팀장을 맡게 되었다. 2주간 팀원으로 있으면서 2분의 팀장님이 생각났다. 지나온 팀 모두 매끄럽게 팀과제, 개인과제를 마쳤고 이 팀 또한 그렇게 흘러갈 수 있도록 해야겠다 생각이 들었다. 우리가 할 일에 대해서 계속적으로 알리고 접근하기 편하도록 카톡방에는 주요 공지사항을 적어두고 노션을 활용해 팀과제에 생각날때 마다 접근할 수 있도록 했다. 개발 환경 이슈 이후 강의를 들으며 개발환경 셋팅을 하는데 문제가 발생했다. 기존에 설치해두었던 node에 nvm을 설치하고 gitbash로 노드버전을 선택하는 과정에서 강의와 nvm 버전을 맞춰 install하고 nvm use 했는데 적용이 안되었다. nvm node 전부 삭제하시고 nvm 먼저 깐 뒤에 node 깔아보시는 것을 추천..

알고리즘은 그동안 배우지 않았다. 뭔가 문제를 푼다는 것이 시도하기 전부터 큰 허들로 찾아왔던것 같다. 하지만, 프로그래밍을 하려면 문제를 해결하는 여러 방법을 알아야 하고, 알고리즘을 통해 언어의 문법과 내장함수, 코드 작성법등으로 여러가지 상황을 코드로 풀어내는 작업을 하는 것이 왜 중요한지 깨닫는 한주가 되었던거 같다. ECMAScript 자바스크립트를 표준화 하기 위해 만들어졌다. 이 한줄로 ECMAScript의 존재의 이유가 나온다고 생각한다. 표준화는 일상에 모든 것들에 범용성과 효율성을 가져다 준다. 대부분의 회사 내부에서 진행하는 코딩컨벤션이나 매뉴얼 등으로표준화된 기틀을 마련하는 것처럼 이도 마찬가지라고 생각한다. 프로그래밍을 하는 입장에서는 기술규격이 일정하면 여러 케이스에 따른 추가적..

알고리즘 테스트를 보는 날이었다. 예상보다 쉬운 난이도에 빠르게 풀고 왜 이렇게 쉽게 끝날까 고민을 하며 지문을 다시 보니 연산값만 리턴하는 것이 아닌 계산식 문자열 전부를 리턴하는 문제였다. 당황했지만 그래도 예상하기도 해서 그런지 다시 차분히 문제를 하나하나 뜯어보았다. 결국 답을 찾았고 내가 알고있는 함수와 방법들을 동원해서 문제를 코딩했다. 실수를 줄이는 방법은 같은것을 보고 한번 더 생각하는데 있는 것 같다.

시저암호 [39번 문제] [문제설명] 어떤 문장의 각 알파벳을 일정한 거리만큼 밀어서 다른 알파벳으로 바꾸는 암호화 방식을 시저 암호라고 합니다. 예를 들어 "AB"는 1만큼 밀면 "BC"가 되고, 3만큼 밀면 "DE"가 됩니다. "z"는 1만큼 밀면 "a"가 됩니다. 문자열 s와 거리 n을 입력받아 s를 n만큼 민 암호문을 만드는 함수, solution을 완성해 보세요. [제한조건] 공백은 아무리 밀어도 공백입니다. s는 알파벳 소문자, 대문자, 공백으로만 이루어져 있습니다. s의 길이는 8000이하입니다. n은 1 이상, 25이하인 자연수입니다. function solution(s, n) { // 변수, 상수 선언 =============================================== ..

콜라츠 추측 [27번 문제] [문제설명] 1937년 Collatz란 사람에 의해 제기된 이 추측은, 주어진 수가 1이 될때까지 다음 작업을 반복하면, 모든 수를 1로 만들 수 있다는 추측입니다. 작업은 다음과 같습니다. 1-1. 입력된 수가 짝수라면 2로 나눕니다. 1-2. 입력된 수가 홀수라면 3을 곱하고 1을 더합니다. 2. 결과로 나온 수에 같은 작업을 1이 될 때까지 반복합니다. 예를 들어, 입력된 수가 6이라면 6→3→10→5→16→8→4→2→1 이 되어 총 8번 만에 1이 됩니다. 위 작업을 몇 번이나 반복해야하는지 반환하는 함수, solution을 완성해 주세요. 단, 작업을 500번을 반복해도 1이 되지 않는다면 –1을 반환해 주세요. [제한조건] 입력된 수, num은 1 이상 800000..