클라이언트가 웹서버에게 사용자 요청의 목적/종류를 알리는 수단이 Method중 Axios 통신하면서 가장 많이 사용되는 메소드를 정리해보았다.GETGET : 입력한 url에 존재하는 자원에 요청을 한다.문법axios.get(url,,config)Q) Get이 데이터를

리액트는 효율적인 UI 구현을 위한 라이브러리이다. HTTP Client(HTTP 상에서 커뮤니케이션을 하는 자바 기반 컴포넌트)를 내장하고 있는 Angular와는 다르게, 리액트는 따로 내장 클래스가 존재하지 않는다.따라서 리액트에서 AJAX를 구현하려면 Javasc

리덕스는 리액트에서 상태를 더 효율적으로 관리하는데 사용하는 상태 관리 라이브러리이다.예시로 프로젝트가 복잡할 때, handleSomethin은 value를 업데이트하는 함수이다. 이 함수는 컴포넌트 두 개를 거쳐서 왼쪽 A 컴포넌트로 전달한다. 이 함수가 호출되면 맨

2차 프로젝트가 시작되었다.1차 프로젝트에서는 프론트엔드를 맡고 싶어하시는 분들이 많으셔서똑같이 2차 프로젝트에도 그런 일이 일어나 백엔드 포지션을 맡게 되면 어쩌지 하는 걱정이 많았는데다행히도 이번에는 백엔드 포지션을 맡고 싶어하는 분이 두분이나 계셨고,두 포지션 다

Styled ComponentsStyled Components에 대해 이해하기 위해서는 CSS in JS 개념에 대해 알아야 한다. 이는 말 그대로 CSS를 JS 파일 안에 작성하는 것이다. 대두되면서 탄생한 라이브러리이다. HTML+JS+CSS를 묶어서 하나의 JS파

CSS Moduleclass, id 등에 random string을 달아주기 때문에 선택자가 겹칠 우려가 없음스타일 충돌을 방지하고 코드를 격리하여 체계적으로 css 설계가 가능스타일링 직접 하나하나 해야 함UI framework (ex. Ant Design, Mate

Server Side Rendering React, Vue, Angular 등 자바스크립트 프레임워크가 나오기 이전 초기 웹 환경에서는 모든 페이지를 서버에서 빌드 클라이언트는 별도의 처리 없이 웹페이지 노출 이를 server Rendering이라고 함 Clien

코드를 작성하고 나면, 원하는 대로 동작하는지 알기 위해 테스트를 함코드에 버그가 있으면, 어떤 상황에서 버그가 발생하는지를 알기 위해 테스트를 함코드를 리팩토링하면, 원래대로 동작하는지 테스트함리액트 앱의 컴포넌트가 늘어날수록, 컴포넌트끼리 서로 영향을 미치는 경우가

앱 전체 상태를 쉽게 관리하기 위한 라이브러리Redux의 많은 개념들이 Flux pattern에서 차용됨주로 react 앱과 같이 사용redux.js.org에서 수많은 문서를 참고할 수 있고, 웹상에 redux를 활용한 앱 구축 사례가 많음앱 전체의 상태 관리가 필요할

상태 관리 기술이란 앱 상에서의 데이터를 메모리 등에 저장하고 하나 이상의 컴포넌트에서 데이터를 공유하는 것한 컴포넌트 안에서의 상태, 여러 컴포넌트 간의 상태, 전체 앱의 상태 관리를 모두 포함MPA에서는 서버의 데이터를 이용해 페이지를 렌더링하므로, 클라이언트의 데

초기 웹 환경에서는, 서버에서 모든 데이터를 로드하여 페이지를 빌드했으므로 자바스크립트에서는 별도의 비동기 처리가 필요하지 않음Ajax 기술의 등장으로 페이지 로드 없이 client-side에서 서버로 요청을 보내 데이터를 처리할 수 있게됨XMLHttpRequest라는

SPA(Single Page Application)은 하나의 페이지 요청으로 전체 웹앱을 사용하는 방식유저는 웹페이지를 사용하며 모바일 앱 같은 경험을 느낌 MPA(Multi Page Application)은 서버에 미리 여러 페이지를 두고, 유저가 네비게이션 시 요청

좋은 앱을 만들려면번들 사이즈에 대한 고려Css 코드가 차지하는 사이즈는 무척 중요한 요소앱 성능에 대한 고려animation, transition 등 유저와의 상호작용에서 스타일 코드의 성능이 중요 요소사용자에게 유리한 ui/ux를 고려스타일링에 대한 지식으로, 고급

컴포넌트에서 데이터를 관리(State)하고 데이터가 변경될 때 상호작용(Effect)을 하기 위해 사용한다.앞선 강의에서 사용해본 useState가 바로 State Hook이다.기존에는 컴포넌트 내에서 State와 생명주기를 관리하기 위해서 반드시 클래스 컴포넌트를 사

컴포넌트 생성 컴포넌트 사용사용되는 값들을 바꿔가며 출력할 수 있다기본적으로 component에 원하는 값을 넘겨줄 때 사용하며 넘겨줄 수 있는 값은 변수, 함수, 객체, 배열 등 Javascript의 요소라면 제한이 없다.주로 component의 '재사용'을 위하여

최초에 서버로부터 html을 전달 받고 페이지의 변경이 필요할 때 변경이 필요한 부분을 json으로 전달 받는다.이때 페이지에서 변경된 부분만 계산하여 다시 그리게 된다.React사용자 인터페이스를 만들기 위한 javascript 라이브러리Component리액트에서 서

1차 프로젝트가 완료 되었다.많은 아쉬움이 남지만 열심히 이끌어준 팀원들 덕에 더 아쉬움이 남는것 같다.화면 구현에 너무 많은 시간을 소요했다. 클론 코딩을 하여 디자인 시간을 줄이는 것은 좋았지만 금같은 시간을 결국 만들지 않을 화면에 써버렸다.버려진 시간은 결국 다

URI(Uniform Resource Identifier): 인터넷에 있는 자원을 나타내는 유일한 주소URI, URL(Uniform Reslurce Locator), URN(Uniform REsource Name)의 차이연관된 개념인 Scheme(Protocol), H

innerHTML이 가독성이 좋다바닐라 JS에서도 JSX와 비슷하게 코드 스타일을 구성 할 수 있어서 아무래도 유지보수는 훨씬 편하긴하다.createElement가 성능은 더 좋다innerHTML을 사용할 경우 기준이 되는 요소의 DOM 내부를 전부 재분석하기 때문에

내가 맡았던 부분은 고객 리뷰, 게시판 쪽이었는데 과감히 삭제하기로 결정이 났다.쇼핑몰을 만들 때 제일 중요한 기능들을 중점으로 두고, 시간이 남으면 후기, 게시판을 만들기로 했다.이럴 땐 우물쭈물하지않고 과감히 결정을 내려주는 팀원들이 중요하다고 생각한다.다시 관리자