솔적솔적

안녕하세요, 현재, 팀원들과 vue3 프로젝트에서 React18, next13버전으로 변경하여 리액트를 사용하기로했고, 프로젝트 초기셋팅 시점에 ESLint와 prettier를 통일해서 셋팅하기로했고 오늘은 제목그대로 ESLint 세팅 시 내가 어떤 설정을 적용한건지 하나씩 상세히 확인해보는 시간을 가져보려합니다. 오늘의 목표🥸 - 1. ESLint란 무엇인지 알기 - 2. ESLint 규칙 - 3. ESLint를 프로젝트에 설정하는 방법 - 4. ESLint가 제대로 작동되는지 확인해보기 입니다. 그럼 긴 말 필요 없이~ 같이 바로 쑝~ 1. ESLint란 무엇인가 - ESLint는 오픈소스 자바스크립트 및 타입스크립트 코드 정적 분석 도구. 그럼 왜 사용해야하나? 왜 설정하는거야? - 코드 일관성 유..

안녕하세요. 저는 이번에 패스트 캠퍼스로 웹퍼블리싱을 학습했었는데요, 패스트캠퍼스에 현재도 올라와있는 강의패키지 중 하나입니다. 강의 타이틀은 [패스트캠퍼스] 웹퍼블리싱 완전 정복 : 모션 디자인으로 완성하는 반응형 웹 디자인 웹퍼블리싱 이며 사용자가 스크롤할 때, 클릭할 때와 같은 상황에서 좀 더 재미를 줄 수 있는 UI를 만들고 싶어, 강의를 듣게되었습니다. 그중에서 제일 재밌게 배웠던 것 중 하나를 같이 공유하며 학습일지를 쓰기 위해 끄적끄적해보려 해요! 학습일지의 내용으로 가져오려 했던 것은 바로 마우스 커서를 커스텀하는 방법 먼저 css의 커서는 요소위에 마우스를 올릴 때 hover 시 커서 모양을 변경합니다. 커서 속성은 요소를 가리킬 때 커서로 나타낼 타입을 정의하는 데에 사용하는 속성입니다..

목표 1. 개발환경 셋팅 2. Vue 프로젝트 생성 1. node.js 부터 설치 2. 최신버전이 아니면 에러가 날 수 있기 때문에 가능하면 최신버전으로 다운받아놓기 3. vsCode 에디터 설치 에디터설치가 완료된다면 터미널을 열어서 npm install -g @vue/cli 4. 에디터 부가기능 설치 - vetur 설치 - html css support - Vue 3 Snippets 개발환경 셋팅 끝! 근데 만약 터미널에 빨간에러가 뜬다면 "허가되지 않은 스크립트 입니다~" 그런 에러가 뜨는 경우 => 윈도우 검색메뉴 - Powershell 검색 - 우클릭 - 관리자 권한으로 실행 후 Set-ExecutionPolicy Unrestricted입력해보기

뷰말고도 리액트, 앵귤러도 똑같이 웹앱을 만들 수 있다. 리액트를 사용하는 개발자가 많은데 왜 뷰를 사용할까? 1. 쉽다.. 뷰.js를 쓰는 이유는 쉽다는 것. 그러면 기능이 떨어지는 거아니냐? 아니다. 다 똑같은 결과물을 낼 수 있고 그 만드는 과정이 쉽다는 것이다. React의 state변경, for변경, if 사용들을 보면 알 수 있다. 2. 개발할 때 방법이 정해져있다는 것 HTML을 내가 반복적으로 여러개 생성하고 싶다면? 리액트로는 map을 사용할지, forEach를 사용할지, 그냥 일반 for을 사용할지 반복문을 컴포넌트 render()바깥에서 사용할지 안에서 사용할지 자율적으로 판단하여 사용할 수 있다. vue.js는 그렇지 않다. html 여러개를 생성하고 싶다면 이 v-for만 사용하면..