반응형

Programming 56

@ng-bootstrap/ng-bootstrap 설치 시 오류 :: peer @angular/common@"^13.0.0" from @ng-bootstrap/ng-bootstrap@12.1.2

1. 개발환경 2. 오류 @ng-bootstrap/ng-bootstrap+설치 $ ng add @ng-bootstrap/ng-bootstrap 설치 시도 시 아래와 같은 오류 발생 오류 내용 npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: client@0.0.0 npm ERR! Found: @angular/common@14.0.6 npm ERR! node_modules/@angular/common npm ERR! @angular/common@"^14.0.0" from the root project npm ERR! npm ERR! Could not resolv..

Programming/Angular 2022.07.18

Angular(Front) + Node.js(Back) 연동하기

1. Angular.js 프로젝트 생성 @angular-cli 패키지 설치 $ npm i -g @angular/cli angular-cli 설치가 되어 있는 분은 다음으로 넘어가시면 됩니다. Angular.js 프로젝트 생성 $ ng new client Angular 프로젝트를 생성하고자 하는 경로에서 명령어 실행하세요. 서비스 실행 및 확인 $ ng serve --watch 또는 $ pm2 start "ng serve" --name "client" --watch pm2를 사용하시려면 pm2 패키지 설치가 되어 있어야 합니다. pm2 설치는 npm install -g pm2 로 설치하면 됩니다. 윈도우 환경에서는 pm2 start "ng serve" 를 다른 방법으로 실행해야 합니다. 계속 수정하면서 결..

Programming/Angular 2022.07.15

Node.js + express-session + db(MariaDB/MySQL) 연동 예제 :: 로그인 구현

1. 기본 시작 소스 안내 기본 소스는 branch::ex-auth 에서 시작하며, 완성된 소스는 branch::ex-auth-mysql 입니다. https://github.com/gogoma-code/node-express-auth.git node와 express-session을 활용하는 기본(branch::ex-auth가 만들어지는 과정)은 아래 글을 참고해 주세요. Node.js + express-session :: 프로젝트 생성부터 로그인 구현하기 2. MySQL 예제 테이블 생성 기본적으로 MySQL은 설치가 되어 있다는 가정 하에 진행합니다. SQL 예제 테이블 생성문 /* 만약 test 데이터베이스가 이미 있다면 다른 이름을 사용하세요. */ CREATE DATABASE `test`; USE..

Programming/Node.js 2022.07.11

Node.js + express-session 연동 예제 :: 프로젝트 생성부터 로그인 구현하기

Window 10 환경에서 node.js를 사용했습니다. npm init 부터 로그인 UI까지 만드는 과정을 기록합니다. 편의상 node로 프론트화면까지 구성합니다. 기본적으로 node는 설치가 되어 있다고 생각하고 진행합니다. 1. express-generator로 프로젝트 생성 원하는 경로에 새로운 디렉터리를 만들어요. 저는 node-express-auth 라는 이름으로 디렉터리를 하나 만들었요. 이제 경로 내에 들어가 express-generator로 node 기본 구조를 만들 거예요. express로 프로젝트 생성 $ express ex-auth -e --git 의존 패키지 설치 $ cd ex-auth $ npm install $ npm install bootstrap --save $ npm in..

Programming/Node.js 2022.07.07

Node.js :: express-generator 로 개발환경 세팅

1. express-generator란? 이제는 거의 정형화 되어 있는 프로젝트의 구성을 자동으로 생성해주고, 이 구성을 잡아줄 때 필요한 패키지를 package.json을 통해 제공하기 때문에 빠르게 노드 프로젝트 구성을 할 수 있습니다. 2. express-generator 전역에 설치하기 window라면 powershell을, linux 환경이면 터미널을 열어주세요. $ npm i -g express-generator expree-generator 패키지를 전역에 설치합니다. 전역에 설치하는 이유는 보통 단일 프로젝트에만 쓰는 게 아니라 각종 프로젝트를 만들 때 사용하기 때문입니다. 3. express로 프로젝트 생성하기 $ cd C:\expert\node-express-generator 우선 프로..

Programming/Node.js 2022.07.06

MariaDB :: root 비밀번호 초기화 방법 (Bitnami 포함)

