이세개발
article thumbnail
넷플릭스 클론코딩 4 Creating files/folders

src/fixtures 폴더를 만들고 src/fixtures/faqs.json [ { "id": 1, "header": "What is Netflix?", "body": "Netflix is a streaming service that offers a wide variety of award-winning TV programmes, films, anime, documentaries and more – on thousands of internet-connected devices.\n\nYou can watch as much as you want, whenever you want, without a single advert – all for one low monthly price. There's always ..

article thumbnail
넷플릭스 클론코딩 3 (패키지설치 및 코드정리)

1. 여러가지 패키지들을 설치한다. yarn add styled-components yarn add firebase yarn add fuse.js yarn add normalize.css 대표적인 CSS-in-JS 라이브러리 https://styled-components.com/ 구글 Firebase https://firebase.google.com/?hl=ko 클라이언트 측에서 사용되는 가볍고 강력한 텍스트 검색 라이브러리 https://fusejs.io/getting-started/installation.html 웹 페이지의 스타일을 표준화시키는 CSS 리셋 스타일시트 https://github.com/necolas/normalize.css 2. 기본 튜토리얼 시작 코드 src/app.js expor..

article thumbnail
넷플릭스 클론코딩 2 (설치)

1. node 설치 https://nodejs.org/ko 18.16.0 LTS 버전으로 설치하였다. node, npm(패키지 관리자) 버전확인 node -v npm -v 2. yarn 설치 npm install -g yarn 설치확인 (1.22.19) yarn --version Yarn은 Node.js 자바스크립트 런타임 환경을 위해 페이스북이 2016년 개발한 소프트웨어 패키지 시스템이다. NPM을 사용해도 되지만 이 튜토리얼에서는 NPM의 한계를 극복하기 위해 나온 Yarn 을 사용하였다. 3. yarn netflix 라는 react-app 을 만든다. yarn create react-app netflix 이렇게 나오면 완료. 중간에 뜨는 노란색 warning들은 무시해도 된다.