프론트기술/Angular12 Angular 11 에 Tailwind CSS 를 적용해보자. Tailwind CSS 최근 CSS Framwork 조사 에서는 Tailwind CSS가 Bootstrap, PureCSS 등을 제치고 가장 많은 인기를 얻고 있다. Tailwind 는 HTML 문서에 class 를 정의해서 사용하는 방법으로 디자인을 구성할 수 있는데, 커스터마이징이 자유로운 편이고, 직관적이어서 CSS를 직접 다루는 개발자들에게 좋은 호응을 얻고 있다. 홈페이지 메인에서부터 아주 직관적인 사용법이 표현이 되어 있다. tailwindcss.com Angular 11 에 Tailwind CSS 적용하기 Angular 프로젝트에 Tailwind CSS 를 사용할때 유의해야할 점은 TailwindCSS 의 기본 CSS 파일의 사이즈가 아주 크다는 것이다. 현재 버전을 확인해보니 4.63MB .. 2021. 2. 21. check python checking for Python executable "python" in the PATH 윈도우 환경에서 Angular Project에서 npm 명령을 수행할때, 아래와 같은 에러가 발생했다. gyp verb check python checking for Python executable "python" in the PATH gyp verb `which` succeeded python C:\Users\revfactory\AppData\Local\Programs\Python\Python39\python.EXE gyp ERR! configure error gyp ERR! stack Error: Command failed: C:\Users\revfactory\AppData\Local\Programs\Python\Python39\python.EXE -c import sys; print "%s.%s.%.. 2021. 2. 20. Angular 11 디버깅 가이드 Angular 의 로드맵을 보면 더 많은 신규 유저를 유입시키기 위한 노력들을 진행하고 있다. 가이드 문서를 전체적으로 개선하고, CLI 메세지등을 개선하고 업데이트를 쉽게 할 수 있도록 하며, 더 나은 오류메세지로 디버깅 환경을 개선하는 등의 플랜을 가지고 있다. 여기서는 Angular 11.1.0 부터 개선된 표준화된 오류 코드와 함께 Angular 의 디버깅 가이드 내용을 살펴보고자 한다. Angular Error Message Angular 오류 메세지는 모두 NG 로 시작하며, 뒤에 표기되는 코드값에 따라 에러 유형을 판단하는데 도움을 준다. 이러한 코드는 다음과 같은 형식으로 식별할 수 있다. 에러코드가 0으로 시작하는 3자리 코드의 경우 런타임 에러를 의미하며 다음과 같은 카테고리로 구성된다.. 2021. 1. 31. Angular + Scully 로 JAM Stack 맛보기 Angular CLI 로 프로젝트 생성 $ ng new jamstack-example - 엄격한 유형검사 : y - Angular routing 사용 : y - Stylesheet Format : SCSS (CSS 도 상관없음) 콘솔에서 실행 $ cd jamstatck-example jamstatck-example$ ng serve IntelliJ 에서 실행시 Material 모듈 추가 jamstack-example$ ng add @angular/material - Browser Animation : no Scully 모듈 추가 jamstack-example$ ng add @scullyio/init Navi 컴포넌트 추가 jamstack-example$ ng g @angular/material:nav m.. 2021. 1. 15. PowerShell 에서 Angular Cli가 안될때 The term 'ng' is not recognized as the name of a cmdlet 'ng' 용어가 cmdlet, 함수, 스크립트 파일 또는 실행할 수 있는 프로그램 이름으로 인식되지 않습니다. (the term 'ng' is not recognized as an internal or external command, operable program or batch file.) 1. Windows PowerShell 실행 정책 변경 Windows PowerShell 실행 정책을 사용하면 Windows PowerShell이 구성 파일을로드하고 스크립트를 실행하는 조건을 결정할 수 있습니다. 실행 정책 유형 : Restricted** -로컬, 원격 또는 다운로드 스크립트는 시스템에서 실행할 .. 2021. 1. 15. IntelliJ에서 Angular2 사용하기 with Angular CLI 주변에 보면 Angular 를 하고는 싶으나 진입이 어렵다고들 하십니다. 타입스크립트 ES6 등등 처음 접해보는 개념들과 용어들, 그리고 처음에 뭔가 셋팅이 많이 필요해서 일지도 모릅니다. (보통 AngularJS 1.x 는 AngularJS로 Angular2.x이후는 Angular로 불립니다.) Angular-CLI 를 이용하면 Angular2 프로젝트 초기 셋팅에 들어가는 수고를 덜 수 있습니다. 따라서 처음에는 Angular CLI 로 시작해보시길 권장합니다 https://github.com/angular/angular-cli 1. NPM을 이용해서 angular-cli 를 설치 npm install -g angular-cli *npm 이 없으시다면, NODE js를 설치하세요 2. Angular .. 2016. 12. 28. 이전 1 2 다음
