# front
yarn berry, workspace
Yarn berry workspace를 활용한 프론트엔드 모노레포 구축기 이 글을 참고하여 yarn berry와 workspace를 이용한 monorepo 구축을 해봤습니다. 사전지식 모노레포? 모노레포에 대해서는 저번에 작성한 글에 작성해놓았으니 참고하시면 좋
React.js - 리액트 훅에 대해 알아보자
Hook은 리액트 v16.8에 새로 도입된 기능으로 함수 컴포넌트에서 React state와 생명주기 기능(lifecycle features)을 “연동(hook into)“할 수 있게 해주는 함수다. Hook은 class 안에서 동작하지 않으며, class를 사용하지
[front] Event
Event : 프로그램에 의해 감지되고 처리될 수 있는 동작이나 사건, 주로 클라이언트와 서버의 통신을 할 때 매개역할을 한다. dom으로 이벤트를 사용하는 방법 1. 이벤트 핸들러 : dom의 property에 콜백함수를 추가하여 사용하는 방법 > target.이
[front] DOM
DOM : 문서 객체 모델이라는 뜻으로, HTML, XML 문서의 프로그래밍 인터페이스이다. 이는 문서의 구조화된 표현을 제공하며, 프로그래밍언어가 DOM구조에 접근할 수 있는 방법을 제공하여 문서구조, 스타일, 내용 등을 변경할 수 있게 도와준다. > API (we
2차 프로젝트
elice 플랫폼에서 2차 프로젝트를 시작한다. 오늘부터 시작이지만 이틀 전에 모여 아이디어 회의를 하고, 간단하지만 길었던 자기소개를 했다.정말 대단한 사람들이 많았다. 아니 전부 다 훌륭한 사람들이었다. 프로젝트를 대하는 자세와 프로젝트에 대해 생각하는 깊이감이 나
useEffect
리액트 컴포넌트를 관리하고 꿰뚫어 보는 것은 매우 어려운 일이다. 공부를 하며 가장 어렵다고 느껴지는 부분은 새로운 것을 학습할 때가 아니라 그 자체에 대한 기본을 갈고 닦는 것 같다.리액트 훅을 이해하기 위해선 기본적으로 생명주기를 알아야 한다. 기본적으로 useEf
React.js - 리액트에서 이벤트 처리하기
리액트도 결국에는 자바스크립트이기 때문에 이벤트를 처리하는 방식은 순수 자바스크립트와 동일하다. 먼저 이벤트를 리스닝 후 리스너를 작성하는 것이다. 이벤트 리스닝 : 특정 엘리먼트가 어떤 이벤트를 수신할지 결정하는 것이벤트 리스너 : 이벤트 리스너란 이벤트가 발생했을
React.js - 컴포넌트 생명주기(Life Cycle)
리액트 컴포넌트 생명주기(Life Cycle) 리액트의 컴포넌트는 생명주기를 가진다. 생명주기란 컴포넌트가 생성되고 사용되고 소멸될 때 까지 일련의 과정을 말한다. 생명주기 안에서는 특정 시점에 자동으로 호출되는 메서드가 있는데, 이를 라이프 사이클 이벤트라고 한다.
Rest API
REST(REpresentational State Transfer)는 HTTP/1.0과 1.1의 스펙 작성에 참여했고 아파치 HTTP 서버 프로젝트의 공동 설립자인 로이 필딩의 2000년 논문에서 처음 소개된 개념입니다. 발표 당시 HTTP를 제대로 사용하지 못하고 있
[JS] 제어문
제어문 > 프로그램의 흐름을 제어할 수 있도록 도와주는 문장 조건문 > 조건을 만족하는지의 여부에 따라 코드를 제어할 수 있는 문장 if문 : 조건식을 만족(true)할 경우에만 코드를 실행 [기본형] 예시 ※ *조건식에 0, null, ""(빈문자), unde
Final_Project _ 7 _ 2022.03.21.Mon
teammeber 2 back -end (손, 추)2 front -end (양, 김)leader = 나 입니다 (front-end)😂 이번엔 망하지 않는다 운동 동호회 및 공유 커뮤니티 소셜 (킥) + 콘텐츠 (부가)서비스 유사 사이트 : 플랜핏메인 기능: 소셜
[JS] 자바스크립트 기초문법 2
: 변하는 데이터 값을 저장할 수 있는 메모리 공간: 변수명으로 데이터를 저장할 수 있는 공간 생성변수에는 하나의 값만 넣을 수 있음: 문자 데이터를 의미 "", ''로 감싸고 있으며 html tag를 포함하여 출력하면 tag로 인식: 숫자 데이터를 의미: 주로 2개의
[JS] 자바스크립트 기초문법 1
: 자바스크립트 코드를 작성할 영역을 선언하는 것head 태그 영역 or body 태그 영역에 선언하면 되지만, 대부분 head 태그 영역에 선언한다.: 선언문 안에 코드가 아닌 설명글을 넣고 싶을 때 사용: 자바스크립트 소스 찾기를 수월하게 하고, 누군가가 소스를 손
React.js - state
컴포넌트에 저장하여 사용(변경)가능한 데이터를 상태(state)라고 한다.props는 부모로 부터 전달받은 데이터이며 변경이 불가능한 읽기전용 데이터인 반면, state는 캡슐화 되어있어 비공개이며 컴포넌트에 의해 제어(변경)이 가능하다.클래스 내부에서 생성자를 만든다
[React] OAuth 2.0 사용하기 - refresh token grant
refresh token을 이용하여 access token 재발급 받기 ->> 매번 귀찮으니깐 interceptor 사용해서 자동화 적용해보기
[React] OAuth 2.0 사용하기 (w/ authorization code grant)
authorization token grant 방식의 OAuth 2.0을 React에서 사용하기