전체 글143 2023-12-20 본캠프 55일차 / 74일차 TIL 2023-12-20 본캠프 55일차 / 74일차 TIL 주요진행사항 - next.js 튜토리얼 next.js 튜토리얼 next.js Styling 공식문서에서 권장하는 styling 방식은 tailwind나 css modules 이다. 그중에서 tailwind에서 대해서 알아보겠다. tailwind 1) root css 파일을 만든다 상단에 다음과 같이 tailwind를 사용하기 위해서 import 한다. /*global.css*/ @import 'tailwindcss/base'; @import 'tailwindcss/components'; @import 'tailwindcss/utilities'; 2) PostCSS 설정 // postcss.config.js module.exports = { plugi.. 2023. 12. 20. 2023-12-19 본캠프 54일차 / 73일차 TIL 주요진행사항 - typescript 강의 수강 typescript 강의수강 1. 타입스크립트의 타입 - number - string - boolean - object - array - tuple - enum - any 자바스크립트는 동적타입 사용 (런타임에 변경가능) 타입스크립트는 정적타입 사용 (런타임에 변경불가) 타입스크립트는 자바스크립트보다 더 많은 타입을 가지고 있다. 따라서 타입스크립트는 더 강력한 타입 지정이 가능하다. * 타입스크립트의 주요 원시 타입은 모두 소문자 타입스크립트의 타입추론 내장기능 상수나 변수에 어떤타입을 사용하였는지 추론 가능 따라서 다음과 두 코드는 같은 코드이다. const number1:number =1; const number1 = 1; 허나 최초 값의 초기화가 되지.. 2023. 12. 19. 2023-12-18 본캠프 53일차 / 72일차 TIL 2023-12-18 본캠프 53일차 / 72일차 TIL 주요 진행사항 - next.js 강의 지급 - next.js 특강 next js 특강 1. next를 왜 사용해야하는가 1. 압도적으로 편리하다. 문서정리가 잘되어있다 (Docs) 튜토리얼 내용이 좋다 공식문서만 공부해도 시작하는데 별 무리가 없다 2. 다수의 회사에서 next.js를 할 줄 아는 사람을 뽑는다. (뭔가 엄청 많이 뽑는것같지는 않음) 3. react/vue/angular 중 react가 가장 많은 점유율을 가지고 있다. SSR (server side rendering) = gatsby next nuxt(vue) remix 중 next가 가장 많은 점유율 4. CRA 더이상 지원을 안한다. (마지막 업데이트 2년전 / 업데이트를 안한다.. 2023. 12. 18. 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. 이전 1 2 3 4 5 6 7 8 ··· 24 다음
