본문 바로가기

Front-end

ESLint? Javascript 코드에서 발견된 문제 패턴을 식별하기 위한 정적 코드 분석 도구 코딩 스타일 문제와 코드 품질 모두 제어해주고 규칙을 정의할 수 있다. 주로 하드코딩에서 문법적으로 문제가 있는 코드를 Lint 해주기 위해서만 사용하는 분석도구이므로 설치 시, 의존성 라이브러리에 위치한다. Installation $> yarn add --dev eslint eslint-config-airbnb-base eslint-import-resolver-webpack eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react eslint-plugin-react-hooks eslint ESLint 그 주체이다. Coding Convention Guide를 사용.. 더보기
[Javascript - Nuxt.js] Nuxt.js 상태관리 사이클 요약설명 1. state - 모델 생성 및 모델 값 초기화 - vue components로 rendering 2. vue components - 특정 이벤트를 실행하여 actions로 dispatch 3. actions - dispatch된 actions은 backend의 api를 axios로 응답 - 응답은 post, get, put, delete - axios로 받아온 결과값은 view업데이트를 위한 mutations로 commit 4. mutations - commit된 mutations는 state를 변경하여 view를 업데이트 세부설명 vuex는 이용한 vue.js의 상태관리 라이브러리로 모든 컴포넌트에 대한 중앙 집중식 저장소 역할을 하며, 의도적인 방법으로 상태를 변경 및 관리할 수 있다. .. 더보기
[Javascript] Javascript 기초 Javascript가 뭔가요? Javascript란, 웹 페이지상에서 정적인 부분을 동적으로 변화시켜주는 스크립트 또는 프로그래밍 언어다. HTML이 웹 페이지의 내용 그러니까, 이미지, 제목, 표, 사진과 영상 등을 보여주고, CSS가 구조화된 HTML의 디자인 등의 레이아웃을 지정하면, Javascript는 그들을 동적으로 바꿔주는 역할을 한다. 정적인 웹 페이지는 HTML, CSS만으로도 충분하지만, 좀 더 웹 페이지의 목적과 구조에 맞게 구성하기 위해선 Javascript는 필수이다. 예제를 하나 들어보자면, 누르면 나와 눌러봐! 결과 누르면 나와 눌러봐! 여기에 CSS를 입힌다. CSS 기초에서 했었던 class를 쓰겠다. .click-button { color: #3DAEF8; backgrou.. 더보기

728x90