대부분의 객체지향 언어에서 this는 클래스로 생성한 인스턴스 객체를 의미한다. 클래스에서만 사용할 수 있기 때문에 혼란의 여지가 많지 않지만, this는 자바스크립트의 어디서든 사용할 수 있다. this는 상황에 따라 바라보는 대상이 달라지게 되는데, 어떤 이유로
실행 컨텍스트란? > 실행할 코드에 제공할 환경 정보들을 모아놓은 객체이다. 동일한 환경에 있는 코드들을 실행할 때 필요한 환경 정보들을 모아 컨텍스트를 구성하고, 이를 콜스택에 쌓아 올렸다가 가장 위에있는 컨텍스트와 관련 있는 코드들을 실행하는 식으로 전체 코드의
자바스크립트 데이터 타입은 기본형, 참조형 이렇게 크게 두가지로 볼 수 있다.일전 자바스크립트 이해하기-2 에서도 간략하게 살펴보았었지만 책을 읽고 정리해보면서 더욱 자세하게 살펴보려고한다. 이 둘을 구분하는 기준은 무엇일까?둘 다 복제를 하지만 기본형은 값이 담긴 주
내가 할 수 있을까? 하는 마음으로 시작했는데 정말 다 해낸 2차 프로젝트 회고록을 남겨보려고 합니다. 그치만 언제나 아쉬움은 존재..코로나 바이러스를 비롯한 여러 데이터를 수집, 분석 및 차트와 지도로 시각화한 dataUSA Web사이트 클론 프로젝트입니다.개발 기간
Redux는 자바스크립트 앱의 상태(state)를 관리해주는 하나의 도구, 라이브러리이다. React 뿐만 아니라 어디에서도 사용할 수 있지만 이번 프로젝트에서 React와 함께 Redux로 state를 관리해보면서 Data Cart 페이지를 구현하였다.프로젝트 규모가
2차 프로젝트에 들어가면서 git rebase라는 새로운 flow를 익히게 되었다.기존에 적용하였던 git flow는 각자 작업하던 branch에서 새로운 업데이트 사항이 생기면 git addgit commitgit push origin master conflict 발
DataUSA에는 제대로 된 로그인 페이지도, 더불어 소셜 로그인 기능도 없지만 DataWeSA에는 멋진 로그인 페이지와 소셜 로그인 기능까지 갖춰져있다^^레이아웃 짜주신 효식님께 박수10번..👏👏👏소셜 로그인 기능 구현을 경험해보기 위해 우리 팀은 각자 하나씩
DataUSA 사이트의 Navbar는 Scroll을 감지하여 처음에는 배경색이 없었다가 일정부분 내려가면 배경색이 생기면서 페이지의 타이틀이 추가된다. 스크롤을 감지하는 이벤트를 활용하여 구현할 수 있다.1차 프로젝트 때 Nav 바를 멋지게 구현해주신 경배김님 덕분에
제목 그대로 복잡한 데이터, 즉 변경될 데이터를 포함하는 여러 형태의 데이터를 함수형 컴포넌트 내에서 useEffect와 useState를 사용하여 다루려고 한다.2차 프로젝트에서 highchart 라이브러리를 사용하고 있다.highchart는 options라는 객체
1차 프로젝트가 끝나고 화끈하게 뒷풀이도 했습니다. 짧다면 짧은 2주지만 시간에 비례하지 않게 저에게 많은 경험을 남겨준 1차 프로젝트를 마무리하며 회고록을 남겨보려고 합니다. 프로젝트 소개 국내외 패션, 라이프 스타일을 한눈에 볼 수 있는 유명 온라인 편집샵 29
지난주부터 끙끙앓던 문제를 해결하였고 그 문제가 도대체 무엇이였는지..회고록을 남겨보고자 한다.우선 내가 구현하고 있던 페이지인 29TV는 총 4개의 컴포넌트가 존재한다.최상위 부모 컴포넌트인 TwentyNineTV컴포넌트에서 fetch를 통해 데이터를 받고, 이 데이
공식문서 : https://ko.reactjs.org/docs/lifting-state-up.html1차 프로젝트를 진행하면서 동일한 데이터에 대한 변경사항을 여러 컴포넌트에 반영해야 하는 순간이 찾아왔다..나의 상황...공식문서 ctrl+c, ctrl+v..
프로젝트 진행중 카테고리 버튼을 클릭할 시 안에 컨텐츠만 변경이 되는 기능을 구현하게 되었다.귀한 세션을 듣고 바로 적용한 것...안비밀..변경될 부분만 다른 컴포넌트로 바꿔주어 그 부분만 렌더를 하면 되기 때문에 React의 주요 특징 중 하나인 SPA가 돋보이는 페
리눅스의 구조 커널 : 하드웨어를 제어하는 커널 쉘 : 커널과 유저가 대화할 수 있도록 제공되는 쉘 응용프로그램 : 그와 별개로 존재. 커널은 리눅스의 핵심, 프로세스관리, 메모리관리, 파일 및 장치등 컴퓨터의 하드웨어를 모두 제어 쉘은 커널과 사용자간의 접점으로
1주차 프로젝트가 시작되었다.나는 29CM 사이트 클론 팀에서 29TV 페이지를 맡게 되었다.29CM는 국내 온라인 편집숍 사이트이며 29TV는 자체 소셜 네트워킹 서비스 페이지로, 입점 브랜드들이 브랜드 제품을 홍보하거나 사진, 비디오를 공유하는 페이지이다.페이지 구
fetch함수로 API를 호출하는 실습을 진행하면서 React의 Lifecycle을 다시 살펴보면 좋을 듯 하여 정리 해보려고 한다. a
API 호출 (백엔드 서버 호출) API는 백엔드랑 통신해서 받아오는 과정의 모든 것이라고 생각하면 된다. JSON은 객체 값을 갖고오듯이 가지고올 수 없고 JSON을 자바스크립트로 변환해주는 과정이 fetch안에 들어와있다. 데이터가 들어 왔을 때 하고자 하는 것
인증과 인가는 API에서 가장 자주 구현되는 기능중 하나이다. 프라이빗한 API는 물론이고 퍼블릭한 API도 기본적인 인증과 인가를 요구한다.Authentication은 유저의 identification을 확인하는 절차이다. 쉽게 말해 유저의 아이디와 비밀번호를 확인하
Set이란? >Set은 array나 list처럼 순열 자료구조이다. 하지만 Set은 array나 list와 다르게 순서라는 개념이 존재하지 않는다. Set의 특징 데이터를 비 순차적으로 저장할 수 있는 순열 자료구조(collection) 삽입 순서대로 저장되지 않는
바닐라 자바스크립트로 인스타그램 클론 코딩을 마친 후 이를 이용해 React 로 컴포넌트를 생성하여 기능 구현을 하고있다.아직 리액트의 개념을 익히고 있는 와중에 ... 댓글 기능 구현에서 큰 난항을 겪고 삭제기능까지 애쓰며 겨우 구현해내었던 과정을 살펴보고자 한다.먼