신규 블로그를 만들었습니다!

2020년 이후부터는 아래 블로그에서 활동합니다.

댓글로 질문 주셔도 확인하기 어려울 수 있습니다.

>> https://bluemiv.tistory.com/

Angular JS

앵귤러는 구글이 만든 오픈소스 웹 어플리케이션 프레임워크 입니다. 자바스크립트로 만들었고, 구글 뿐 아니라 다른 여러 회사에서 사용되고 있는 인기있는 자바스크립트 프레임워크입니다.

1_iOmwue1uxW2O6sbDUEItPw.jpeg
다운로드

 

앵귤러의 좋은점은 여러가지 많이 있는데, 오픈소스로 무료라는 점과 간단한 코드 몇줄로 쉽게 원하는 기능을 만들 수 있다는 장점이 있습니다. 간단한 예를들어보자면 input 태그에 입력하는 순간 바로바로 값을 띄어주는 bind 기능을 만들어보겠습니다. 라이브러리를 사용하기 위해 js를 가져옵니다.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>​

 

그리고 아래와 같이 코드를 입력해주면 {{ name }} 위치에 입력한 값이 출력되는 것을 확인 할 수 있습니다.

<!DOCTYPE html>
<html>
<head>
    <!-- Angular JS -->
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
    <title>Angular JS TEST</title>
</head>
<body>
    <div ng-app="">
        Input : <input ng-model="name" placeholder="Enter your name"/>
        <p>The name is {{ name }}</p>
    </div>
</body>
</html>
​

 

결과 화면을 보겠습니다.

 

 

또한 MVC(Model, View, Controller)로 구분해서 개발할 수 있습니다. MVC로 나눠지면 어떤 점이 좋을지 간략히 설명하자면, 데이터와 관련된 model, 사용자에게 보여지는 view, 전체적인 로직을 수행하는 controller로 나눠, 유지보수하기 편해지고 보기좋게 개발이 가능합니다. 앵귤러는 모듈화해서 개발을 하는데 이로인해 코드의 재사용성을 줄이고 코드의 양을 줄일 수 있습니다.

 

앵귤러 js의 장점을 정리하자면,

1. 오픈소스 프레임워크

2. 비교적 쉽게 기능 구현 가능

3. MVC 형태로 정확 구현 가능

 

앵귤러 JS를 공부하기 좋은 사이트

위 2 사이트를 추천합니다. 물론 영어로 되어 있기 때문에 한글에 익숙한 저희는 한눈에 안들어올수도 있으나, 쉬운 영어로 되어 있기도 하고, 코드와 함께 보면서 따라가다보면 쉽게 쉽게 넘어갈 수 있습니다.

 


Reference

https://www.w3schools.com/angular/default.asp

 

AngularJS Tutorial

AngularJS Tutorial AngularJS extends HTML with new attributes. AngularJS is perfect for Single Page Applications (SPAs). AngularJS is easy to learn. Start learning AngularJS now! This Tutorial This tutorial is specially designed to help you learn AngularJS

www.w3schools.com

https://ko.wikipedia.org/wiki/AngularJS

 

AngularJS - 위키백과, 우리 모두의 백과사전

위키백과, 우리 모두의 백과사전.

ko.wikipedia.org

https://angular.io/guide/quickstart

 

Angular

 

angular.io

 

'WEB > Angular.js' 카테고리의 다른 글

Angular.js의 모델(Model)과 HTML의 <select> 활용하기  (0) 2018.11.06
  • 네이버 블러그 공유하기
  • 네이버 밴드에 공유하기
  • 페이스북 공유하기
  • 카카오스토리 공유하기