creamymood의 개발 공부 발자취 💭

오~ 리액트 왜 머리 빠진다는지 진심 이해했고 ~ ... 하지만 프로젝트 만큼 날 채찍질 하는건 없어. . 괴롭지만 도움은 킹왕짱 됩니다.. 💗 아직... 디자인이 전혀 없는.. 조금 웃긴.. (ㅋㅋ..,...ㅋㅋㅋ)기능 구현에 우선. 초점을 뒀습니다 :>얼른 프로젝트 마무리 하고,, 수정 하기.... 1단계는리액트, 상태관리는 useState, css는 tailwilnd를 사용하여 구현 했습니다. 👏🏻 알게된 점.1. 더미데이터를 받았는데, 이 json파일은 export할 때 따로 export를 쓰지 않아도 되었다. 2. 리액트 라우터를 사용하려고 보니까, main.jsx 부분에서, strictMode.. 누구세요 ? ,//이렇게 감싸져있는데, 이 스트릭모드가 뭐야 ?→🔒 는 개발 ..

엉엉엉엉 천천히 화이팅리덕스 툴킷은 리덕스를 조금 더 쉽게 사용할 수 있게 만들어진 라이브러리.최근 공식문서에서도 툴킷을 권장한다.1. 리덕스 툴킷 설치 2. 리덕스 툴킷 구성 요소리덕스 툴킷에서는 createSlice를 통해서 액션, 액션 생성자, 리듀서 같이 만들 수 있고store 생성은 configureStore()로 ! 나머지는 동일하다.리덕스 툴킷에서의 새로운 기능, 3-1. createSlice() createSlice() 의 인자로는 "객체" 전달 이 객체 안에는 어떤 상태로 만들지의 상태의 "이름", 상태의 초기값은 어떤것인지, "initial state", 이 상태의 리듀서는 어떤것인지 "reducer"를 객체 형체로 전달. → 이 리듀서 객체 안에는 리덕스의 리듀서에서 스위치문의 비슷..

또 한번 멘붕.같이 공부하시는 동기님이 뒤에 나올 쓰로틀은 더 어렵다고 하셔서우선 리덕스.. 행복해하며 공부해볼게요 ~ 1. 비동기 파트 들어가기 앞서서2. thunk 설명3. thunk 간단 예제Thunk를 사용한 비동기 논리 작성지금까지 우리 애플리케이션의 모든 로직은 동기식이었습니다.액션이 전달되고, 스토어가 리듀서를 실행하고 새 상태를 계산한 후, 디스패치 함수가 종료됩니다. 하지만 JavaScript 언어는 비동기 코드를 작성하는 여러 가지 방법을 제공하며,우리 앱은 일반적으로 API에서 데이터를 가져오는 것과 같은 비동기 로직을 ​​사용합니다.Redux 앱에 이러한 비동기 로직을 ​​넣을 공간이 필요합니다. 썽크는 비동기 로직을 ​​포함할 수 있는 특정 종류의 Redux 함수입니다. 썽크는 다..

진짜.. 리덕스 공부하다가.. 개발자.. 못하겠는데 .. 처음 벽을 느꼈다..... ㅠ (물론 다 어렵지만, 내 기준.. 너모 어려운 상태관리) 할건 너무 많은데.. 진전이 안나가서 더 조급하고.... 힘든 상태 ....... 상태.. (상태 단어 싫어..)하지만.... 또 익숙해지겠지요 ... ?1. 리덕스 설명 및 기본 문법2. 리덕스 데이터 흐름 & 구성 요소 자세한 설명3. 리덕스 쉽게 이해하기4. 리덕스 쉬운 예제 1. 리덕스 설명 및 기본 문법 리덕스란? 리액트에서 **리덕스(Redux)**는 상태 관리 라이브러리로, 애플리케이션의 상태(state)를 효율적으로 관리하기 위해 사용됩니다.리액트 애플리케이션에서 여러 컴포넌트들이 서로 상태를 공유하고,그 상태를 업데이트하거나 사용하는 과정이 복잡..

리액트를 공부하면 할수록 “아.. 자바스크립트를 더 탄탄히 알아야겠구나” 이런 생각의 무한 굴레..React는 JS 기반인데,JS 역시 깊게 공부하진 않았으니까,, 아무리 쌓아도 금방 무너지고, 또 얕게 쌓고 하는 느낌.. 지피티가 정리해준 React를 제대로 이해하려면 꼭 알아야 할 자바스크립트 기초 개념들 ✨ 1. 변수 선언 (let, const, var)const는 상수 (값 재할당 ❌)let은 변수 (값 재할당 ⭕️)var는 거의 안 씀 (호이스팅 문제 등)const name = 'Jane';let age = 30;✨ 2. 함수 선언 방식선언식 / 표현식 / 화살표 함수function sayHi() {} // 선언식const sayHi = function() {}; // 표현식const sayHi..