양털의 개발 블로그52 넷플릭스 클론 - 1 넷플릭스 웹 사이트 클론을 해보려고 한다!! 사용하고 싶은 스택을 다음과 같이 생각했다. 프론트 : react, mobx, sass, typescript ( + 컴포넌트 라이브러리, hooks..?) 이번에 상태관리로 mobx를 도입해보려고 한다. 그리고 css를 saas를 이용해 만들어보려고 한다!! 백엔드 : firebase 빠른 백엔드 구축을 위해 파이어 베이스를 사용해보려고 한다. 파이어 베이스를 일단 공부한 다음에 구축을 해봐야겠다. 2020. 3. 20. 리액트 개발환경 설정해보기 포트폴리오 사이트를 만들기 위해 리액트 개발환경을 CRA 없이 셋팅해보려고한다. 그전에 리액트 개발환경에 필수적인 바벨과 웹팩에 대하여 공부를 했었다. 간단하게 공부를 했었는데 이것을 이번엔 좀 더 프로젝트답게(?) 적용해보려고 한다. 리액트에서 바벨과 웹팩이 필수적인 이유는 다음과 같다. - babel : 리액트는 ES5/ES6 + jsx로 작성한다. 이것을 브라우저가 이해할 수 있도록 바벨이 ES6 -> ES5, jsx -> js로 트랜스 파일링을 해준다. (@babel/preset-env ,@babel/preset-react) - webpack : 리액트는 최종으로 번들된 js 파일이 연결된 html 파일을 로드하기 때문에 번들링이 필요하다. 그럼 저번에 만들었던 github pages 프로젝트에서.. 2020. 3. 16. Webpack 웹팩의 공식문서를 보면 다음과 같이 나와있다. At its core, webpack is a static module bundler for modern JavaScript applications. When webpack processes your application, it internally builds a dependency graph which maps every module your project needs and generates one or more bundles. 웹팩은 최신 자바스크립트 어플리케이션을 위한 정적 모듈 번들러이다. 웹팩은 어플리케이션을 처리할 때 내부적으로 프로젝트에 필요한 모든 모듈을 맵핑하고, 하나 또는 이상의 번들을 생성하는 종속성 그래프를 작성한다. 즉, 웹에서 사용되.. 2020. 3. 15. Babel 바벨의 공식문서에 따르면 다음과 같이 나와있다. Babel is a JavaScript compiler Babel is a toolchain that is mainly used to convert ECMAScript 2015+ code into a backwards compatible version of JavaScript in current and older browsers or environments. 바벨이란 자바스크립트 표준인 ECMA 2015+/ES6+의 최신 문법으로 작성된 코드를 이전 단계의 문법(ES5)으로 변환시켜주는 자바스크립트 컴파일러이다. (소스를 소스로 바꿔주어 트랜스파일러라고도 부른다) 이러한 트랜스파일러가 필요한 이유는 구형 브라우저 (ex. IE 등)에서는 ES6+ 구문이 호.. 2020. 3. 15. 포트폴리오 사이트를 만들자 포트폴리오 사이트의 필요성을 느껴 어떻게 만들지 찾아보고 있었다. 찾아보니 많은 포트폴리오 사이트가 있었다. 대부분 좋은 퀄리티의 유료 사이트가 많았는데 사실 아직은 돈이 좀 부담되기도하고 내 마음대로 커스텀이 조금 어려운 점도 있어서 고민이 많았다. 그리고 개발자라면 포트폴리오 사이트는 직접 만드는 것도 좋지 않을까 생각이 들었다. 그래서 찾다가 Github pages 라는 것을 알게되었다. Github pages는 저장소의 내용을 웹페이지로 만들어주는 서비스이다. 즉, 정적 사이트 호스팅 서비스로 무료로 나의 웹사이트를 구축할 수 있다는 것이다!! 그래서 Github pages를 이용하여 나만의 포트폴리오 사이트를 만들어 보기로 결심하였다. Github pages 우선은 Github에 레포지토리를 생.. 2020. 3. 14. Billy Zip 프로젝트 안녕하세요. 제가 코드스테이츠에서 약 4주기간 동안 진행하였던 Billy Zip 프로젝트에 대해서 블로깅을 해보려합니다. 프로젝트 소스코드는 아래의 Github repository에서 참고하실 수 있습니다. Client : https://github.com/hsl0505/BillyZip_CLIENT.git Server : https://github.com/hsl0505/BillyZip_SERVER.git 기획의도 및 프로젝트 소개 BillyZip이라는 프로젝트 이름은 '집을 빌린다'라는 의미에서 '빌리+집'을 영어로 바꾼 것입니다. 기존의 전월세, 보증금 등 부동산 매물마다 복잡한 계약이 있고, 기간 또한 대부분 1년 이상으로 짧은 기간동안 거주하는 것이 사실 어렵습니다. 빌리집 이름의 의미에서 알 수 .. 2020. 3. 13. 이전 1 2 3 4 5 ··· 9 다음