웹개발 검색 결과

해당 글 4건

리액트 소스코드 크롬 소스에서 난독화

회사에서 일을 하면서 이야기 나온 이슈중에 크롬 개발자 도구에서 Sources에서 일반적으로 빌드 된 파일을 가지고 서버에 올렸을 때 내가 구현한 소스 코드가 보이지 않았으면 좋겠다는 말이 나왔다. 현재 개발 환경 세팅은 create-react-app 을 보일러 플레이트로 사용하고 있는 상황이고 MobX의 annotation을 사용하기 위해서 yarn eject를 진행한 상황이다. 프로덕션 레벨에서 정렬된 소스 코드를 보이지 않기 위해서는 빌드시 GENERATE_SOURCEMAP=false 옵션을 넣으면 된다. 현재 저 같은 경우는 package.json에 있는 scripts build를 위와 같이 수정하였고 빌드는 그대로 npm run build로 진행했다. 제목을 난독화라고 적었는데 사실 난독화라기보..
웹개발/리액트 React 2019. 1. 4. 18:33

[agularjs] 다국어처리 현지화 i18n angular-translate

국내 서비스가 아닌 해외에도 프로젝트를 알리기 위해서는 홈페이지의 현지화 작업이 필요합니다. 그렇게 하기 위해서는 다국어처리, 현지화, i18n 으로 불리는 것을 진행해야 하는데요. 검색하기에는 i18n 으로 하는게 좋더라고요. 말 그대로 글로벌한 홈페이지에서 볼 수 있는 영어, 한글, 중문 등의 언어를 선택하는 기능을 뜻합니다. 생각 해 볼수 있는것은 라우팅을 통해서 주소값을 다르게 한 HTML 을 하나 더 구성하는 것입니다. 물론 싱글페이지 어플리케이션에서는 주소값 라우팅을 통해 컴포넌트를 갈아까는 일이 되겠지요. 하지만 주소값 혹은 페이지 전체를 바꾸는 것을 원하지 않고 텍스트만 바뀌는 것을 원하는 경우가 있을 수 있습니다. 그렇게 하기위한 라이브러리들이 있을텐데요. 회사 프로젝트로 angularj..
웹개발/앵귤러 js angular 1 2018. 6. 29. 15:06

리액트 startsWith TypeError 문제 해결

크롬 개발 환경에서는 잘 되는 것이 IE11에서 테스트 시 TypeError가 발생하는 것을 확인하였습니다. 보통 이런 경우에는 polyfill이 설정 되어 있지 않기 때문인데요. 아마도 문제가 되는 부분은 얼마전에 붙였던 위지윅 에디터인 React Draft Wysiwyg 에서 발생함을 확인할 수 있었습니다. 역시나 인터넷 익스플로러는 개발자의 적이 분명합니다. 구글링 결과 문제점을 해결 할 수 있는 polyfill을 찾을 수 있었고 index.html 에 붙이니 더 이상 에러가 뜨지 않고 잘 동작됨을 확인할 수 있었습니다.
웹개발/리액트 React 2017. 11. 24. 10:56

리액트 위지윅 에디터(WYSIWYG) 비교

리액트 위지윅 에디터를 비교해보자 웹 개발을 진행하다보면 사용자 페이지에서는 잘 사용되지 않는 경우가 있지만 게시판이나 어드민쪽에서는 필수적으로 들어가야 할 요소가 바로 위지윅 에디터이다. 가장 좋은 것은 유료 제품을 구매해서 사용하는 것이겠지만 개인 프로젝트이거나 회사간 계약 상황에 따라서 무료 제품을 사용해야만 하는 경우가 종종 있음을 확인할 수 있었다. 이번 프로젝트에서는 무료 오픈소스 위주로 검색을 진행하였고 그 중에 2가지 선택지를 찾을 수 있었다. https://github.com/jpuri/react-draft-wysiwyg React Draft WysiwygRICH TEXT EDITOR FRAMEWORK FOR REACT인 Draft.js를 이용하여 만든 Wysiwyg 이라고 보면 될 것 ..
웹개발/리액트 React 2017. 11. 16. 00:00