이제 로그인 중인지, 회원가입 중인지 상황에 맞게 각 요소들을 숨겼다, 드러냈다 하는 기능을 만들어봅시다. Bulma에서는 is-hidden이라는 클래스를 이용해서 요소를 숨길 수 있습니다. CSS로는 아래와 같이 정의되어있어요..is-hidden { displa
2주차로 접어드는 첫날멘탈붕괴하게 만든 사건들1) 비주얼 스튜디오 환경설정부터 멘붕이었다.node? 관련 설정을 했어야 했다. 이해가 되지 않았으나 일단 열심히 구글링하여 설치를 끝내고끝내고 났는데, javascript를 HTML상에서만 구현해봤지, 따로 .js 파일을
아래의 개념을 정리해봤다. 아래는 기본정의 인데. 이렇게만 보아서는 알기 쉽지 않다.JWT : JSON Web TokenAPI : API는 Application Programming Interface(애플리케이션 프로그램 인터페이스)의 줄임말입니다. API의 맥락에서
느슨한 타입(loosely typed)의 동적(dynamic) 언어JavaScript의 변수는 어떤 특정 타입과 연결되지 않으며,모든 타입의 값으로 할당 (및 재할당) 가능합니다.예) let x = 42 // x가 숫자 x = 'bar' // x가 문자열로 재할당
오늘 문제의 JSX 코드는 아래의 코드 였다.< 문제의 이슈 코드 >나는 위 코드에서 문제가 있을 것이라고는 생각도 못했다.저장했을때, 터미널에서는 에러가 있다고 띄어주지 않았기 때문이다.참고 코드와 비교했을때도 도저히 어디가 다른지 찾을 수가 없었다. input
ES6(ECMAScript6)란?ECMAScript 2015로도 알려져 있는 ECMAScript 6는 ECMAScript 표준의 가장 최신 버전입니다. ES6는 새로운 언어 기능이 포함된 주요 업데이트이며, 2009년도에 표준화된 ES5 이후로 언어 기능에 대한 첫 업
리액트에서는 DOM 요소에 접근하기 위해 주로 ref를 씁니다.domcument.getElementsByClassName 등을 쓰는 게 아니라 ref를 쓰는 이유는 무엇일까요?React에서 제공하는 가상DOM을 사용하게되면서 굳이 실제DOM에 직접 접근할 상황이 필요하
(1) Component란 무엇인가?컴포넌트란 블록이고 결국 함수입니다.컴포넌트란, 화면을 구성하는 하나의 단위입니다. 레고로 만들어진 장난감이 있다고 했을 때, 그것을 이루는 하나하나의 레고 블럭과 같습니다. 그 레고 블럭을 코드로 만들면 이렇게 생겼습니다.리액트 세
props는 부모 컴포넌트로부터 받아온 데이터입니다.우리는 컴포넌트 간의 정보를 교류할 때 Props를 사용합니다. 다른 컴포넌트는 생략하고 Mother만 봅시다.
<오늘 이슈 코드><해결>map, filter 메서드 사용시 if 조건문 사용시, return 값을 주되return값을 똑바로 줄것!
State란 컴포넌트 내부에서 바뀔 수 있는 값을 의미합니다. State를 만들 때는 useState()를 사용한다.아래의 예시를 보자.useState 라는 함수를 이용해서 state를 만듭니다.useState 는 state를 만들어주는 리액트에서 제공하는 기능입니다.
React Hooks란?React 에서 기존에 사용하던 Class를 이용한 코드를 작성할 필요 없이,state와, 여러 React 기능을 사용할 수 있도록 만든 라이브러리React Hook 개발 과정클래스 컴포넌트 사용\-- 2019년 2월 데이터 캐시 개발 --함수
리덕스에서 미들웨어 청크의 역할은 뭘까요?프로미스는 정확히 말하면 비동기가 아닙니다. 비동기와 프로미스는 각각 무엇일까요?TDZ(Temporal Dead Zone/일시적 사각지대)란?
아쉬운 점: git flow에 대해 잘 몰라서 어려움을 겪었습니다. 특히나 Component 별로 나누어서 다른 사람이 맡은 Component는 서로 건드리면 안되는데, 작업하다보니 실수로 건드려서 서로 충돌이 나거나, 기능구현 상 다른 사람의 Component에 무언
addEventListener() 웹API는 특정 이벤트 발생시, 동적 기능 추가하기 위해 사용되는 기본적 기능이다.그런데, 웹브라우저는 어떻게 이벤트 발생을 감지하는지와 관련하여, 2가지 방식이 있다고한다.Event Bubbling : 해당 화면 요소에 이벤트 발생시
먼저 DOM(Document Object Model)에 대한 개념부터 알아봤다.웹을 이루는 HTML태그들을 자바스크립트가 이용할 수 있도록 웹브라우저가 트리구조로 만든 객체모델이라고 한다.HTML/CSS <--> DOM <--> JavaScript windo
컴포넌트 내에 복잡한 계산을 하는 함수가 있을 때, useMemo를 사용하여 컴포넌트가 리렌더링되어도 종속변수, 의존성배열이 변하지 않는 한, 호출되지 않게 한다.부모 컴포넌트에서 자식 컴포넌트로 props를 전달할 때, React.memo를 사용하여, props가 바
이번 포스트에서는 불변성관리를 알아보았다.처음에 배울 때는 배열의 요소를 수정하거나 객체의 프로퍼티를 수정할 때, 기존에 변수를 건드리지 않고 spread연산자와 다른 state값을 사용해서 불변성 관리를 하면 되는 것인줄 알았다.불변성이란 : “단순히 변수를 재할당하
Axios vs fetchaxios써드파티 라이브러리, 설치가 필요data 속성을 사용data는 object를 포함한다.status가 200이고 statusText가 'OK'면 성공자동으로 응답을 JSON으로 변환한다. --> JSON.stringify() 필요 없음요
HTTP, TCP/IP 개념이 익숙치 않아서 구글링 하던중, OSI 7계층 얘기가 많이 나오길래, 이게 뭔가해서 찾아 봤다.중요한 것 같아 보여, 정리해 둔다.개방형 시스템 상호연결 모델의 표준OSI 7계층은 응용, 표현, 세션, 전송, 네트워크, 데이터링크, 물리계층
<기존 생각>var 선언문이 해당 scope 최상단에 있는 것처럼 실행되는 현상. var 로 변수나 함수 호출이 var로 변수 선언 보다 윗줄에 있어도 에러없이 코드가 동작하는 이유입니다.<수정>JavaScript에서 호이스팅(hoisting)이란, 인터프리