앵귤러 학습을 위한 도우미

앵귤러를 사용해보려 하시나요?

이번 글에서는 맨땅에 헤딩하고 온갖 삽질을 하면서 공부한 경험을 기반으로, 앵귤러를 학습하는데 도움이 될만한 사항에 대해서 이야기해볼까 합니다. 물론 기본적으로 HTML과 JavaScript, CSS에 대한 기본 지식이 우선이겠죠?

 

이번 글의 내용은 절대적인 것은 아니며, 전 영역을 두루 커버하는 것은 아닙니다. 100% 개인적인 경험에 의한 일부에 대한 내용이니 참고만 하시기 바랍니다.

 

1. 앵귤러를 시작하자!

일단 처음은 무조건 공식 튜토리얼을 이용하는 것이 좋습니다. (물론 문서는 마음에 들지 않습니다...)

 

오리지널 튜토리얼 : https://angular.io/docs

한글판 튜토리얼: https://angular.kr/docs

 

 

솔직히 좀 어렵습니다.

대체적으로 구글 문서는 뭔가 마음에 안 듭니다만, 일단 공식 문서이니까... 눈물을 머금고 따라 해 봅니다. 참고로 저는 처음에 전혀 (여전히... ㅜㅜ) 이해가 가지 않았습니다. 그래도 한글판을 만들어주신 고마운 분 (한장현님 https://han41858.tistory.com/48) 덕분에 요즘은 한결 수월해진것 같습니다.

 

모르는거 투성이

 

우선은 공식 문서의 시작하기 → 환경설정 → 기초지식의 순서대로 예제를 (무작정!) 따라서 직접 해보는 것이 좋습니다. 무작정 따라하면서 예제와 똑같이 돌아가도록 한번 만들어 봅니다. 

 

만약 한번에 이해된다면 당신은 프로그래밍 천재임을 보장합니다.

 

이해를 위한 과정이 아닙니다. 이해보다는 앵귤러 스타일에 익숙해지기 위한 방법이라고나 할까요? 이해되지 않더라도 일단 따라 해 보세요!

일단 앵귤러스러움에 친숙해지는 게 우선!

 

2. 앵귤러 학습 사이트는...?

초창기에 비해서 앵귤러와 관련한 각종 블로그나 사이트들이 꽤나 늘어났습니다. 다만, 한글로 체계적으로 정리된 좋은 사이트를 찾기는 쉽지 않은데요, 다행히도 여느 해외 사이트 못지않게 무척이나 정리가 잘 되어 있는 사이트가 있습니다. 

 

https://poiemaweb.com/angular-basics

Angular Basics | PoiemaWeb

 

꾸준히 업데이트도 되고 있으며, 전체적으로 공부하기 좋게 체계적으로 상당히 잘 정리되어 있습니다.

개인적으로는 앵귤러 튜토리얼을 블로그에 정리해볼까? 하다가 위 사이트보다 잘 정리할 자신이 없어서 조용히 접었습니다. 블로그에는 단편적인 내용만 정리하려구요.

 

기타 해외 사이트도 검색하면 많은 내용이 있긴 하지만 일단, 언어적인 측면에서, 또 정리 측면에서 위의 사이트가 가장 훌륭한 것 같습니다. 예제도 Stackblitz에서 바로 실행해 볼 수 있도록 임베딩 되어 있구요.

추가적으로, Typescript에 대해서도 잘 정리가 되어있으니 더더욱 앵귤러를 공부하는데 도움이 되는 것 같습니다.

 

꼭 앵귤러가 아니더라도 HTML, CSS, Javascript, Node.js 등 많은 사항이 정리되어 있으니 꼭 한번 살펴보시기 바랍니다.

 

3. 앵귤러 책은 없나요?

아쉽게도 앵귤러 관련 서적은 종류가 그다지 많지는 않습니다. 더군다나 국내에서는 앵귤러의 수요가 많지 않은지 개정판이 잘 나오지도 않습니다. 

그렇다고 원서를 읽기는 그렇고...

아주 많이 읽어본 건 아니지만 일단 두 가지 추천드립니다.

 

앵귤러 첫걸음

http://www.yes24.com/Product/Goods/41070512

앵귤러 첫걸음

아쉽게도 다소 연식이 좀 된 책인데 최신판은 안 나오네요. 그래도 앵귤러를 공부하면서 개념을 잡는데 좋은 책인 것으로 판단되어 추천드립니다.

 

Angular Essentials

http://www.yes24.com/Product/Goods/62063090

Angular Essentials

 

솔직하게 말씀드리면 이 책은 읽어보지는 않았습니다. 다만, 앞서 추천드린 Poienmaweb 사이트의 주인인 이웅모 님이 저술한 책으로, 목록을 살펴볼 때 웹사이트와 연계하여 공부하면 효과적일 것으로 생각됩니다. 그리고 비교적 최신인 Angular 6 위주로 설명이 되어 있구요. (리뷰 평도 좋네요!)

 

앵귤러 책을 보고 예제를 하나하나 따라 하면서 학습하는 것도 좋지만, 개인적으로는 어느정도 앵귤러 학습이 된 후에 누워서 슥슥 읽어보면서 그동안 애매했던 내용에 대해서 이해하고 정리하는 방식으로 접근하는 것도 좋지 않을까 하는 생각이 듭니다.

책에서 이해가 안되던 부분이 점점 줄어드는 것을 느낄때, 그만한 즐거움이 없거든요!

 

4. 유료 템플릿을 써볼까?

뭐니 뭐니 해도 단편적인 예제들보다는 어느 정도 완성된 코드를 보고 공부하는 것이 많은 도움이 됩니다. 

 

이해가 되지 않는 코드가 있다고 하더라도

"코드" 자체로만 보면서 생각하는 것과

제대로 돌아가는 프로그램이 있는 상태에서 살펴볼 수 있는 것은 엄청난 차이니까요!

 

웹에서도 간단한 템플릿이나 예제에 대한 소스 코드는 구할 수 있지만, 어느정도수준에 올라와 있는 앵귤러 코드는 구하기가 쉽지 않은것 같습니다. 이럴 때, 약간의 비용을 들여서 템플릿을 구매, 분석해보면 많은 도움이 됩니다.

워드프레스로 유명한 themeforest.net에서는 워드프레스 테마뿐만 아니라 각종 코드, 템플릿을 구매할 수 있습니다

 

WordPress Themes & Website Templates from ThemeForest

 

앵귤러로 검색해보면 (https://themeforest.net/search/angular) 꽤 많은 템플릿들이 나타납니다. 주로 대시보드 형태의  템플릿들이 많이 있습니다. 물론, 일반 웹사이트 용도의 템플릿도 있습니다.

가격대는 20~40$ 정도가 대부분이며 블랙 프라이데이에 할인하는 경우가 많으므로 급하지 않다면 그 시기에 구매하는 것이 좋을 것 같습니다. (기간 제한 없이 업데이트된 내용을 계속 다운로드할 수 있습니다)

 

 

 

각각의 템플릿마다 Live Preview가 있으므로 직접 데모를 확인해보고 마음에 드는 템플릿을 구매하면 됩니다.

 

문제는... 

실제 내부 코드 구성이 도움이 될만한 것인가....? 하는 것은 구매 전까지는 알 수 없어요. 일단은 최소한의 안전판으로 다음의 사항을 고려하면 될 것 같습니다.

• 최근까지 계속 업데이트 되고 있는가? (Angular version up!) - 필수! 
• 충분한 구매 숫자가 있는가? 
• Comments에 뭔가 문제점이 많이 있나 살짝 살펴보기

 

필터를 걸고 검색하면 (많이 팔린 것 또는 평가가 있는 템플릿 등) 다소 수월하게 살펴볼 수 있습니다.

 

개인적으로는...

앵귤러를 공부하는게 목적이라면, Bootstrap보다는 앵귤러와 세트인 Angular Material, Angular Flex Layout 등을 사용하고, 앵귤러에 충실하게 제작한 코드를 구매하는 것이 좋지 않을까 싶습니다. 또한, React, Vue를 모두 제공하는 템플릿 보다는 앵귤러에만 충실한 템플릿을 구매하는 게 좋을 것 같습니다.

 

몇 번 구매해본 경험에 의하면... (비단 앵귤러 뿐만 아니라 이것 저것...) 

구매후 코드를 열어보는 순간 허걱하는 경우도 꽤나 있습니다. 코드가 엉망인 경우도 있고, 도무지 이해하기 힘든, 제작자만 알아볼 수 있는 코딩을 한 경우도 있습니다. 그리고 대시보드 템플릿들은 색상이나 모양에 대한 설정까지 바꿀 수 있도록 지원하다 보니 꽤나 복잡하고 속도가 그다지 빠르지는 않은 경우도 많습니다. (화려하고 다양해야 잘 팔리니까요!)

 

다만, 실제 바로 사용하기위한 템플릿이라기 보다는 공부 및 레퍼런스 정도로 생각한다면 충분히 그 가격정도의 가치는 하고 남는다고 생각합니다. (잘만 고른다면요!)

 

그중 한가지 예로, 아래 템플릿은 "앵귤러" 자체를 공부하기에 꽤 괜찮았던 것 같습니다. 

Vex - Angular 9+ Material Design Admin Template

절대 추천은 아니니 참고만 하세요! (TailwindCSS인가를 사용해서 스타일 부분은 좀...)

 

맺음말

국내에서는 앵귤러를 공부하기에는 아주 좋은 환경은 아닌 것 같습니다. 아무래도 파이가 작다고 해야 할까요?

아무튼 이왕 앵귤러를 공부해야 한다면, 제한된 환경이라 하더라도, 직접 작성하면서 공부하다 보면 어느덧 앵귤러에 익숙해져 있는 모습을 발견할 수 있습니다. 

 

막상 사용해보면 꼭 모든 것을 다 알지 않더라도 앵귤러를 시작하고 웬만한 코드는 작성할 수 있어요!

앵귤러 사용자 분들 파이팅...!