전체 글

1년차 프론트엔드 개발자입니다 😣 아직 열심히 배우는 중이에요! 리액트를 하고있어요 :) - gueit214@naver.com - https://github.com/gueit214
개발 일지/에러 처리

[에러 처리] "The operation was rejected by your operating system"

😡 에러 상황 Vite를 vercel을 이용하여 배포하려고 Vite공식 문서를 따라하고 있었다. $ npm i -g vercel로 전역으로 vercel을 설치하려는데 에러가 발생한 것이다. 이번에 교체한 맥 OS의 문제라고 한다. 🧐 대응한 방법 혹시나 하는 마음에 이 코드를 복사해서 chatGPT에게 물어보았다. 👏 해결 방법 global로 설치를 하려니 권한이 없어서 발생한 에러라고 한다. 에러 원인과 함께 $sudo npm i -g vercel을 입력해보라고 조언해주었다. 입력해보니! 시원하게 해결이 되었다. 🤔 느낀점 Wow.. 에러 메시지가 길어서 구글을 통해서 해결했으면 검색하는데 상당히 걸렸을 것이다. chatGPT에 검색하니 1초만에 답을 내주었다. 최근에 온보딩 프론트엔드 강연에서 들은 ..

코딩 테스트/LeetCode

[4월 15일] container-with-most-water

📙 1. 문제 Link : https://leetcode.com/problems/container-with-most-water/description/ 문제 설명 You are given an integer array height of length n. There are n vertical lines drawn such that the two endpoints of the ith line are (i, 0) and (i, height[i]). Find two lines that together with the x-axis form a container, such that the container contains the most water. Return the maximum amount of water a ..

코딩 테스트/LeetCode

[4월 14일] Palindrome Number

📙 1. 문제 Link : https://leetcode.com/problems/palindrome-number/description/ 문제 설명 Given an integer x, return true if x is a palindrome, and false otherwise. # palindrome : An integer is a palindrome when it reads the same forward and backward. For example, 121 is a palindrome while 123 is not. 제한 사항 -2^31

코딩 테스트/LeetCode

[4월 14일] String to Integer

📙 1. 문제 Link : https://leetcode.com/problems/string-to-integer-atoi/description/ String to Integer (atoi) - LeetCode Can you solve this real interview question? String to Integer (atoi) - Implement the myAtoi(string s) function, which converts a string to a 32-bit signed integer (similar to C/C++'s atoi function). The algorithm for myAtoi(string s) is as follows: 1. Read leetcode.com 문제 설명 Imple..

개발 일지/개발 일지

[개발 일지] React Query - Custom Hook 만들기 (+Typescript)

📚 1. 사전 지식 참고 링크 : React Query, Custom Hook, React-query에 Typescript 적용하기 React Query란? React Query는 서버의 값을 클라이언트에 가져오거나, 캐싱, 값 업데이트, 에러핸들링 등 비동기 과정을 더욱 편하게 하는 데 사용된다. React Query의 장점으로는, 아래의 구현하기 귀찮은 일들을 대신 수행한다. 캐싱 get을 한 데이터에 대해 update를 하면 자동으로 get을 다시 수행한다. (예를 들면 게시판의 글을 가져왔을 때 게시판의 글을 생성하면 게시판 글을 get 하는 api를 자동으로 실행 ) 데이터가 오래 되었다고 판단되면 다시 get (invalidateQueries) 동일 데이터 여러번 요청하면 한 번만 요청한다. ..

코딩 테스트/LeetCode

[4월 11일] Reverse Integer

📙 1. 문제 Link : https://leetcode.com/problems/reverse-integer/description/ 문제 설명 Given a signed 32-bit integer x, return x with its digits reversed. If reversing x causes the value to go outside the signed 32-bit integer range [-231, 231 - 1], then return 0. Assume the environment does not allow you to store 64-bit integers (signed or unsigned). 제한 사항 2 ≤ weights의 길이 ≤ 100,000 100 ≤ weights[i] ≤ ..

개발 일지/개발 일지

[개발 일지] JWT + 소셜 로그인을 정복해보자 (React + Spring Boot, Kakao Login, Naver Login)

📚 1. 사전 지식 JWT란? JWT(Json Web Token) : Json 포맷을 이용하여 사용자에 대한 속성을 저장하는 Claim 기반의 Web Token 토큰 자체를 정보로 사용하는 Self-Contained 방식으로 정보를 안전하게 전달 주로 회원 인증이나 정보 전달에 사용되는 JWT는 아래의 로직을 따라서 처리 애플리케이션이 실행될 때, JWT를 static변수와 localStorage에 저장한다. static변수에 저장하는 이유는 HTTP통신을 할 때마다 JWT를 HTTP헤더에 담아서 보내야 하는데, localStorage에서 계속 불러오면 overhead가 발생하기 때문이다. 클라이언트에서 JWT를 포함해 요청을 보내면 서버는 허가된 JWT를 검사한다. 또한, 로그아웃을 할 경우 local..

개발 일상/개발 회고

[개발 회고록] 4월 1주차

💭 1. 이번 주엔 어떤 일들이 있었고, 그 속에서 나는 어떤 것을 느꼈을까 4월 2일(일) 📜 오늘도 CS공부 CS공부 복습과 함께, 프런트엔드 개발 면접에서 물어보는 질문들 위주로 공부했다. 핵심 1. 일급 객체 : JS에서 특별한 대우 받는 것들. 그중 하나가 함수 : 변수에 할당 & 인자로 전달 & 결과로 리턴 2. 고차 함수 : 인자로 전달하거나, 결과로 리턴하는 함수 (일급 객체의 일부) 3. var은 함수 레벨 스코프(호이스팅 O->선언되기도 전에 undefined) const, let은 블록레벨 스코프 지원 가지가 흔들리지 않게 뿌리를 깊이 심자 4월 3일(월) 📜 프리온보딩 프론트엔드 챌린지 4월 오늘의 강의의 메인 주제는 VirtualDOM이었다. VirtualDOM과 그 외의 유용한 ..

피터s
피터의 성장기록