본문 바로가기

내일배움캠프 TIL93

2023-12-15 본캠프 52일차 / 71일차 TIL 2023-12-15 본캠프 52일차 / 71일차 TIL 주요 진행사항 - 개인과제 진행 개인과제 진행 - level 5 개인과제의 마지막 단계인 level5를 진행하였다. level5는 typescript와 react-query를 사용한다. react-query의 사용 (v5 기준) 1. useMutation const addMutation = useMutation({ mutationFn: addTodoHandle, onSuccess: () => { queryClient.invalidateQueries({ queryKey: ['toDoData'] }); } }); useMutation은 CRUD에서 CUD에 해당하는 기능으로 기존에 가져온 데이터를 수정하는데 사용된다. react-query의 장점이 여기.. 2023. 12. 18.
2023-12-14 본캠프 51일차 / 70일차 TIL 2023-12-14 본캠프 51일차 / 70일차 TIL 주요 진행사항 - 개인과제 진행 개인과제 진행 - TypeScript 리덕스 툴킷 세팅 1. config 파일 import { configureStore } from '@reduxjs/toolkit'; import AlertSlice from './modules/AlertSlice'; import LoadingSlice from './modules/LoadingSlice'; const store = configureStore({ reducer: { AlertSlice, LoadingSlice } }); export type RootState = ReturnType; export type AppDispatch = typeof store.dispatch.. 2023. 12. 18.
2023-12-13 본캠프 50일차 / 69일차 TIL 2023-12-13 본캠프 50일차 / 69일차 TIL 타입스크립트 개념 공부 우아한 타입스크립트 with 리액트 자바스크립트의 한계 1. 동적 타입언어 자바스크립트 특징 중 하나가 동적 타입 언어라는 점이다. 이 말은 변수에 타입을 명시적으로 지정하지 않고 코드가 실행되는 런타임에 변수값이 할당될 때 해당 값의 타입에 따라 변수 타입이 결정된다는 것을 의미한다. 예를 들어 변수 a의 타입이 number인지 string인지는 실제 코드가 동작하는 런타임에 결정된다. 2. 동적 타이핑 시스템의 한계 const sumNumber = (a,b) =>{ return a+b; }; sumNumber(1, 2); // 3 sumNumber(100); // NaN sumNumber("a","b") // ab 위 코드.. 2023. 12. 14.
2023-12-12 본캠프 49일차 / 68일차 TIL 2023-12-12 본캠프 49일차 / 68일차 TIL 주요 진행사항 - 타입스크립트 강의 및 개인 과제 발제 타입스크립트 개인과제 - level 1 정리 개인 과제 주제 : TypeScript를 활용한 To-do List 제작 프로젝트 과제 : 1. 기본적인 CRUD 구현 2. level1 부터 level5 까지 실력에 따른 유독적인 과제 수행 오늘부터 타입스크립트를 처음 배우게 되었다. 기본적으로 알고 있던 사실은 javascript에 type을 지정해 주면서 좀더 엄격한 프로그래밍을 도와준다는 것이였다. 완전히 처음 배우는 언어이기 때문에 강의를 들으며 1단계부터 5단계 과제를 순차적으로 진행할 예정이다. 1. level 1 (props drilling) level 1은 기본적인 props dril.. 2023. 12. 14.
2023-12-11 본캠프 48일차 / 67일차 TIL 2023-12-11 본캠프 48일차 / 67일차 TIL 주요 진행사항 - 아웃소싱 프로젝트 회고 아웃소싱 프로젝트 KPT 회고 1. 프로젝트 정보 프로젝트 명 : MUCATION 주제 : 위치 기반 음악 공유 앱 github : https://github.com/eunbime/mucation-project GitHub - eunbime/mucation-project Contribute to eunbime/mucation-project development by creating an account on GitHub. github.com DEMO : https://mucation-project.vercel.app/ MUCATION mucation-project.vercel.app KPT 회고 Keep - 현.. 2023. 12. 14.
2023-12-08 본캠프 47일차 / 66일차 TIL 2023-12-08 본캠프 47일차 / 66일차 TIL 주요 진행사항 - 아웃소싱 프로젝트 아웃소싱 프로젝트 - 커스텀 alert/confirm 구현 이번 프로젝트에서는 ux를 고려하여 커스텀 alert와 confirm을 구현하고자 하였다. 사실 alert는 문제가 없었지만 confirm을 만드는데 고려해야할 점이 몇가지 있었다. confirm은 취소/ 확인 버튼이 있으며, 취소버튼을 눌렀을 때는 아무 동작도 진행되지 않으며, 확인버튼을 클릭했을 때는 다음동작일 실행한다. 즉, confirm은 어떤 동작이 올지 예측되지 않기 때문에 클릭할 때 까지 동작을 기다려야한다는 것이다. 이러한 점 때문에 confirm 모달에 대한 로직은 비동기 처리를 해야만 했다. 1. 비동기 처리의 이해 비동기 처리를 하기 위.. 2023. 12. 14.