1\. java 설치(언어) ------------------>TypeScript(언어)->npm명령어2\. 톰캣서버 설치 --------------------->node.js 설치(서버)3\. 이클립스설치 --------------------->Visual Stud
CLI (Command Line Interface 환경)let 변수명=값(변수선언)🎨터미널 창 결과 확인var 변수가 중복선언이 가능하며, 블럭범위 밖에서 참조 가능하다.angular,react에서는 let 권장한다.let 변수는 중복선언이 불가능하고, 블럭범위 밖에
UI 상태 자동 관리 : 화면의 맨 마지막 상태만 관리한다.라이브러리(View 부분만 존재(M,C이 빠져있다.) 내 마음대로 고칠수가 있어서 초보자 입장에서는 불편하다.앵귤러 Framework => 완벽한 개발환경이 구축 => 내용을 넣어주면 편리(초보자)하다. 단,
프로젝트 들어가서yarn startyarn start 실행시 서버오류 발생1.프로젝트 내부에 있는 node_modules폴더,yarn.lock파일 삭제2.myapp2>npm cache clear --force(메모리 해제)3.myapp2>npm install ->pa
props(데이터 변동사용X(저장 목적)->데이터를 전달목적(이벤트처리도 같이)state=>데이터 저장목적으로 사용ex) 클래스 목적(멤버변수에 값을 저장시킬려고)이벤트처리도 같이 처리한다.React.js 어플리케이션을 만들 땐, state를 사용하는 컴포넌트의 갯수를
React Props, State 이해 및 사용법$push를 이용해서 newObj,newObj2 두개를 한 개의 객체를 추가해도 배열형태로 감싸줘야 된다.JSX문법(JavaScript Expression)->내부적으로 js로 변환=>한꺼번에 묶어서 메모리에 로드Webp
🍳전화번호부(이클립스) 🎈3.local >
리덕스(Redux)를 왜 쓸까? 그리고 리덕스를 편하게 사용하기 위한 발악 (i)스토어 : 어플리케이션의 상태값들을 내장디스패치 : 액션을 스토어에 전달디스패치 : 액션을 스토어에 전달하는 것을 의미리듀서 : 상태를 변화시키는 로직이 있는 함수구독 : 스토어 값이 필요
src/components/Counter.js단축키 rsc함수 -> 데이터를 저장 => useState함수를 이용배열의 비구조화를 이용한 변수 초기화 방법useState(초기값) : 초기값을 지정한 변수, 배열에 값을 저장한다.함수를 선언해서 값을 초기화 작업 한다.
✨Angular 와 React의 장점만 가진 프레임워크이다.🎨Vue.js를 사용할 조건Vue ClL는 최소 Node.js 8.9 버전이상을 설치해야 한다. => 13버전(8.11.0 버전을 권장한다.)npm install -g @vue/cli@3.8.4 ->5.0.4
binding(단방향)숫자, 배열,불린, 객체값 전달변경전변경후 매개변수 앞에 v-bind:매개변수명 => 생략형:매개변수명특히 숫자, 객체의 키명을 통한 값전달 -> 반드시 v-bind: 생략(X)생략가능1.화면에 출력하는 부분(template) (reactDOM와
✨main.js에서의 소스코드 변경된 부분기존에 Vue 생성자 함수를 사용하는 대신에, createApp() 함수를 사용한다.더 이상 root Element 로 감싸지 않아도 된다.=>여러개의 태그를 그냥 사용이 가능하다.life cycle의 변경된 메서드beforeD
🍳디렉티브 사용법2 🎈components >### 🎁 Valid.vue 생성 🎁HelloWorld.vue Valid 연결하기 > v-if->조건에 만족하지 않으면 랜더링 안됨->화면에 출력X v-show->랜더링은 되지만 화면에 안보임(화면에 출력X) d
template 추가Vue.js에서의 이벤트 처리방법2형식)v-on:속성명="호출할 함수명"형식2) 태그내부에 data-변수명=저장할 값 or 객체(배열)수정(OK-bind, OK-bind2)script결과 화면OK-bind : 클릭시 콘솔 창OK-bind2 : 마우스
부모컴포넌트--->자식컴포넌트자식-->부모컴포넌트로 데이터를 전송(O)=>Vue <-Angular자식-->부모컴포넌트로 데이터를 전송(X)=>React🎨 Child🎨 Event.vue이벤트 종류명.수식어(prevent)e.preventDefault() 이걸 사
이벤트 버스는 자식컴포넌트 끼리의 데이터 전송방법이다.my-eventBus 프로젝트eventBus라는 뷰객체를 생성서로 다른 컴포넌트끼리 연결(통신)한다.HelloWorld.vue -> EventBus.vue -> HelloWorld2.vue자식컴포넌스 > 이벤트버스
🍳my-router 프로젝트 ✨ 모듈 설치 라우터 기능때문에 설치해야 한다. 🎈라우터 🎁router.js >* src/router.js 요청에 따라서 어떻게 처리해서 페이지를 보여주는지 결정한다. 각각의 컴포넌트를 불러올 컴포넌트와 링크를 걸어준다. > 1. 라
src\\my-axios-dept>npm install axios 엑시오스 설치 => 0.26.x 가장 최신버전🍳