[정리] 직무별 개념 정리/프론트엔드(4)
-
앵귤러 강의 정리
회사 업무중 앵귤러를 다뤄야하는 프로젝트가 생겨 아래 강의를 듣고 정리합니다. https://www.inflearn.com/course/Angular/dashboard [무료] Angular(2+) Front에서 Back까지 - Nest js를 알려면 Angular 모듈을 알아야한다! - 인프런 | 강의 이 강좌는 Angular의 기본 개념을 익히는데 그 목적을 두고 있습니다. Nest js도 잘 하려면 이 기본 개념을 알아야하죠. Angular는 러닝커브가 높다고들 이야기가 되곤하는데, 전혀 어렵지 않음을 알려 www.inflearn.com @Input // 리액트로 치면 Props 에 대응되는 개념인 듯. @Component(...) class MyComponent { @Input test: stri..
2022.07.02 -
Next.js
강의 링크 강의 문서 장점 - 서버 사이드 렌더링 - 검색 최적화 서버 사이드 렌더링 : 리액트로 만들어진 앱들은 자바스크립트가 동작하지 않는 환경에서 소스보기를 했을 때, 실제 보이는 값과 다르게 안 보이는 컨텐츠들이 있을 수 있다. 설치 npm add next npm add react npm add react-dom package.json 스크립트 ... "scripts": { "start": "next", "build": "next build", // .next/server/static/{cache}/ 아래 빌드된 파일이 만들어진다. "export": "next export", // 빌드한 파일이 out 이라는 디렉토리에 SPA 파일이 만들어진다. ... } ... pages 폴더 Web 사이트를 ..
2020.02.16 -
프론트 작업용 지식 2 - Redux saga, generator
동기처리 참조 영상 : 링크 Redux 의 문제 : 모든게 동기처리다. 변경 요청이 들어가면 바로바로 반영되기 때문에, API 호출과 같은 비동기요청을 처리하려면 미들웨어를 써야한다. Redux 의 기능 확장을 위해 써는 것을 미들웨어라고 한다. 해당 문제를 해결하기 위한 미들웨어중 유명한 것이 1. Redux thunk -> 쉬운 대신 기능이 약하다. 2. Redux saga 3. Redux observable Redux Saga redux 의 특정 action 이 실행되는 것을 대기하다가 받아서 비동기 동작을 처리하고 결과에 맞게 또 다른 동작을 수행한다. export default function* rootSaga() { yield all([ call(mySagaA), call(mySagaB) ])..
2020.02.16 -
프론트 작업용 지식 1 - FramerX, Monorepo, container-presentational
FramerX 디자인 + 기획용. 프로토타이핑 하기에 괜찮다. 들어볼만한 강의 참조 : https://www.youtube.com/watch?v=ueFYVSW7wFI&list=PL2XQ8H8IpiCZ8_7Xnawrw6Cirke-op5A2 컴포넌트 - icon generator - design hunt - unsplash - profile - grid Monorepo 하나의 깃 repository 로 개발하는 방식. 자바에서 하나의 레포지토리에 멀티 모듈을 두는데, 이러한 작업 방식을 부르는 정확한 명칭이 모노레포 였나보다. (Dluid 도 모노레포 https://github.com/kok202/Dluid) 자바스크립트에서는 lerna 를 써서 관리하는 듯. 참조할 만한 포스팅 : 링크 Lerna(🐉)로 ..
2020.02.15