에바니네

Section 2 Summary

그냥 강의보면서 두서없이 적는 글입니다 하핳 https://www.npmjs.com/package/gravatar gravatar Gravatar Node.js library. Latest version: 1.8.2, last published: a year ago. Start using gravatar in your project by running `npm i gravatar`. There are 274 other projects in the npm registry using gravatar. www.npmjs.com 간단한 프로필 이미지를 자동으로 생성해주는 라이브러리다. 패키지 설치 후 gravatar 객체를 가져와 url함수에 문자열, 옵션, 프로토콜이 이렇게 3가지를 넣을 수 있는데, 프로토콜..

SWR 사용에 앞서서 axios 설정해두기

본격적으로 fetcher를 사용해서 SWR을 사용해야했다. 뭔가 추후 편리를 위해서 먼저 axios instance 생성 및 axios interceptor를 설정해줘야겠다는 생각을 하게 해주었다. 전 프로젝트에서는 이런식으로 모든 요청에 대해서 아래와 같은 식으로 인터셉터를 구현했다. 공홈에서 제시하는 그대로 ㅎㅎ;; https://axios-http.com/docs/interceptors Interceptors | Axios Docs Interceptors You can intercept requests or responses before they are handled by then or catch. axios.interceptors.request.use(function (config) { retur..

React.lazy랑 @loadable Component 차이 ?

제로초님 강의를 보면서 @loadable을 사용해보면서 처음 사용해봤는데, 내가 내 플젝에 썻었던 React.lazy랑 suspense를 이용한 코드 스플리팅과 달랐고, 뭐가 다른지 몰라서 궁금해서 찾아보았습니다. https://www.geeksforgeeks.org/what-are-the-differences-between-react-lazy-and-loadable-components/ What are the differences between React.lazy and @loadable/components ? - GeeksforGeeks A Computer Science portal for geeks. It contains well written, well thought and well explain..

CRA 없이 프로젝트 셋팅하기

제로초님 강의들으면서 CRA없이 프로젝트 구성하는 부분과 보면서 궁금해진거 찾아보며 정리한 글입니당. 일단 npm init을 하고나서 package.json과 package-lock.json 차이가 뭔지 궁금해서 좀 찾아봤습니다. package.json은 전반적인 간략한 프로젝트 정보와 메타 데이터를 갖고 있고, package-lock.json은 라이브러리 간에 상호 종속하는 버젼같은게 적혀있고, 좀 더 package에 대한 좀 더 자세한 내용이 담겨있네요. https://www.geeksforgeeks.org/difference-between-package-json-and-package-lock-json-files/ Difference between package.json and package-loc..

useEffect 와 useLayoutEffect의 차이 ?

https://blog.logrocket.com/useeffect-vs-uselayouteffect-examples/ React useLayoutEffect vs. useEffect with examples - LogRocket Blog Compare the useEffect and useLayoutEffect Hooks in React, looking into the inner workings and best use cases for each. blog.logrocket.com 공부 목적으로 번역하면서 정리한 글입니다. 오역있을 수 있음 ㅎ ㅎ; What’s the difference between useEffect and useLayoutEffect? Sprinkled all over the offi..

JS와 JSX 사이의 차이는 무엇일까여 ?

https://stackoverflow.com/questions/33042923/what-is-the-difference-between-javascript-and-jsx What is the difference between JavaScript and JSX? I am pretty new to React, I find most tutorial talked about JSX, I have not learnt any JSX syntax, but I am wondering if the main usage difference between JavaScript and JSX in React is only on the... stackoverflow.com 공부 목적으로 번역하면서 공부한 글입니당. JS is st..

REST가 뭘까요?

제가 학습하기 위해 적는 글입니다. REST (Representational State Transfer) refers to a group of software architecture design constraints that bring about efficient, reliable and scalable distributed systems. REST defines a set of features such as GET, PUT, and DELETE that clients can use to access server data. REST(Representational State Transfer)는 효율적, 안정적, 확장가능한 분산 시스템을 가져오는 아키텍쳐 디자인 제약의 그룹을 칭하는 말입니다. REST는 ..

S3 + Multer를 이용한 Image Upload

현재 MERN 프로젝트에서는 Image를 multer를 이용해서 local에 직접 이미지를 저장해서 사용하고 있었습니다. 하지만 이렇게 하다보니까 문제가 생겼습니다. 배포된 서버에서 이미지를 처음에 올리고 나서는 괜찮았지만 다음번에 접속하면 해당 이미지파일이 사라졌는지 모르겠지만 제대로 이미지를 보내주지 않더군요. 그리고 제가 알기로는 이상적으로 이미지를 관리하려면 따로 이미지만 다루는 스토리지를 구축하고 DB에서는 해당 이미지에 대한 full path를 제공하는거라고 알고 있습니다. 일단 S3 Bucket을 만들어야합니다. 이와 같이 체크할 거 체크해주고, 버킷만들어줍니다. IAM 에서 사용자 추가를 해줍니다. 접근을 하기위해서 엑세스 ID랑 비밀 엑세스 ID를 가져야하거든요. S3 Bucket으로 가..