전체 글
-
디지털 노마드 - 직장 없이 자유롭게 돈 버는 사람들을 읽고취미/도서 2019. 9. 30. 15:20
항상 취업 시장을 생각하면 보통 잡코리아나 사람인 같은 사이트에 들어가서 이력서를 내고 면접을 보고 취업을 하는 구조를 생각하고 있었는데 재택근무, 원격근무에 대해서 알아보다 보니 이 책을 알게 되었다. 최근에 국내 재택, 원격 근무를 지원하는 기업에서 디지털 노마드에 관련된 도서를 읽고 지원 자격이 된다고도 하였고 평상시에 디지털 노마드에 대한 단어랑 뜻만 대략적으로 알았지 이 부분에 대해서 잘 몰랐기 때문이다. 다음날 도서관에 가서 디지털 노마드 관련 도서를 찾아보니 이 책 말고도 여러 책이 있었지만 우선 이 책이 가장 유명한 것 같아 빌려보았다. 내 주변에서도 전통적인 사무실을 가진 직장인들도 있지만 생각해보면 내 주변에서도 그림그리는 직업으로 프리랜싱으로 돈을 벌고 있는 친구들이 꽤나 있다. 다만..
-
MySQL에서 받아온 데이터 중복 제거하기소소한 IT 이야기 2019. 8. 16. 13:45
최근에 유저 페이지 개발을 진행하면서 기술명으로 검색을 진행하였을 때 결과 데이터에서 발생하는 유저 데이터를 다시 반환하여 검색 결과를 표시해주려는 작업을 진행하면서 프로젝트들의 기술명으로 검색이 걸린 결과물을 반환하면 결국 유저 데이터들의 중복이 발생하기에 중복을 제거해야 한다는 문제점이 발생하였습니다. 지금까지 MySQL의 SQL문을 사용해본건 기본적인 SQL문과 그때그때 필요한 기능들을 검색해보면서 사용하고 있는데 이 부분으로 질문을 하면서 'distinct'라는 SQL문을 알 수 있게 되었습니다. 제가 기존에 사용한 코드는 아래와 같습니다. router.get(`/find-users/:queryString`, function(req, res, next) { let queryString = req...
-
Redux Dev Tools No store found 문제 해결 방법소소한 IT 이야기 2019. 7. 22. 12:39
생활코딩 Redux 강좌를 진행하면서 Redux Dev Tools를 설치하고 이를 활용하는 방법에 대해서 학습하고 있었는데 저의 경우에는 아무리 재시작을 해보아도 아래와 같은 오류가 지속적으로 발생하였습니다. Redux의 Basic Store 문서 항목을 살펴보면 아래와 같은 코드로 사용이 가능하다고 되어있습니다. const store = createStore( reducer, /* preloadedState, */ window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__() ); 제대로 작성한 것 같은데 작동이 되지 않고 콘솔 자체에서 문제가 발생하는 것도 아니니 답답해서 검색을 조금 하여보니 Redux Dev Tools은 탐..
-
React.js 앱을 Travis CI로 자동 gh-pages로 커밋하기소소한 IT 이야기 2019. 7. 16. 00:10
전부터 Travis CI를 사용하고 있었고 대략적으로 어떤것이다라는 것은 알고 있었는데 이번 기회에 Travis CI를 제대로 활용 할수 있었던것 같습니다. Travis CI는 Github의 Webhook 기능을 활용해서 Commit이 진행될 때 마다 Travis CI에서는 .travis.yml 파일에 설정된 대로 검사를 진행합니다. 기존에는 버전별 Node.js 에서 테스트를 진행하는 코드 검사만 진행하였지만 추가로 Github Pages에 Commit을 따로 넣어주는 작업을 추가하기로 하였습니다. 기존에는 Github으로 commit을 진행할때마다 npm run deploy 커맨드를 통하여 따로 변경 내용을 다시 Github gh-pages branch로 commit을 진행해야한다는 점이 굉장히 불편..
-
Github의 Automated Security Fix 기능 활용하여 보안 문제 해결하기소소한 IT 이야기 2019. 7. 11. 17:30
포트폴리오 관리도 해야하고 버전관리도 해야하다보니 Github에 들락날락 자주하는 편인데 항상 우측 상단에 알람 표시가 들어가 있어서 확인을 하여보면 Security Alarm인 경우가 많더군요. 항상 방치만 해오다가 레포지토리를 정리하는 과정에서 한번 해결을 해야겠다 싶어서 확인해보니 Github에서 Automated Security Fix라는 기능을 제공합니다. Dependabot이라는 회사? 에서 제공하는 기능인듯한데 Github 자체에도 포함되어 있나봅니다. 우선 문제가 발생하고 있는 레포지토리중 하나를 캡쳐해보았습니다. high severity라는걸 보니 뭔지는 몰라도 심각한 문제인가 봅니다. 저기서 엄청 편리한 기능이 일일히 오류 하나하나 들어가보지 않아도 Automated Security F..
-
Cloudflare 서비스 장애 발생 시 오류 UI 개발기프로그래밍/JavaScript 2019. 7. 3. 14:13
가상화폐 시세 테이블 React 앱 개발 도중에 계속 생각했던 것이 새로 데이터를 계속 가져와서 데이터를 변경해줄 때마다 중간에 오류가 발생하였을 때 UI 적으로 방문자들에게 오류가 발생했음을 실시간으로 보여주고 싶었습니다. 이 앱을 개발하면서도 가상화폐 시세가 고정되어있는 경우도 있으니 실제로 데이터가 새로 갱신되고 있는데 계속 보고 있는 경우도 있어서 개발자 입장에서도 실제로 데이터를 제대로 가져오고 있는지 확인이 가능했으면 좋겠다 싶었습니다. 물론 구글 크롬의 ReactJS 확장프로그램을 설치하면 해당 정보들을 확인이 가능하지만 일반적으로는 이러한 정보의 확인이 불가능하기 때문에 개발 필요성을 계속 생각하고 있었습니다. 게다가 마침 어제 Cloudflare의 서비스 장애가 발생하면서 Cloudfla..
-
React 프로젝트에서 이미지 import하는 방법프로그래밍/JavaScript 2019. 7. 2. 16:32
ReactJS 프로젝트에서 이미지를 사용하려 했더니 또 경로 문제인지 제대로 이미지를 로드 못하는 경우가 있습니다. Create-React-App을 사용해서 React 앱을 개발하면 public이라는 디렉토리가 존재하는데 간단히 여기에 이미지 폴더를 생성하고 이미지 주소를 로드하는 방법을 검색했더니 import을 사용하라는 사람도 있고 여러 가지 방법이 존재했는데 가장 간단한 방법은 허무하게도 아래 방법을 사용하면 되었습니다. 물론 Import을 사용하는 방법도 존재했지만, 여러개의 이미지 또는 파일을 로드할 코드가 지저분해 보일 수 있는 문제점이 존재하므로 이러한 경우에는 직접 경로를 지정해주는 것이 가장 좋은 방법인 것 같습니다. // public/images/ Folder Directory 참조 h..
-
JavaScript 객체 Key 값을 받아 value값 반환하기프로그래밍/JavaScript 2019. 7. 2. 14:40
최근에 ReactJS로 개발하고 있는 가상화폐 시세 테이블을 개발하던 도중에 API에서 코인 이름들을 받아와서 한글로 표현하고 싶었는데 마땅한 방법이 생각나지 않았습니다.. 처음에는 어짜피 key값은 API를 통해서 받아오니 빗썸의 웹사이트에서 코인 한글 이름을 따로 파싱해서 받아올까도 생각했지만 코인이 일단 87개이고..(API에서 제공하는) 그렇게되면 총 87번의 요청이 발생하게되니 굉장히 마음에 안드는 모양새가 만들어질것같아 차라리 객체를 만들어 개발자가 추가적으로 지정해줌이 더 나은 선택으로 보였습니다. 다만 객체를 만드는 과정에서 일일히 타이핑을 할까 생각하다가 일단 key값은 빗썸 API에서 제공해주므로 적절하게 수정하면 한글만 타이핑하면 되겠다는 생각이 들었습니다. 우선 빗썸 API를 요청한..