Dev_R

에러 발생 후 웹팩에 css-loader, style-loader 추가 그 후 TypeError: this.getOptions is not a function 에러가 발생했다., 스택 오버플로우에서 찾아보니 버전 문제일 수 있다고 함 버전 다운그레이드 후 정상 작동

리액트를 이용한 크롬 익스텐션 개발을 위해 react-chrome-extension-boilerplate 레포지토리를 Fork해 왔습니다. fork한 레포지토리의 경우 Webpack3, React 15로 구성되어있고 page context에 script를 inject 하는것이 불가능한 https://github.com/jhen0409/react-chrome-extension-boilerplate 이 레포지토리를 기반으로 제작된 보일러 플레이트로 Webpack 4, React 16으로 업데이트하고, page context script inject를 지원하도록 개발환경을 변경해 둔 버전이라고 할 수 있습니다. 그렇기 때문에 해당 레포지토리의 디렉토리 구조에 대해서 간단한 분석을 해보겠습니다. 우선 분석에 앞..

유튜브를 보다보면 사람들의 반응을 알아 보고자 댓글들을 확인하는 경우가 많다. 그런데 간혹 한국인이 남긴 댓글보다 외국인이 남긴 댓글들이 대부분인 경우가 다반수인데, 한참 동안이나 스크롤을 내려야 간신히 한국인 댓글을 찾는 경우가 많았다 특히 유튜브의 어떠한(?) 알고리즘 때문에 한글 댓글 보다 영어 댓글이 우선적으로 표시되어지는 것 같다. 그래서 간단하게 크롬 익스텐션을 이용해 영어 댓글은 거르고 한국어로 된 댓글만 표시하는 보여주는 "유튜브 외국어 댓글 필터링" 익스텐션을 개발하고자 한다. 해당 크롬 익스텐션을 설치하면 외국어 댓글은 거르고 한국어 댓글만 화면에 보여주는 방식이 될 것 같다. 리액트로 개발할 예정이며, 리액트 크롬 익스텐션 보일러 플레이트를 기반으로 코드를 작성할 예정이다.

이번에는 MainActivity 외에 다른 액티비티를 추가하는 방법에 대해 알아보도록 하겠습니다. 우선 안드로이드 스튜디오에서 MainActivity가 있는 화면에서 오른쪽 마우스버튼을 클릭해 New> Java Class를 클릭합니다. 그다음 팝업창에서 Name에 액티비티로 사용할 이름을 적어줍니다. 저는 알람이 울릴 액티비티가 필요하기때문에 AlarmActivity라고 지었습니다. 그리고나서 OK를 누르면 이렇게 MainActivity와 같은폴더에 java class가 생성됩니다. 하지만 클래스 내부는 텅텅 비어있는 상태인데요 이 액티비를 정상적으로 사용하기 위해서는 몇가지 설정이 필요합니다. 위처럼 액티비티의 기본 틀을 갖춰주면 됩니다. 그다음은 alarmActivity에 맞는 레이아웃이 필요하겠죠?..

이번에는 안드로이드 앱에 웹뷰를 구현해볼게요 우선 웹뷰는 앱에서 인터넷 웹페이지를 보여주는것이라고 생각하면 됩니다. 브라우저를 이식하는 것과 같은 이치이구요 웹사이트를 열기 위해서는 인터넷에 연결되어있어야 겠죠? 그래서 AndroidManifest.xml에 인터넷 연결 퍼미션을 허용해줍니다. 요렇게 internet permission은 application 바깥쪽에 추가해두면 되구요 그리고 application 안에 아래의 내용도 추가하도록 합니다. android:usesCleartextTraffic="true" 레이아웃 설정도 간단하게 해볼게요 activity_main.xml파일에서 아래 7줄을 사이에 추가해주세요 그다음 MainActivity.java파일을 수정하겠습니다. 아래 내용을 보시고 추가해주..

이번에는 안드로이드 앱에 Firebase의 Clode Messaging 기능을 이용하는 방법에 대해 포스팅하겠습니다. 우선 firebase는 모바일,웹 환경에서 DB, 인증, 클라우드와 같은 서비스를 제공해주고 있는데요 요금제가 위 처럼 나눠져 있기는 하지만, 이번에 저희가 쓰려는 Firebase Cloude Messaging의 경우 무료 요금제로 무제한 사용가능하기 때문에 무료 Spark 요금제를 이용하겠습니다. 우선 firebase에 회원가입을 하시고 프로젝트 생성을 아직 못하셨다면 프로젝트 추가버튼을 눌러서 프로젝트를 등록하세요 프로젝트 만들기 총 3단계를 진행하시면 되구요 우선 애널리틱스도 사용 설정하도록 할게요 그러면 위처럼 애널리틱스 계정을 선택할 수 있는데요 계정선택을 누르셔서 새 계정 만들..