방문해 주셔서 감사합니다! 항상 행복하세요! - 문의사항은 메일 또는 댓글로 언제든 연락주세요. - "해줘","답 내놔" 같은 질문은 답변드리지 않습니다. - 메일주소 : lts06069@naver.com 앵귤러 튜토리얼37 앵귤러 튜토리얼(Angular tutorial) - 35 : 프록시(proxy) 이번 시간에는 개발과 관련된 프록시(proxy)라는 주제로 살펴보려 합니다. 프록시의 기본 의미는 간접, 대신 의 의미로 무언가 대신하여 주는 기능을 의미 합니다. 이번에 소개할 앵귤러에서의 프록시는 프로젝트 개발 중 에서 다른 서버와의 연동을 의미 합니다. 앵귤러 프로젝트는 순수 클라이언트 언어로 구성되어 있습니다. * 조금 더 상세한 구성을 알고 싶으면 아래 링크를 통해 확인하여 주세요. lts0606.tistory.com/329 앵귤러 튜토리얼(Angular tutorial) - 2 : 구성 앵귤러 환경구성은 문제없이 잘 끝내셨는지요! 이번시간에는 앵귤러를 왜 쓰는지, 어떻게 사용해서 실제로 적용하는지에 대해서 먼저 살펴보도록 하겠습니다. 예전의 HTML에서의 개 lts0606.tistory.com.. 2020. 12. 21. 앵귤러 튜토리얼(Angular tutorial) - 34 : 이벤트와 애니메이션(2) 저번시간에는 마우스 이벤트를 감지하여 앵귤러에서 어떻게 데이터와 화면을 구성하는지에 대해서 살펴 보았습니다. 이번시간에는 비슷한 내용인 에니메이션(animations)에 대해서 살펴 보겠습니다. Javascript의 라이브러리 중 유명한 Jquery라는 라이브러리가 있습니다. animate, fadeIn, fadeOut 및 draggable등 다양한 함수를 통해서 이벤트를 지원해주는 멋진 라이브러리 입니다. 마찬가지로, 앵귤러에서도 이러한 애니메이션 이벤트를 직접 다루어 볼 수 있습니다. 버튼을 눌러서 특정 애니메이션을 주는 기능을 만들어 보겠습니다. 프로젝트는 저번과 동일한 프로젝트인 sixStudy에 진행하겠습니다. 먼저 모듈을 설정하여 줍니다. * 대상 : app.module.ts import { .. 2020. 10. 28. 앵귤러 튜토리얼(Angular tutorial) - 33 : 이벤트와 애니메이션(1) 저번시간에 우리는 Validator와 관련된 내용을 살펴 보았습니다. 이번시간에는 브라우저 이벤트를 감지하여 처리하는 방법에 대해서 조금씩 살펴 보겠습니다. 프로젝트는 기존에 만든 sixStudy를 그대로 사용하겠습니다. 먼저 살펴볼 내용은 마우스와 관련된 이벤트 처리방법 입니다. 사용자의 마우스와 관련된 이벤트 감지는 간단하게 속성만 달아주면 손쉽게 부여할 수 있습니다. 이를 위해 사용자가 특정 영역을 드래그(drag)하는 기능을 만들어 보도록 하겠습니다. * 대상 : app.component.html Drag Area div 테그에 4개의 속성과, ngStyle이라는 디렉티브를 추가하였습니다. ngStyle에는 해당 테그의 스타일과 관련된 내용이 들어갈 예정이며 나머지 4개의 속성에는 이벤트를 위한 .. 2020. 10. 16. 앵귤러 튜토리얼(Angular tutorial) - 31 : 디렉티브 활용 저번시간까지 라우터, 모듈 등에 대해서 살펴보았습니다. 이번시간에는 디렉티브(directive)에 대해서 동작원리를 살펴보려고 합니다. 디렉티브는 일반적으로 html 페이지에서 사용하며 자주 사용한 디렉티브(지시자)로는 ngIf나 ngFor등이 있었습니다. 디렉티브(지시자)를 활용하면 화면을 구성할 때 매우 편리하게 만들수가 있었습니다. 이러한 디렉티브(지시자)는 사용자에 의해서 만들수도 있습니다. 앵귤러의 규칙답게 디렉티브 데코레이터와 class파일을 통해서 지시자를 만들수가 있습니다. 프로젝트는 새로 만들거나 아니면 기존 프로젝트를 이어서해도 상관 없습니다. 여기서는 fiveStudy프로젝트를 그대로 사용하였습니다. 아래 명령어를 입력하여 봅니다. * 명령어를 통해 만든 디렉티브는 모듈에 자연스럽게 .. 2020. 9. 28. 앵귤러 튜토리얼(Angular tutorial) - 30 : 모듈 활용 저번시간까지 우리는 모듈과 라우터의 관계에 대해서 살펴보았습니다. 라우터는 앵귤러에서 사용자의 요청에 따른 다양한 페이지를 보여주기 위해 존재하는 기능이며, 개발자 입장에서는 다양한 모듈과 라우터를 통해서 협업을 좀 더 쉽게 해 주는 기능 입니다. 이번시간에는 우리가 여태껏 사용한 FormsModule이나 BrowserModule등 모듈에서 다른 모듈, 즉 라이브러리처럼 동작하는 모듈은 어떻게 만드는지 한번 살펴 보겠습니다. 새로운 프로젝트를 생성하여 줍니다. ng new fiveStudy 이번에도 모듈에서 라우팅 기능이 포함된 형태로 프로젝트를 생성하여 줍니다. app컴포넌트html 파일은 라우터와 관련된 테그만 남기고 전부 제거하여 줍니다. 다음으로 동작할 컴포넌트를 추가하겠습니다. 컴포넌트이름은 이.. 2020. 9. 22. 앵귤러 튜토리얼(Angular tutorial) - 29 : 모듈과 라우터 심화2 저번시간에 이어서 모듈과 라우터에 대해서 살펴 보겠습니다. 저번시간에는 app모듈에서 라우터 설정이 존재하는 모듈 2개를 추가하여 사용하였습니다. app-routing모듈, routing2모듈 각각 1개씩 추가하여 사용자의 요청에 대해서 동작하게 하였습니다. 앵귤러는 싱글 어플리케이션, SPA(Single Page Application)라고 합니다. 우리는 작업을 하면서 여러개의 클래스를 만들고, 모듈 또는 컴포넌트를 만들어 기능을 완성합니다. 그런데 앵귤러를 실제 컴파일하여 Javascript로 구성을 하면 1개의 index.html파일에 여러개의 Javascript파일이 생성됩니다. 앵귤러는 사용자가 최초 접속을 하면 모든 파일의 내용을 읽어서 사용자의 행위에 대비합니다. 만약 100개의 페이지, 1.. 2020. 9. 18. 이전 1 2 3 4 ··· 7 다음
