react query는 아무 옵션을 설정하면 않으면 ❗️ 캐싱되지 않는다. ❗️❓why❓staleTime 과 cacheTime의 기본값이 각각 0분 과 5분 이다. 따라서 데이터는 캐싱 되지만, staleTime 이 0분 이므로 항상 caching 되어 있는

Prettier, ESLint를 배우고 코드 가독성을 위한 관리가 필수라는 걸 깨달았다. 내 코드를 읽는 다른 사람을 위해서도 코드를 작성하는 나를 위해서도 적절한 포맷팅이 필요하기 때문에! ESLint와 Prettier을 설정해보자.Mac OS로 넘어온 이후 다시 P

Javascript에서는 fetch로 리소스를 비동기 요청을 할 수 있다. fetch 는 Promise 객체를 리턴한다.비동기 처리란, 시간이 소요되는 작업이 완료될 때까지 계속 기다리지 않고 따로 처리하며, 일단 다른 코드들도 먼저 실행할 수 있게끔 하는 작업이다.이

하는 질문에서 출발했다. 하는 기능은 비슷한 것 같은데 어떤 상황에서 Link 혹은 button 컴포넌트를 사용하는 것이 적절한가 궁금해졌다.button ✅does something, a link ✅goes somewherebutton 은 웹사이트의 상태(state)를

팀으로 개발해본 적이 약 2년? 전에 인턴 6개월 했을 때 빼고 없는지라 git 사용법을 많이 까먹었다..그 당시에도 호다닥 하느라 git을 제대로 익히지도 못하고 사용했다.원티드 프리온보딩 인턴십 과정 동안 많이 공부해야겠다.

github에서 제공하는 무료 서비스로, 결과물을 github pages에 업로드 할 수 있게 해주는 패키지package.json에 "scripts" 아래를 보면 “build” 가 있다.이 scripts를 실행하면 웹사이트의 production ready code를 생

업로드중..프리온보딩 프론트엔드 인턴십 바로가기 프리온보딩 인턴십은 교육형 인턴십 프로젝트이다.프리온보딩 인턴십을 통해 체계적인 과제를 수행하고, 기술적인 역량과 협업역량을 향상하여 취업까지 성공하는 것이 목표라고 할 수 있다.대학교 4학년 1학기 때 학교 연계형 인턴

다양한 form 관리 방법과 라이브러리들 중 리액트에서 form으로 작업하기에 좋은 방법이다.회원가입 기능을 구현하기 위해서는 입력으로 받아야 하는 값이 이메일, 이름, 성, 비밀번호, 비밀번호 확인 등 정말 많다.react hook form을 사용하지 않는다면, fo

State Management 없이 Toggle을 구현해보면, ThemeProvider를 App() 로 옮겨주고, useState를 사용하여 구현할 수 있다.위처럼 toggleDark를 Component 간 계속 전달해줘야 한다!!!이것이 바로 Global State이

리액트(React) 기반으로 제작된 UI 라이브러리 중 가장 인기 있는 라이브러리. 레퍼런스도 많고 커스터마이징도 잘 된다.여기에서 설치 관련 정보를 확인하자.아래처럼 각종 아이콘 종류를 확인할 수 있다. 위처럼 보라색 홈 버튼을 만들어보자.react-router 의

styled-components 사용 시, 자동완성 기능이 꼭꼭 필요하다!!!!extension으로 vscode-styled-components를 설치하면 되는데, 설치했는데도 적용이 안 되는 문제가 발생했다..여기를 보면 아래 JavaScript and TypeScr

보편적으로 fetch 대신 async-await를 사용한다.대신굉장히 중요 👉 key, 고유한 값을 주어야 한다!!!key는 React.js에서 map 안에서 component들을 render할 때 사용하는 것이다. api로 불러온 영화들의 제목들을 보여주려면?api

계속 다시 render될 때마다 반복실행되어도 괜찮은 코드가 있을 수 있다.하지만, 컴포넌트가 처음에 render될 때만 코드가 실행되길 원할 수 있다.🚩 API를 통해 데이터를 가져올 때: 첫 번째 component render에서 API를 call, 이이후 sta

✨Point는 Divde and Conquer이다.먼저 node.js와 npx을 설치한다.위 두 명령어가 실행되면 제대로 설치된 것이다.그럼 자동으로 위처럼 웹페이지가 열린다.create-react-app으로 application을 만들 때 CSS에 관해 아래와 같이

업로드중..React에서 핵심은 필요한 기능을 하나의 component로 만들 수 있다는 점이다. 로직을 갖는 컴포넌트를 만들고, 이 컴포넌트를 또 재사용할 수 있게 된다.📌 component란 어떤 JSX를 반환하는 function이다.무엇이 component가 되

💡React의 State state는 기본적으로 데이터가 저장되는 곳이다. 어떻게 하면 React.js 어플에 값이 바뀔 데이터를 담아줄 수 있을까?

React는 UI를 interactive하게 만들어준다.웹사이트에 interactivity(상호작용)을 아주 간단하게 만들어준다. React JS와 Vanilla JS를 비교해보자! 버튼을 몇 번 클릭했는지 세는 어플을 만들어보고Vanilla JS에서 React JS

⌨️ Background Tasks background task가 응답(response)를 return 한 이후에 실행되도록 정의할 수 있다. Background Task request(요청) 이후에 수행되어야 하는 작업들에 유용하다. 이 때 클라이언트는 respon

A "middleware" is a function that works with every request before it is processed by any specific path operation. And also with every response before

말로만 듣던 CORS를 직접 보게 되었다.. 일단 열심히 구글링해보고 있는데 일단 오류 메시지는 아래와 같다.Access to XMLHttpRequest at 'http://127.0.0.1:8000/sentence_similarity' from origin