MariaDB root 비밀번호를 까먹어서 초기화 시켰습니다. 해당 과정을 기록합니다. Windows 10 10.4.24-MariaDB 1. MariaDB 서비스 중지 Bitnami로 MariaDB 설치한 경우 WAMP packaged by Bitnami 실행 후 "MariaDB Database" 클릭 후 Stop 직접 MariaDB 설치한 경우 CMD 열고 아래 명령어를 입력해요. (Bitnami 는 이게 안 될 수도 있어요.) net stop mysqld 이거 안 되면 아래로 하면 99% 멈추게 할 수 있어요. tasklist | findstr "mysql" #mysqld.exe 1376 Services 0 14,952 K mariadb로 검색하시면 안 됩니다. mysql로 검색하셔야 해요. 그 다음..

Node.js :: 버전 변경하기 / nvm 활용

node 버전을 downgrade 하여 사용해야 하는 경우가 생겼습니다. Window 환경에서 node.js 의 버전을 변경하는 방법을 기록합니다. 1. 현재 버전 확인 node가 설치되어 있지 않다면 바로 2번으로 넘어가세요. $ node -v v16.15.02. nvm 설치 nvm은 node version manager로 뜻 그대로 노드의 버전을 관리해주는 도구입니다. nvm 설치가 되어 있는 분은 패스해도 됩니다. 설치가 되어 있지 않으면 설치를 진행하세요. Releases · coreybutler/nvm-windows (github.com) 링크에 접속하셔서 하단의 Assets 에서 nvm-setup.zip 을 다운로드 합니다. 압축파일이 다운로드 될텐데 압축 해제 후 nvm-setup.exe 파..

Programming/Node.js 2022.06.27

AngularJS :: @angular-cli로 파일 생성 시 html, css, spec 파일 생기지 않게 하기

@angular-cli를 통해 빠르게 component 생성 시, 원하지 않는 html, css, spec 등의 파일들이 같이 생성이 됩니다. 필요한 파일만 생성하기 위해 옵션을 설정하는 방법입니다. component 생성 기본 예제) Component 생성 $ ng g c test # ng generate component test 와 같습니다. 저는 루트 디렉터리가 angular_test이기 때문에, angular_test 아래에 test 아래에 css, html, spec.ts, ts 파일들이 생성됐습니다. 근데 저는 component.ts 만 생성되길 원하는데 자꾸 다른 파일들도 같이 생성되니까 하나하나 지우기가 너무 귀찮았어요. angular.json에서 옵션을 주면 되더라구요. schemati..

Programming/Angular 2022.06.21

AngularJS :: control must be defined as 'standalone' in ngModelOptions 오류 해결

오류 & 오류 원인 ngForm 과 ngModel 을 같이 사용하려고 할 때, 코드를 위와 같이 작성했더니 오류가 발생했습니다. 오류 내용을 읽어보니 ngModel을 사용하려면 name 속성을 사용하거나, ngModelOptions을 standalone으로 정의되어야 한다고 합니다. ngModel만 사용할 때는 문제 없었는데, ngForm과 ngModel을 같이 사용하려고 하니 오류가 발생하네요. ngForm과 ngModel을 함께 쓰려면 위 조건을 잘 지켜주어야 하는 것 같습니다. 오류 해결 해결 방법1 name 속성을 주어서 해결할 수 있습니다. 해결 방법2 ngModelOptions을 standalone으로 정의하여 해결할 수 있습니다. 모든 입력 필드에는 속성 이름이 있는 것이 좋으니 더 좋은 해..

Programming/Angular 2022.06.20

GitHub Page에 Angular 배포하기

https://.github.io// 에 Angular를 배포하기 위한 방법입니다. repository가 public으로 설정되어 있다는 가정 하에 진행합니다. 만약 repository가 private로 설정되어 있다면 GitHub Pro 이상의 계정을 구매해야 합니다. git 사용법에 대해서는 별도로 작성하지 않습니다. git 사용법이 궁금하다면 아래 링크를 참고해 주세요. Git :: 설치부터 기본 사용법까지 (1) - git 설치 Git :: 설치부터 기본 사용법까지 (2) - git 사용법(github, 명령어) Git :: 설치부터 기본 사용법까지 (3) - git 으로 협업(팀프로젝트)하기 패키지 설치 및 세팅 angular-cli-ghpages 패키지 설치 $ npm install -g an..

Programming/Angular 2022.06.17
반응형