적자 생존 (Write, Survive!)

스타일 역시 바인딩으로 처리할 수 있다.코드 예시로 알아보자. (예제가 길어서 생략하여 첨부하였다.)1. HTML의 스타일 적용기존의 HTML의 스타일 적용클래스명, 속성명 지정시 케밥 표기법으로 적용 (kebab-style)JavaScript 표현식에서는 ‘-’ 표기가 연산자이므로 사용할 수 없음.→ 케밥 대신에 카멜 표기법을 사용 (camelStyle)인라인 스타일v-bind:style = :style데이터 속성에 자바스크립트 객체로 작성 객체 형태로 스타일 지정테스트... 마우스 이벤트로 동적 스타일 변경테스트...2. CSS 클래스 바인딩v-bind:class = "...” = :class=”..."클래스명 문자열을 바인딩하는 방법true/false 값을 가진 객체를 바인딩 하는 방법문자열로 클래..

이벤트 처리는 재밌지만 꽤 어렵다고 느껴지는 것 같다.1 .인라인 이벤트 처리v-on 디렉티브를 이용. → @으로 줄여쓸 수 있음v-on:[이벤트이름]=”표현식” → @event=”” : 이벤트에는 click과 같이 이벤트명을 넣는다.인라인 이벤트로 처리하면 $event를 사용여러 기능을 인라인 이벤트로 모두 작성하기 힘듬→ 컴포넌트 인스턴스에 등록한 메소드를 이벤트 처리 함수로 사용할 수 있음.이벤트 핸들러 메서드Vue 인스턴스의 methods 속성에 정의한 함수를 이벤트 처리 함수로 연결 카운터: {{ count }} +1 증가 두 개의 메서드가 존재하고, 두 개의 메서드를 모두 호출하고 싶을 때두 개의 핸들러 실행 2. 이벤트 객체메서드의 첫 번째 인자로 이벤트 객체 e를 전달받을 ..

애플리케이션 인스턴스 : vue.createApp메서드를 호출하여 만들어진 객체 옵션 객체 : Vue 인스턴스를 생성할 때 전달하는 속성들을 담은 객체 (name, data옵션) 루트 인스턴스 : DOM 트리에 마운트되어야 화면으로 렌더링 (vm) 1. Data 옵션: 컴포넌트가 관리하고 추적해야 할 데이터를 등록할 때 사용 관리와 추적 → 변경을 탐지하고 추적하여 화면을 갱신 반드시 객체를 리턴하는 함수로 부여되어야 함. 초기 문자를 사용할 때, 특수문자를 사용하면 안된다.→ 특히, $로 시작하는 이름은 인스턴스 내부에서 특별한 용도이기 때문에 $,_로 시작하면 안됨.2. 계산된 속성(Computed Property): data나 다른 속성이 변경될 때 함수가 실행되어(계산된) 저장된 캐싱된 값 함수의..

백엔드 프로그래밍 언어인 java를 사용하기 위해서는 Openjdk를 설치해야 한다.쉽게쉽게 설치를 진행해보자!1. Homebrewbrew 명령어를 사용하기 위해서 Homebrew를 먼저 설치해야한다.https://brew.sh/ko/ HomebrewThe Missing Package Manager for macOS (or Linux).brew.sh Homebrew 설치 명령어/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" 설치 오류메시지Warning: /opt/homebrew/bin is not in your PATH. Instructions on how to configure ..

템플릿 문법은 Vue의 핵심 개념 중 하나이다.Vue의 반응형 구조에서 기초 디렉티브와 데이터 바인딩은 중요한 개념이다.1.  보간법(Interpolation)모델을 통해 데이터를 불러와서 HTML 영역에 템플릿으로 표현하는 방법즉 ,데이터를 화면에 출력하는 가장 기본적인 방식이다. vue app 인스턴스에 model 객체를 등록하는데 보간법은 데이터를 DOM에 반영할 수 있게 해준다.이중 중괄호 {{ }} 를 사용하여 표현한다.2개의 중괄호가 콧수염을 닮았다고 해서 다른 말로 콧수염 표현식(Mustache Expression) 이라고도 한다.2. 기본 디렉티브Vue 디렉티브는 템플릿 안에 사용하는 v- 로 시작하는 속성으로, HTML 요소와 관련된 작업을 지정할 수 있다.v-text, v-html 디렉..

기술 블로그의 첫 공부 내용은 vue.js이다.HTML과 CSS를 먼저 올리고 싶었는데 진도가 너무 빨라 Vue.js의 복습을 위해서 vue부터 시작하고자 한다.1. Vue.jsVue.js란 웹 화면 작성에 최적화된 프레임워크이다.다른 프레임워크에 비해 유연하고 가볍다.전체 아키텍처를 새롭게 구성할 필요 없이 기존 웹 애플리케이션의 일부 UI화면만 적용하는 것이 가능하다.SPA(Single Page Application) 단일 페이지 애플리케이션 아키텍처 구성을 위한 라우터(Router) 기능도 지원한다.vue를 쓰는 이유 : 데이터가 바뀌면 화면이 바뀐다.vue는 mvvm 패턴을 따른다.MVVM 패턴(Model-View-ViewModel) : 애플리케이션 로직과 UI의 분리를 위해 설계된 패턴View ..

대학교 4년을 마치고내 실력으로는 당장 취업이 힘들 것 같아서더 실력을 갈고 닦고자 개발 블로그를 운영하기로 결심했다.  우선 나의 전공은 "바이오메디컬공학" 이지만,  medical image 분야가 나와는 맞지 않았고그나마 데이터를 다루는 수업이 흥미가 있어 데이터 관련 직군으로 취업을 해야겠다고 생각이 들었다. 그래서 관련 공부를 하기로 마음을 먹었다! 블로그 이름이 적자 생존인 이유지인들에게 단톡방에다가 블로그 이름을 추천 받았다.그 중에서 적자 = 쓰자, 그리고 취업 경쟁에서 생존 그리고 기존 의미처럼 나도 환경에 적응하여 최종적으로 생존하는 의미가 마음에 들었다.블로그 이름처럼 계속 공부한 것들은 적어서 취업에 성공하고 싶다. 최종 목표블로그 말고도 나의 2025 다짐이 있다.차곡차곡 단단히 ..