반응형 angular4 😓ngrx를 이용하여 에러난 파일처리 🪜 문제상황 지난 프로젝트 유지보수 진행중 전송되지 않는 파일이 존재하여, 응시완료가 되지 않는 경우가 발생하였다. 그리하여 ngrx를 활용하여 에러난 파일을 store담아서 처리 해보기로 하였다. 문제상황 및 해결 방식은 아래와 같다. 위처럼 "3번"에서 에러가 날 경우 멈추는 것이 아닌 Store에 담는다. 👨💼 500 에러 날 경우 Store에 담기 🦧 1번 상황에서 에러가 발생할려면 actions에 addFileAction를 등록한다. //file.actions.ts import { createAction, props } from '@ngrx/store'; import { File } from './file'; // File 모델을 만들어야 한다. export const addFileAction.. 2022. 7. 30. Ngrx 도입 🦧 Ngrx? ngrx는 Angular에서 사용되는 상태관리 라이브러리이다. 옛날에 기억으로는 Redux에 감명을 받았다는 것을 본적이 있다. 🐅 Ngrx 구조 구조는 위와 같으며 Component에서 Action을 호출하면 Reducer(연산처리 같은)으로 store에 저장한다. 그리고 selector를 통해 component에 보여줄수 있다. Effects는 API를 사용할 경우 필요한 것이며, Actions을 호출할때 Effects에 등록된 Action을 호출하여 API를 호출하는 형식이다. 🚢 Ngrx 세팅 1-1. ☔ tsconfing.json에서 alias 설정 store의 경로를 alias로 설정한다. { . . . . . "compilerOptions": { "paths": { "@stor.. 2022. 6. 16. 🥷Angular의 다국어 관리 npm install @ngx-translate/core --save 🚽 ngx-translate 이번에 회사에서 기존에 관리하고 있는 Ionic의 앱의 다국어가 필요하다는 요청이 들어왔다. 그리하여 ngx-translate를 적용하기로 하였다. (https://github.com/ngx-translate/core ) 🚔 ngx-translate 설치 npm install @ngx-translate/core --save 😎 app.module.ts에 import Angular에서 모듈을 설치하면 항상 app.module.ts에 import를 해줘야 한다. // app.moudule.ts import { TranslateModule } from '@ngx-translate/core'; @NgModule({.. 2021. 11. 7. ionic + angular 세팅 🚓 앱 개발을 하게 되다. 지금 회사에서 웹을 하다가 다음주 부터 앱을 하게 되었어요. 다행인건 단순히 navtive app이 아닌 하이브리드 앱 프레임워크 중 하나인 ionic을 하게 되었는데요. "하이브리드 앱 프레임워크"는 웹 기술로 앱을 만들수 있게 해주는 프레임워크 입니다. ionic은 "React,Vue,Angular"를 지원하는데요. 저희 회사는 "Angular"를 사용하고 있어요. ☔이제부터 환경세팅을 시작해볼게요. 제일 힘든게 환경세팅이니깐요 🦽 ionic을 install해주세요 npm install -g @ionic/cli 저 같은 경우 원하는 폴더 밑에서 윈도우 cmd를 켜서 설치했어요~ 그 다음으로는 "Angular,React,Vue"가 존재하지만 저는 "Angular"를 선택 했어.. 2021. 7. 31. 이전 1 다음 반응형
