Frontend

예제코드 분석 head 태그 안에 css, js 라이브러리가 정리되어 있다. → Linking Style Sheet 방법으로 적용되어 있음 `` CSS를 HTML에 적용시키는 방법 Inline Style Sheet : HTML 태그

React 설치 설치 과정에서의 오류 해결 https://velog.io/@jyun9807/react-project-%EC%83%9D%EC%84%B1-error 소스코드 수정방법 소스파일 index.js → 입구 파일, 여기에 작성한 대로 동작하게 된다. 이때, 아

숫자를 count하는 기능을 만들어보자!이 기능을 은행과 비교하면, state == 장부event == 고객고객이 장부를 직접 기록하는 방식, 즉 event가 발생했을 때, 고객이 직접 state 값을 바꾸는 방식이다.코드를 살펴보면, 원래 count가 0이고 coun

redux store : 정보들이 저장되어 있는 공간 state : 실제 정보 → 이때, 직접 접근 불가!!! reducer : 함수 store에 접근하기 전 거치는 함수들 dispatch subscribe getState render : state 값을 참조해서

목표 발화 응답이 올 때까지 기다림이 존재하는데 UI에 로딩을 구현하고 싶다. 문제 Question 데이터와 Answer 데이터를 보여줄 때, 배열을 뿌리고 있다. 하지만 한 Question에 하나의 Answer를 번갈아가면서 보여줘야 한다. 정적 영역은 렌더링 되

Redux : 상태 관리자 Redux toolkit 설정, 미들웨어 설치, 반복되는 코드 등 할일이 너무 많다. 또한, 불변성 유지의 어려움 등을 도와주는 모델 configureStore 기능별로 나눠진 store -> slice createSlice redux

챗봇 프로젝트 과정에서 발화 후, 답변을 응답 받기까지 시간이 걸렸다.비동기 처리를 해야하는 상황이었는데이때, 사용자가 기다리는 동안 loading 중 임을 알려주는 UI를 넣고 싶었다.결론적으로 아래와 같이 구현을 성공했다.redux를 사용한 이유?컴포넌트 간의 의존

로딩 UX를 구현하다가 본 글 공유합니다~로딩을 위한 UX 디자인 패턴

챗봇 퀵메뉴 구현 왜 css를 사용했을까? 동적인 작업하면 스크립트로 많이 하지만 성능이 제일 좋은건 1. css 2. javascript에요 css 는 브라우저 렌더링의 원리를 잘 충족하고 있어요 javascript는 메모리 누수도 있고 사용하는 사람마다 달라서~

Yarn Berry : 의존성 관리, 패키지 관리 시스템 Yarn Berry Node.js를 위한 새로운 패키지 관리 시스템 Yarn Berry는 기존의 깨져 있는 npm 패키지 관리 시스템을 혁신적으로 개선한다. Npm의 문제점 비효율적이고 깨져 있는 부분이 많다

전체 레이아웃 틀 MobileWrapper를 상위 _app.tsx에 적용해야한다. 레이아웃 정렬/배치 모바일/웹을 위한 레이아웃 componenet/common/Layout.tsx 파일에서 공통 Layout 설정

https://dev-gorany.tistory.com/254 https://inpa.tistory.com/entry/%EB%93%9C%EB%9E%98%EA%B7%B8-%EC%95%A4-%EB%93%9C%EB%A1%AD-Drag-Drop-%EA%B8%B0%EB%8A%A