주섬주섬 코딩, 소소하지만 꾸준히 쌓아가는 개발 기록...

기존의 3차에서 썼던 소스를 활용해서 계속 수업을 진행했습니다. 잘 있나 npm run serve를 한 번 해보고 시작합니다. 잘있으면 일단 첫번째로는 인스타에 올릴 때 필터효과를 사용해보도록 하겠습니다. cssgram 을 사용할 것인데요, 전 처음 알았어요 https://una.im/CSSgram/ CSSGram What is This? For more background on CSS Image Effects, you can check out my blog series here, or watch my video from CSS Conf EU, which gives a baseline on blend modes and filters. Simply put, CSSgram is a library for ed..

디자인 패턴은 개발 도중 발생한 문제에 대해 정리하여 각 상황에 맞게 쉽고 간편하게 적용해서 사용할 수 있도록 돕기위한 패턴으로, 수단 중에 하나입니다. MVC 패턴 (Model View Controller) 구성요소를 세가지 역할로 구분한 패턴입니다. 페이지, 데이터 처리, 컨트롤 영역의 3가지 파트를 나누어 담당하게 되면 유지보수성, 확장성, 유연성이 증가합니다. 또한 각 역할의 파트가 정해져있기 때문에 중복코딩이 줄어드므로 효율적입니다. 조작은 Controller로 하며 Model을 통해 데이터를 가져옵니다. 그리고 이것을 바탕으로 View를 제어하여 시각적인 것을 사용자에게 노출합니다. Model 애플리케이션의 정보들을 나타내며 이러한 데이터들의 가공을 책임지는 컴포넌트입니다. 즉, 내부 비즈니스..

02. Rest 파라미터 - 스프레드(Spread) 연산자와 Rest 파라미터 Spread 연산자로 파라미터를 작성한 형태를 Rest 파라미터라고 한다.function(param, paramN, ...rest);const number = [1,2,3]getNum(...number); function getNumt(num1, num2, num3){ console.log(num1, num2, num3); } 결과 값num1 = 1num2 = 2num3 = 3 호출하는 함수의 파라미터에 3개의 값을 쓰고 호출받는 함수의 파라미터를 2개의 값만 썼을 경우 3번째 파라미터 값은 설정되지 않는다.(예제1)이때, rest 파라미터를 사용함으로써 배열 엘리먼트로 저장할 수 있다.(예제2)(예제1) getNum(...[..

01. Spread 연산자 - 스프레드(Spread) 연산자와 Rest 파라미터 iterable object의 element를 하나씩 분리하여 전개한다.iterable 객체는 반복 객체로써 객체의 원소에 하나씩 차례로 접근 가능하다. ' ... ' 점 세개로 시작해서 뒤에 이터러블 오브젝트를 써주면 된다.[...iterableObj]function(...iterableObj){ } 예시let first = [1,2];let last = [9,10];let result = [...first, 3,4,5,6,7,8, ...last]; console.log(result); 결과 값1,2,3,4,5,6,7,8,9,10 ...first를 전개하여 1,2의 값을 result의 배열에 넣어준다.그 후 3~8까지의 숫..