본문 바로가기

전체 글400

리액트 심화 강의 복습 / redux-toolkit , json-server, thunk , Axios >> 리덕스-툴킷 yarn add react-redux @reduxjs/toolkit 리덕스-툴킷에 slice 있음 (slice는 액션, 액션크리에이터, 리듀서를 동시에 함) // src/redux/modules/counterSlice.js // 액션벨류나 엑션크리에이터를 사용한 부분이 없어졌다(일반 리덕스랑 달리) import { createSlice } from "@reduxjs/toolkit"; const initialState = { number: 0, }; // 리덕스툴킷의 슬라이스 : 액션벨류,엑션크리에이터,리듀서가 합쳐짐 // createSlice라는 api를 통해 만들 수 있다. // createSlice의 인자로는 모듈의 이름, 그 모듈의 초기상태값, 모듈의 리듀서 로직이 인자로 들어감 .. 2022. 12. 23.
[TIL] 오늘의 개발일지 / 프로젝트 발제 ! 오늘의 한 일 - 프로젝트 발제 - 프로젝트 아이디어 회의 (피그마, S.A 작성) - 프로젝트 기능 나누기 ( 나는 게시물 CRUD 쪽을 맡게 되었다) - 리액트 심화강의 ( 리덕스 툴킷, Axios , Thunk 복습) 오늘은 오전에 프로젝트 발제가 있었다 발제 듣고나서도 어떻게 기능구현해야할지 막막하다는 생각밖에 안들었는데, 오늘 조원분들과 아이디어를 내고 회의를 하면서 어떻게 구현을 할지 얘기를 하면서 마냥 흐리게만 보였던 프로젝트가 조금은 틀이 갖추어지는 듯한 느낌이 들었다. 오늘 정말 다시 한번 느꼈던건 함께 공부를 하는 동료들이 있는게 얼마나 감사한 일이며, 주변에 물어보고 도움을 받을 수 있는 사람이 이렇게 많이 있다는 게 얼마나 큰 복인가 하는 생각이 들었다. 특히, 리액트 심화주차에서 .. 2022. 12. 22.
[TIL] 오늘의 개발일지 오늘은 어제에 이어서 리액트 훅 강의를 마무리하고, 리덕스 강의를 이어서 들었다. 아직까지는 너무 어렵게만 느껴지고 당장 내일이 프로젝트인데 내가 할 수 있는게 뭐지? 라는 생각이 들지만 내가 할 수 있는건 프로젝트 시작 전까지 계속 끊임없이 친숙해지려고 들여다보는 거 밖에 없는 것 같다 어제 처음 본 친구가 오늘은 좀 덜 낯설고, 자주 보면 편한 사이가 되는 것처럼 리액트랑 리덕스도 꼭 나랑 그런 사이가 될거라고 믿는다 일방적인 짝사랑이라도 죠ㅇr....4랑해쥴 ㄲ ㅔ.... 어떤 공부이던 그 공부에 흥미를 느끼기 전까진 견뎌야만 하는 힘든 언덕들이 있는 것 같당 그 언덕을 올라야 기쁨을 느낄 수 있는 법!! 지금의 내가 딱 그 힘든 언덕을 올라가는 길인것 같다 이걸 견뎌내야 재밌어지는 날이 올테징 뭐.. 2022. 12. 21.
[React] 컴포넌트의 라이프 싸이클 컴포넌트 라이프사이클 1) initialization —setup props and state 2) Mounting —componentWillMount —render —componentDidMount 3) Updation : props나 state가 바뀜을 의미 (⇒랜더 메소드 다시 실행) —1) props : componentWillReceiveProps → shouldComponentUpdate → componentWillUpdate → render → componentDidUpdate —2)states : shouldComponentUpdate → componentWillUpdate → render → componentDidUpdate **shouldComponentUpdate : true거나 fa.. 2022. 12. 21.
[TIL] 오늘의 개발일지 오늘은 패스트캠퍼스 리액트 강의를 들었다 강의를 들으면서 더더욱 느낀게, 부트캠프에서 제공된 강의는 중요한 내용들을 생략한 것도 많고 아무 기초지식이 없는 사람이 듣기엔 무리가 맞았다는 걸 느꼈다. 하다못해 리액트에서 createElement를 html코드로 쓸 수 있게 하는 jsx 문법을 해석해주는 것이 바벨이라는 것을 패스트캠퍼스 강의보고 알았다고 하면 너무한 거 아닌가... 실망스러운 부분은 실망스러운거고, 지금이라도 꼼꼼한 설명이 되어있는 강의를 보면서 리액트를 좀 더 제대로 습득해서 심화강의를 다시 들으면, 이해가 잘 될 것이라고 생각한다. 오늘은 오전부터 진짜 알차게 정리도 하면서 공부했는데, 아래에다 남기기!! https://warn-code.tistory.com/194 구조분해할당과 Nam.. 2022. 12. 20.
리액트는 왜 쓰며, 리액트와 vue와 angular의 차이 REACT vue는 두마리 토끼 다 잡으려하는거고, angular는 내가 모든 걸 해줄게 리액트는 뷰랑 랜더링하는거에만 관심있음 HTML태그들은 , 이미 정해져있는 거지만, 리액트에서 ‘컴포넌트’는 이 태그들을 내가 직접 만든다고 생각하면 됌(css,js,html이 접목된 나만의 태그) 리액트 전까지는 실제 돔을 움직였는데, 리액트는 가상 돔트리를 사용 → 가상의 돔을 가지고 있고, a상태의 벌츄어 돔과 b상태의 벌츄어 돔 상태를 비교해서 바뀐 부분만 찾아내서 바꿔주는 것 CSR vs SSR Client Side Rendering : 기본적으로는 클라이언트사이드랜더링으로 간다. 리액트는 자바스크립트로 이루어진 하나의 커다란 웹어플리케이션이고, js가 모두 다운이 받아져야 리액트가 작동하게 된다. html.. 2022. 12. 20.