Project Devlog/넷플릭스 클론3 넷플릭스 클론 - 3 넷플릭스 처음 들어갔을 때 초기화면을 구현하는 중이다. 사실 초기 화면 구현을 다 했었는데 구현한 코드가 마음에 들지 않아 한번 갈아엎고 다시 만드는 중이다. 그리고 원래는 Mobx를 적용하려 했으나, Redux를 사용해보고 싶어 다 갈아엎은 것도 있다. 그래서 디렉토리 구조도 조금 바꾸었다. redux를 적용하기 위해 redux, react-redux를 받았다. 그리고 store 폴더를 만들어 주었다. 원래는 action과 reducer 등을 따로 만들어주는 것으로 알고 있는데 나는 Ducks 패턴으로 리덕스를 구현하기 위해서 store에 modules라는 디렉토리를 만들어 주었다. ducks 패턴의 경우, 한 파일에 구현할 기능과 관련된 액션타입과 액션 생성함수, 리듀서를 함께 만들어주고 모듈화 시켜.. 2020. 4. 9. 넷플릭스 클론 - 2 프로젝트의 초기 셋팅을 해주었다. React + TypeScript 우선 CRA를 통해 리액트 프로젝트로 만들어주었는데, CRA에 Typescript옵션을 주어서 Typescipt + React 프로젝트로 생성을 해주었다. 그리고 tsconfig를 기존의 BillyZip 프로젝트에서 사용하였던 옵션을 참고하여 내 입맛에 맞게 바꾸어 주었다. Prettier + ESLint 그 다음 해준 것은 prettier 설정이다. prettierrc 설정파일을 통해 내가 자주 사용하는 옵션으로 설정을 해주었다. 그리고 그 다음은 ESLint 설정인데 평소 즐겨사용하는 airbnb 스타일로 설정해줄 것이다. 그리고 typescript와 prettier도 같이 사용하기 때문에 관련 설정도 해주었다. ESLint 설정을 .. 2020. 3. 22. 넷플릭스 클론 - 1 넷플릭스 웹 사이트 클론을 해보려고 한다!! 사용하고 싶은 스택을 다음과 같이 생각했다. 프론트 : react, mobx, sass, typescript ( + 컴포넌트 라이브러리, hooks..?) 이번에 상태관리로 mobx를 도입해보려고 한다. 그리고 css를 saas를 이용해 만들어보려고 한다!! 백엔드 : firebase 빠른 백엔드 구축을 위해 파이어 베이스를 사용해보려고 한다. 파이어 베이스를 일단 공부한 다음에 구축을 해봐야겠다. 2020. 3. 20. 이전 1 다음