어쩌다 블로그

6월은 글쎄 그냥 정신이 없었던 것 같다 :( 늘 그랬지만.. 7월 운세를 봤는데 싱그럽게 새로운 것을 배우고 받아들이는 시기라고 하니 기대해봅니다... 지금 까지도 열심히 해왔다고 자부하지만 7월은 더 더 많이 공부하고 싶다. 하반기라니. 29라니.. 학원에 다니기 시작할 때엔 7월은 너무 먼 시기라고 생각했는데 또 금방 와버렸다. 다들 너무 보고 싶을 것 같고 아직 너무 부족하단 생각. 예전에와 비교하면 나도 참 에러핸들링 할 때에 아주 미미하게 조금 침착해짐을 느낀다. 앞으로도 작은 사고에도 흔들리지 않고 침착하게 대처할 수 있는 내공이 쌓인 개발자가 되고 싶어라.. 큰 나무 같은 사람이 되어야지.. 운 좋게도 면접을 볼 수 있었다. 저를 너무 좋게 봐주셔서 감사했다며.. 지옥에서 온 초당옥수수밥...

1. Request Header @RequestHeader("header의 값") HTTP request의 Header를 위의 애노테이션으로 받을 수 있다. @RequestMapping("/displayHeaderInfo.do") public void displayHeaderInfo(@RequestHeader("Accept-Encoding") String encoding, @RequestHeader("Keep-Alive") long keepAlive) { ============ } 이런 식으로 받을 수 있다. Request Header의 값을 자바 값으로 치환해주는 애노테이션이다. 2. Request Body HTTP Request의 Body부분을 자바의 객체로 변환시켜줌 @RequestBody 3. R..

Toast UI Editor는 이미지 업로드 시 이미지가 base64의 형태로 자동 변환되어 업로드된다. base64는 엄청 긴 문자열이기 때문에 이를 데이터 베이스에 업로드시 여러분의 데이터 베이스는 살아남지 못할 것 그래서 이미지 업로드시 콜백 함수로 서버의 어떤 위치에 저장을 한 후에 해당 사진의 url을 리턴 값으로 받아서 에디터에 출력시켜주어야 한다. TUI Editor가 요즘 뜨는 신흥강자라고 해서 나도 이번 프로젝트에 적용하며 사용해보다가 저 부분을 개선하기 위해 인터넷을 서칭해보고 addImageBlobHook을 이용하면 된다는 걸 보고 적용하려 했는데 base64랑 url이 두 개 다 삽입이 되는 것이다...ㅠㅠㅠㅠ 개선하기 위해 해당 깃 헙의 이슈를 뒤졌는데 해결한 분이 있긴 했다. h..

일단 맨 처음엔 외국 문서위주로 읽었는데 대충 알겠는데 감이 잘 안옴... 코드는 알겠어... 근데 순서를 어떻게 설정하지? 한국 문서 먼저 여러가지를 쭉 읽었슴다.. https://charlie-choi.tistory.com/236 https://ecsimsw.tistory.com/entry/AWS-%EC%82%AC%EC%9A%A9%EA%B8%B0-S3-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0?category=989733 이 두 가지를 제일 많이 참고했어요 감사합니다...ㅎㅎ 그리고 https://www.baeldung.com/aws-s3-java 이걸 읽고 제일 필요한 핵심기능이 뭔지 감을 잡고, 설정하는 부분이라던지 비즈니스 로직은 저 두 분의 문서를 보면서 최대한 코린이인..

이미지 업로드 할 때마다 로컬 서버의 메타 데이터에 저장되서 약간 싫었다... 여러 조원들이 함께 개발하는데 함께 이미지정도도 공유를 못한다는 게 살짝 개발효율이 떨어지기도 한다는 생각도 들고... AWS S3 Bucket이 비싸지도 않고 편리했던 기억이 났다... 노드에서는 쉬웠는데... 한 번 해볼까? 그래서 자료조사를 해봤는데 부트 예제는 많았는데 소수의 한국어 예제 사이에서 스프링 MVC예제는 별로 없었다.. 근데 왠지 될 것 같았다 (?!)아..나의 쓸데없는 무한 긍정;; 지금 사용하는 레거시 스프링 서버에서는 잘 될지는 모르겠지만 한 번 도전해볼법 하다고 생각했다. 딱 하루만 도전해보자...난....카리스마있는...신녀성이니까....!(그리고 카리스마는 없었고 코드만 남았다.) 1. AWS에 ..

최고의 공부는 역시 코딩이지~ 싶어서 이론에 대해 탄탄히 살펴볼 생각없이 구현시 필요한 것만 찾아가며 공부했는데 이론이 부족해 실수도 많이하고 어딘가에서 자꾸 좋은 코드를 못 짜고 벽에 부딪히고 있다는 생각이 자꾸 들더라.. 역시 제대로 공부해보는 경험이 필요할 것 같다는 생각이 들던 와중 카우치 코딩이란 곳에서 React 에 관한 이론 스터디를 진행한다고 하여 참여하였다. ( React 공식 사이트 + 스터디 조합의 이론공부가 정말 좋을 것 같다 두 개가 얻을 수 있는 결과물이 다르다 ) 그동안 학원 공부 하겠다고 스프링 및 Java 위주의 공부를 하며 MVC패턴만 하다가 오랜만에 리액트 코드를 만드니 살짝 어색했었는데 파이널 프로젝트에 리액트를 적용하게 되어 도움이 되고 있다. 혹시라도 카우치 코딩 ..

Redux Middleware and Redux Thunk 리덕스의 미들웨어는 액션이 디스패치되어서 리듀서에서 이를 처리하기 전에 사용할 수 있는 것들을 사전에 설정해서 사용할 수 있게 해줍니다. applyMiddleware 를 이용해 등록하여 사용할 수 있습니다. 리덕스 미들웨어의 기본 템플릿 const middleware = (store) => (next) => (action) => { //do something }; 위의 템플릿은 하단의 예제와 같습니다 . 함수를 연달아 리턴해주는 함수를 화살표 함수로 나타낸 것입니다. function middleware(store) { return function (next) { return function (action) { // 하고 싶은 작업... }; };..

어쩌다보니 Spring MVC 서버를 이용해 REST API서버를 만들고 있는데 이러다 보니 쓸 수 있는 디펜던시가 매우 제한적이고 불편하긴 하더라 아무래도 리액트와의 연동은 부트와 하는 편이 많으니.... Spring에서 CORS에러는 Spring Security의 Cors를 이용해서 CSRF 공격 방어와 동시에 해결이 가능한 줄만 알았는데 Spring에서 설정파일의 CORS옵션을 제대로 못 읽는 문제 등이 발생해 response header를 Filter단에서 request값을 이용해 직접 설정을 해주었다. React단의 오류에서 힌트를 얻었다. access-Control-Allow-origin header의 값이 세팅이 되지 않았다고 하면서 거기에 세팅 되어져 있는 값까지 뜨는데 자꾸 localho..

Constate Context를 사용하고 싶은데 다루어야 하는 상태가 많아진 상황에서 성능도 챙기고 개발도 편리하게 하고 싶을 때 Context는 리덕스보다 쓰기 쉽다는 장점이 있지만 Context 상태 중 의존하지 않는 다른 값이 바뀌게 될 때에도 컴포넌트가 렌더링 된다는 단점이 있었음 그렇기 떄문에 ContextAPI를 이용할 때 Context 를 구독하는 값마다 적절히 쪼개줘야하는 작업이 필요했다. constate 함수에 넣는 selector들을 기반으로 Context들이 자동으로 만들어지고 Context를 사용하는 Hook도 자동으로 만들어진다. useState, useReducer를 그냥 사용하면 되기 때문에 추가적으로 배울 것이 없다. 사용법 npm install constate constat..

Node란 Node란? Chrome V8 engine으로 빌드된 Javascript 런타임 서버 노드를 통해 다양한 자바스크립트 애플리케이션을 실행할 수 있지만, 노드는 서버 애플리케이션을 실행하는 데에 제일 많이 사용된다. 기존에는 자바스크립트 프로그램을 브라우저 위에서만 작동시킬 수 있었다. 브라우저 외의 환경에서 자바스크립트를 실행시키기 위한 노력이 많이 있었으나, 자바스크립트의 실행 속도 문제 때문에 모두 큰 호응을 얻지 못했다. 하지만 2008년 구글이 v8엔진을 사용하여 크롬을 출시하자, 기존의 브라우저 엔진과 비교해 상당히 빠른 속도로 인해 많은 호응을 얻었고, 라이언 달은 2009년 노드프로젝트를 시작하였다. 노드는 v8과 더불어 libuv 라는 라이브러리를 사용한다. v8과 libuv 는..