Hexagonal Architecture란? Hexagonal Architecture는 소프트웨어를 구성하는 요소들을 독립적으로 분리하고, 이들을 연결하는 헥사곤 모양의 구조를 가진 아키텍처 스타일이다. 이 아키텍처는 도메인 로직을 비즈니스 규칙으로부터 분리하고, 외부 요소들과의 결합을 최소화하여 독립적인 테스트와 배포를 가능하게 한다. 또한, 도메인 로직을 외부 요소들로부터 보호하여 도메인 로직의 변경이 외부 요소들에게 영향을 주지 않도록 한다. 헥사고날 아키텍처의 주된 아이디어 중 하나는 비즈니스 코드를 기술 코드로부터 분리하는 것 도메인 헥사곤 애플리케이션의 개발을 시작하는 곳 도메인 헥사곤은 비즈니스에 해당하는 도메인로직을 이해하고 모델링하는 영역 애플리케이션의 핵심 로직과 데이터를 포함 도메인 ..

Tags 소문자의 태그()의 경우 HTML 엘리먼트로 인식한다. 대문자로 시작하는 태그(capitalised tag)의 경우는 컴포넌트 인식 Attributes and props 기본적으로 html attributes 는 html 속성으로 동일하게 작동 javascript 표현식도 가능 attribute name과 value name이 같을 경우 단순이 '{name}' 으로 선언도 가능 그외 아래와 같은 Spread attributes 도 사용 가능 '$$props' references all props that are passed to a component '$$restProps' contains only the props which are not declared can't touch this page..

Svelte 컴포넌트의 기본적인 구조는 아래와 같다. '.svelte' 확장자를 사용해서 파일을 컴포넌트를 정의할 수 있다. Component Format (기본 골격) script 영역 'import' 구문을 통해서 .svelte 확장자의 다른 컴포넌트를 불러와서 사용할 수 있다. 'let' 키워드를 통한 State 값을 선언하여 변수를 선언한다. click array 를 활용하는 방법 위의 코드에서 'count = count + 1;'와 같이 상태값을 재할당하는 방식으로 갱신하는 것처럼 배열에서도 .push(), .splice() 사용이후에 자동으로 업데이트 되지 않으므로 재할당이 필요하다. 'arr = arr' 또는 스프레드 연산자를 사용하여 재할당 한다. 'export' 키워드를 사용한 Props..

Vue보도 조금 늦게 나온 프론트엔드 프레임워크. 2019년 3버전이 나온 이후 관심을 받음 "Frameworks without the framework"? Svelte의 장점 Write less code Svelte의 상태값은 특별한 규칙을 만들기보다 자바스크립트 변수 선언을 하는 것이 전부 Svelte 코드 {a} + {b} = {a + b} React 코드 import React, { useState } from 'react'; export default () => { const [a, setA] = useState(1); const [b, setB] = useState(2); function handleChangeA(event) { setA(+event.target.value); } functio..

배열 연관된 값들의 집합 배열을 생성하고 각원소를 조작하는 방법 for(), foreach()를 사용하여 배열 원소를 순회하는 방법 배열을 문자열, 문자열을 배열로 바꾸는 implode(), explode() 함수 배열의 정렬에 대한 방법 다차원 배열에 조작 방법 배열 기초 배열은 원소들로 이루어짐, 각 원소에는 키(key)와값(value)으로 지정 배열의 각 키는 오직 하나의 원소와 연결 (참고) 스칼라는 숫자, 텍스트 조각, 참, 거짓과 같은 단일 값을 이르는 용어, 배열처럼 다양한 값을 담을 수 있는 복잡한 자료형은 스칼라가 아님 배열 생성 배열을 생성하려면 array() 라는 구조 사용 //ex) 배열 생성하기 $vegetables = array('corn' => '노랑&#3..