Develop+

담당하고있던 서비스에서 webpack 설정이 복잡하고 까다롭기 때문에 webpack 설정 + 개발환경을 도와주는 라이브러리 roadhog를 사용했다. 계속 사용해도 나쁘지 않았지만, 서비스가 커지면 커질수록 문제점이 생겼다. roadhog npm(참고) https://www.npmjs.com/package/roadhog 문제점은 webpack 설정에 관련된 af-webpack 과의 강한 의존성 roadhog는 업데이트가 더이상 되지 않아 많은 패키지들이 더이상 호환되지 않는다. 중국어로 된 docs. 영어docs 는 매우 불친절... 사용하는 사람이 적어 정보를 찾기가 힘듬. 등이 되겠다. 지금까지 왜 걷어내지 않았는가? 를 생각해보면, 서비스가 커지면 커질수록 기본 환경을 전부 설정하고있는 roadho..

기존에 Vue로 만들어진 프로젝트를 React로 변환하는 작업을 하는 중에 잘 실행을 시켰지만 프로젝트가 빈 화면을 띄우며 터미널에서는 에러를 뱉어냈다. // In the Terminal No issues found. URIError: Failed to decode param '/%3C%=%20BASE_URL%20%%3Efavicon.ico' at decodeURIComponent () . . . http://localhost:8080 포트에 올려 작업을 했는데, 이상하게 실행이 되지 않는다..! 구글링을 통해 에러를 검색해보니 vue.config.js파일 내에 BaseUrl 또는 PathUrl 옵션에 에 무슨 문자열이 셋팅 되어있을 것이기 때문이라는 코멘트를 찾을 수 있었다. vue.config.js를..

자바스크립트를 타입스크립트로 마이그레이션 중 만난 에러, 타입스크립트에서는 사용할 변수의 타입을 지정해줘야한다. 기존 자바스크립트에서는 porpsType 등 플러그인을 사용해 Props의 타입을 지정해주기도 했지만 선택사항이었다. 타입스크립트에서는 받을 Props와 사용할 State에 대한 인터페이스 제너릭을 사용해 명시해 줄 것을 요구한다. Property '' does not exist on type 'Readonly & Readonly' > 위 링크를 참고하여 에러를 해결하였다. 타입스크립트는 런타임에서 날 에러를 컴파일타임에서 미리 잡아준다. 빨간 줄이 난 부분에 마우스를 올려보면 저러한 에러가 뜬다. 해결방안 Props와 State의 타입을 인터페이스로 선언하여 클래스 extends Compon..

마이그레이션에 들어가기 전 준비사항/알고가야하는 사항들! jsx 가 들어간 문법은 .ts가 아닌 .tsx로 확장자를 변환해줘야한다. 루트에 tsconfig.json 파일을 생성 해줘야 함 (대부분의 설정 오류들이 tsconfig.json을 수정하여 해결 가능하다.) .less 등 모듈을 declare 해서 타입을 지정해줘야지 사용할 수 있다. 오류 목록 Cannot use JSX unless the '--jsx' flag is provided 수정 파일 = ./tsconfig.js "include": [ "./src/**/*.ts" ] tsconfig.json 에서 "./src/**/*"로 설정되어있던 값을 "./src/**/*.ts"로 바꾸어 타입스크립트에서만 적용될 수 있도록 설정하면 에러 해결, 이..

정말 오랜만에 블로그에 들어와서 글을 남겼는데 그 동안 생각보다 많은 방문자가 있었다는 것에 놀랐다..! 7-8월 내내 나는 내 블로그에 1번도 들어오질 않았는데 저번달에는 756명이나(내 기준 엄청 많음!) 내 블로그에 와주었다.. 진짜 소홀해져있었는데 이 통계가 나를 정말 반성하게 만들었다. 누군가 내 글을 보고 도움을 얻어 갈 수도 있다는 생각이 나에게 동기부여를 주는 것 같다! 앞으로 열심히 할게요 많이 와주세요 ^____^!

7월 초에 판도라티비에 프론트앤드 개발자로 취업을 하게 되었다. (이 전 포스팅에서는 서버개발자로 취업을 하려고 하였으나... ㅎㅎ 역시 프론트로 가는 게 맞는 거 같았다.) 그 이후로 스트레스를 해소하고 싶었던 건지 마음껏 놀고 싶었던 건지, 블로그에도 깃허브에도 포스팅이나 커밋을 오랫동안 하지 않았다. 그래도 양심은 있는지... 속으로는 마음이 좋지 않았다..ㅎㅎ 사실 내 블로그를 보는 사람은 많지 않지만(거의 없지만) 혼자서라도 꾸준히 기록을 남기는게 좋을 거 같다고 생각한다. 그러면 언젠가 사람들이 많이 많이 찾아와주지 않을까? 속으로는 아무것도 하지 않고 놀고 있는 내 모습에 초조해하며 책 한권을 구매했다. "머릿속으로 그리는 리액트 프로그래밍"이라는 책이다. 입사하고 처음으로 리액트를 사용하여..

Css 프리프로세서란? CSS를 변수나 Nested Rules을 이용하여 쉽고 빠르고 체계적으로 프로그래밍 할 수 있게 만든 것 프리프로세서의 종류 > sass, less, stylus콜론( : ), 세미콜론( ; ) 을 생략할 수 있다. - Sass는 .scss, LESS는 .less, stylus는 .styl 확장자를 사용한다. - Sass와 LESS는 모두 표준 CSS 구문을 사용하고 Stylus는 표준 CSS구문을 허용하지만 중괄호( {} ) Sass (Syntacticall awesome style sheet) = 구문적으로 꽤 괜찮은 스타일시트 사전적 정의 - css 상위에 있는 meta - language 로 CSS에 비해 간결하고 격식을 갖춘 css문법을 제공 스타일시트를 쉽게 관리할 수 ..

나는 멍청하게 정보처리 산업기사 책을 샀다.. 그래서 그거 일주일 공부하다가 표지가 다르다는 걸 깨닫고 정보처리기사 (고흐) 교제를 다시 샀다... ㅋㅋ 바보...!!! 개정된 이후로 정보처리기사가 많이 어려워졌다고 해서 잔뜩 겁 먹었었는데 일주일 공부한 거 치고 생각보다 잘 나와서 깜짝 놀랐다.. ㅎㅎㅎ 시험 결과는 생각보다 정말 잘 나왔다!! 100점이 3개나 된다니 ㅎㅎ..! 일단 공부는 시나공 필기책을 샀고 양이 상당했지만 일주일 동안 죽어라 1회독을 했다. 학원 공부와 필기를 같이 병행하려니 죽을맛이었지만 그래도 쇠뿔도 단김에 빼라고 ㅎㅎ 오기를 가지고 했다. 생각보다 양이 많았고 공부하려는 사람들에게 팁을 주자면 시나공에는 A, B, C, D 로 섹션이 나뉘는데 A, B 정도만 봐도 충분히 합..