본문 바로가기

전체 글51

[React] Day_38 데일리 정리 이덕수가 싫은 림졍은그를 때려눕히기 위해 오늘도 열심히 내공 다지는중... (는 강의정리하면서 내공냠냠중이죠?)강의 정리 지지이이이인짜 얼마 안남았으니 언능 빠르게 가보자구요라쯔고.  React (리액트) 강의 정리 - 숙련 ver. (이이이어이서)이덕수 내공냠냠  Redux 기반 TodoList 만들기기초 뼈대// src > redux > moduels > todos.js// Reducerconst todos = () => {};export default todos; 나머지는.. 저번처럼 하면 됩니다. 어때요, 참 쉽죠? (ft. 밥아저씨)[ src > redux > modules > todos.js ]// Action valueconst ADD_TODO = "ADD_TODO";const DELETE_.. 2024. 11. 11.
[React] Day_37 데일리 정리 포깟몬 프로젝트를 어쩌다보니 useContext까지 끝내버린 림졍.학구열이 갑작스럽게 높아진(?) 그녀는 자기도 모르게 TIL를 써버리게 되었는데...(실은 오블완 챌린지 다 해치우고.. 싶달까..? 후후..)빠르게 가시죠. 일단 고.  React (리액트) 강의 정리 - 숙련 ver. (이이이어서)리덕스... 리덕수... 이덕수씨...!!!!  redux 흐름  View 에서 액션 발생dispatch action 발생reducer 실행(by action) 전, middleware 작동middleware 에서 명령 수행 후, reducer 함수 실행 (3, 4번은 아직 몰라도 된다!)reducer 실행결과, store에 새로운 값으로 저장store의 state, subscribe 하고 있던 UI에 변경된.. 2024. 11. 10.
쉬어가는 TIME - 개인과제 중간점검(?) (feat. 꿀팁) 조금 멍청하게 코딩하는 거 같은 느낌이 들어작성해보는 몇가지 꿀팁과 기타 등등... 조금 적어보고자 한다 11 / 9 - Props Drilling 구현 완료터미널에서 간단하게 생성하는 법 (VsCode 구우우욷이 들어가지 않아도 되는 방법임)pwdcd 파일경로(림졍의 경우 Desktop/React)yarn create vite 파일명 --template react  결과는 어떻게 나오냐구요?폴더 변경 실은 저기서 해도 되긴 함 ㅇㅇ근데 폴더 열려있는 상태에서 하면 안됨. 매우 곤란.  개인과제 파일구조 개인과제 구현은 대애충 단계별로 나누면 아래와 같다1단계 props drilling2단계 context로 관리3단계 이덕수 (Redux입니다) 그래서 일단 1-2단계를 위한 파일구조를 대충 짜본 모습.... 2024. 11. 9.
[React] Day_36 데일리 정리 스낀다드에서 성장한 림졍! 그녀의 첫 챌린지반 후기는요? 챌린지반의 장점 : 어라라 하더니 갑자기 TIL이 뚝-딱 만들어지는 매애애애애애zic ⭐️(그렇다고 강의정리 안한다는거 아님. 개인과제도 안 한다는 거 아님)챌린지반의 단점 : .. 이걸 이해하는데 조오큼(?)의 시간이 걸림. 뭐 여튼 오랜만에 과제 같은걸 하니 학부시절 돌아간 거 같고 재밌네요 ^-^여튼 정리 한 건 아까우니까.. 오늘 TIL은 이 친구로 어디 한번 써내려 보도록 하죠 라쯔고.  챌린지반 스터디 정리 - 반응형 effects 의 생애주기음... 다음에는 그냥 한국어 대신 원서를 봐야겠당 ^-^..Introeffects는 컴포넌트와 다른 생명주기를 가짐. (알아두자.)컴포넌트, 마운트, 업데이트 or 언마운트 가능cf. 용어정리마운.. 2024. 11. 8.
[React] Day_35 데일리 정리 네.. 오늘은 새로운 친구랑 함께하는 림졍입니둥.일단 후기요? 너무 좋아요.일단 백틱이 너무나도 잘되구요. 타건감은 말해뭐혀.무엇보다 손꾸락에 느껴지는 피로도도 조금 많이 줄어든 느낌?(이래서 다들 키보드에 돈을 많이 쓰는군요.. 이제서야 알았습니다)여튼 오늘도 빠르게 강의내용 정리좀 해보겠습니다.가시죠.  React (리액트) 강의 정리 - 숙련 ver. (이이이어서)리덕스를 너무나도 우습게 보았다.. 큰났네 이거 🤦🏻‍♂️  Custom Hooks컴포넌트에서 구현해온 useState & 핸들러, 추출해서 따로 빼놓은 것 - input 갯수만큼 늘어나는 useState, event handler[src/App.jsx]//input 구현 + useState로 각 input value 관리하는 코오드... 2024. 11. 7.
[React] Day_34 데일리 정리 라이브 코딩을 라이브두통이라고 적고만성두통을 만성코딩으로 적는...상태 이상...이 걸려버린 림졍.결국 조퇴를 하고 쉬었다가.. 왔는데요...노올랍게도 출석은 제대로 찍었는데... 강의실을 나가지 않아서다들 출석한줄 알고 전화오고 어디냐고... 웅성웅성...(저는 죽어있었는데요... 이게무슨일이지... ㅇ_ㅇ)여튼 그렇게 죽다 살아나서 적어보는 TIL가보자ㄱh.   React (리액트) 강의 정리 - 숙련 ver. (이이어서)내일까지 적겠네요. 에휴    memoization 리-렌더링의 발생 조건컴포넌트에서 state가 바뀌었을 때컴포넌트가 내려받은 props가 변경되었을 때부모 컴포넌트가 리-렌더링 된 경우엔 모든 자식 컴포넌트. 최적화 리액트에서 리렌더링이 자주 발생한다 = 비효율적인 코드∴ 발생하.. 2024. 11. 6.
[React] Day_33 데일리 정리 나 림졍, 난관에 봉차크하다. 그거슨 바로 스딴다드.. 타임어따끄.(아니 만들었던 과제를 왜 다시 1시간만에 만들어;)강의도 듣고 정리도 하고 실습도 하고 이걸 언제 다 하라는건지..^^ 아오까라면 까야죠 뭐.. 가보자고.   React (리액트) 강의 정리 - 숙련 ver. (이어서)aㅏ. 정말 하기싫네.    useRefuseRef : 특정 값을 저장하기 위해 사용함. import 해서 사용 (얘도 React에서 제공하는 훅이라.)특징 : 값 유지(리렌더링과 무관), 컴포넌트 리렌더링 시, 초기화되지 않는 변수 생성==> 변수 유지 or DOM API(in JS) 사용없이 DOM 요소에 직접 접근할 때 사용 - 예시 (변경 전)import "./App.css";import { useRef } from.. 2024. 11. 5.
[React] Day_32 데일리 정리 상꼬롬(?)한 월요일임니다 여러분.오늘도 강의듣다가 지친 림졍, 인사올립니다.부운명... 주말에 주기로 하셨던 강의는오늘 업로드가 되어 우다다다 듣기 시작했고..요 (결론 : 합법적 변명 쌉가능.)특강 듣다가 코드 타임어택이라는 엄청난 이벤트에 오열도 좀 하구요...좀.. 할게 많네요. 레쯔고.  React (리액트) 강의 정리 - 숙련 ver.분명 주차는 1개인데... 시간은 2주치랑 똑같은뎁쇼..?  Styled- Components CSS-in-JS CSS코드, JS(JavaScript) 활용하여 작성, 컴포넌트 꾸며줌, 조건문, 변수 등 다양한 로직 이용 가능 (이제 꾸밀 때 css만들어서 import하고... 각 태그마다 classname을 안넣어도 되는 시대야.)벗-뜨 작성하려면 패키지 필요,.. 2024. 11. 4.
[React] Day_31 개인 프로젝트 후기 드으디어 리액트 프로작뜨 완.CSS..는 그래도 할만 했으나 문제는.. 말.. 안해도 아는 그놈의.. 껌...뽀...난..뚜..((아니 export만 잘하면 된다는데... 난 그것도 못하는 바보가 되었다고.. 흑흑))  네.. 이번 프로젝트는요 무려 마감 1시간 전 즈음에.. 급하게 끝냈습니다..요.. 네...이게 진정한 미룬이가 아닐까... (아니. 난 J인데.. 이젠.. J호소인이 된걸까... 흑흑)이번에도 솔직히 뭐 적을건 없구요...네... 그냥 밑에 정리할게요. 시작.  개인 프로젝트 변경사항 정리  -  명심해, 자체 하드코어 모드는 생각보다 어어어어엄청나다는걸. 변경사항 in src - 컴포넌트 재구조화   기능을 우선 진짜 댕강댕강 나눈 다음,정말 우여곡절끝에(?) 우선 처음 나누었던 부분.. 2024. 11. 1.