본문 바로가기

앵귤러3

[Angular] 앵귤러 RouterModule 사용 및 실습 :: 마이자몽 Routing은 SPA인 Angular에서 중요한 기능중 하나이다.비동기식 방식으로 화면을 전환하기 위해 탭과 같은 네비게이터를 이용하여 뷰의 한 구역만 전환해서, 하나의 화면에서 모든것을 해결할 수 있게 해준다. 실습은 tab 컴포넌트와 Router를 이용한 내용 전환과 ActivatedRoute를 이요하여 데이터를 넘기는 것까지 할것이다.html컴포넌트는 material을 사용해준다. 1.RouterModule 기본 프로젝트 구조 category-home, category-list module을 만들어준다.이 두 모듈을 탭으로 구성하여 화면에 출력해줄것이다. app.module.ts123456789101112131415161718192021222324252627282930import { Browser.. 2018. 10. 7.
[Angular] 앵귤러 Component 실습 :: 마이자몽 Component는 View의 한 단위다.화면에 보여지는 하나의 구역이다. app.component.ts1234567891011import { Component } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css']})export class AppComponent { title = 'ng-jamong-app';} cs '@'문자는 Decorator이다. Java의 Annotation과 비슷한 역할을 해준다.Decorator가 붙으면 Angular가 인식을하게된다.위 코드는 Component Decorator으로 Angular가 .. 2018. 9. 25.
[Angular] 앵귤러 맥OS 설치 및 개발환경 구축 :: 마이자몽 예전부터 Angular로 Front side를 개발해보고 싶다는 생각을 갖고있었다.이번 기회에 공부하면서 최종적으로 Angular를 사용해서 작은 프로젝트하나를 해볼려고한다. Angular를 설치하기에 앞서, Node.js, typescript에 대해서 좀 알아두면 좋겠지만, Angular를 하면서 익혀도 된다. Angular를 설치하기 위해 Node.js가 설치되어 있어야한다. 간단하게 Node.js가 무엇인지 알아보자. 1. Node.jsNode.js에 대한 정의를 검색해보면, 확장성 있는 네트워크 애플리케이션이다.... Non-blocking I/O와 단일 스레드 이벤트 루프를 통한 높은 처리 성능을 가지고 있다..... 등등 어렵게 설명이 되어있는데...쉽게 그냥 설명하면 JavaScript를 B.. 2018. 9. 24.