💭 1. 이번 주엔 어떤 일들이 있었고, 그 속에서 나는 어떤 것을 느꼈을까 4월 16일(일) 📜 oopy블로그 꾸미기 oopy블로그를 꾸몄다! 정확히 말하면 나를 표현하는 자기소개서이자, 이력서이다. 내 이력서가 이렇게 예쁘니 들어갈 때마다 기분이 좋다 ㅎㅎ. 그리고 이 문구의 코드는 github repository에 저장해두었다. 앞으로 커스텀해서 만들 때마다 하나씩 추가해야지. 📜 Python Selenium 시험 기간이여서 그런가, 학교 공부 빼고는 뭘 해도 재미있는 거 같다. 특히 평소에 해던 프런트엔드보다는 다른 분야에 손가 눈이 간다. 예전에 만든, Python Selenium을 이용한 블로그 매크로를 손 보았다. 조만간 github에 public으로 업로드할 예정이다. 매크로는 삶을 풍요롭..
😡 에러 상황 Next.js의 getStaticProps메소드를 사용하여 서버로부터 데이터를 미리 받아오는 코드 구현하던 중, 에러 발생 // pages/test.tsx import Layout from '@components/common/Layout'; import React from 'react'; import instance from '@apis/_axios/instance'; const Test = ({ data }) => { console.log(data); return ; }; export const getStaticProps = async () => { const data = await instance.get('/members/me'); return { props: { data: data...
🧐 1. 주제 Vite란? 참고 : vite Vite? Vite가 뭔데 이렇게 뜨는 걸까. Vite가 뜰 거다라고 몇 개월 전에 듣고 흘린 적이 있는데, 며칠 전에 들은 강의에서 강사님이 'Vite 꼭 쓰세요'라는 말을 듣고 'Vite가 이 정도인가?'라는 생각과 함께 Vite에 대해 큰 흥미를 불러일으켰다. 'Vite'는 프랑스어로 '빠르다'를 의미한다. 아래와 같은 두 가지 콘셉트를 중심으로 하고 있다. 1. 개발 시, Native ES Module을 넘어 더욱 다양한 기능 제공 : HMR(Hot Module Replace) 2. 번들링 시, Rollup 기반의 다양한 빌드 커맨드 사용 이 두가지 특징들로 인해 개발자들이 더욱 빠르고 쉽게 애플리케이션을 개발할 수 있도록 돕는다. Vite와 Next...
💭 1. 이번 주엔 어떤 일들이 있었고, 그 속에서 나는 어떤 것을 느꼈을까 4월 9일(일) 📜 CS공부 오늘의 핵심 1. JWT : 인증과 권한 부여를 위해 사용되는 JSON 기반의 토큰 보안을 위해 accessToken은 cookie에 저장하여 XSS(Cross Stie Scripting)을 막고, refeshToken은 localStorage에 저장하여 CSRF(Cross Site Request Foregery)를 막는다. 2. CORS : 웹 브라우저에서 실행되는 스크립트가 다른 출처의 리소스에 접근하는 것을 허용하는 보안 방식. 여기서 다른 출처란, 프로토콜, 호스트, 포트 중에서 하나라도 다른 것 3. reconsiliation : React가 가상 DOM과 실제 DOM을 비교하여 변경된 부분..
😡 에러 상황 Vite를 vercel을 이용하여 배포하려고 Vite공식 문서를 따라하고 있었다. $ npm i -g vercel로 전역으로 vercel을 설치하려는데 에러가 발생한 것이다. 이번에 교체한 맥 OS의 문제라고 한다. 🧐 대응한 방법 혹시나 하는 마음에 이 코드를 복사해서 chatGPT에게 물어보았다. 👏 해결 방법 global로 설치를 하려니 권한이 없어서 발생한 에러라고 한다. 에러 원인과 함께 $sudo npm i -g vercel을 입력해보라고 조언해주었다. 입력해보니! 시원하게 해결이 되었다. 🤔 느낀점 Wow.. 에러 메시지가 길어서 구글을 통해서 해결했으면 검색하는데 상당히 걸렸을 것이다. chatGPT에 검색하니 1초만에 답을 내주었다. 최근에 온보딩 프론트엔드 강연에서 들은 ..
📙 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 ..
📙 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
📙 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..
