분류 전체보기68 프로그래머스 - 최댓값 만들기(1) 생각하기1. numbers 안의 최대값을 구한다.2. 구한 최대값을 제외한 배열에서 다시 최대값을 구한다.3. 두수를 곱한 값을 리턴해준다.function solution(numbers) { const max1 = Math.max(...numbers); const max2 = numbers.pop(max1); return max1;} 바로 오류가 떴다왜??.pop()pop() 메서드는 Array 인스턴스의 메서드로, 배열에서 마지막 요소를 제거하고 그 요소를 반환합니다. 이 메서드는 배열의 길이를 변경합니다. 그렇다.. pop 메서드는 내가 원한대로 .pop(max1); 가 실행되지 않는다. 그러면 max1을 제거한 배열을 어케 구할까?https://developer.mozilla.org.. 2025. 8. 8. [프로그래머스] - 피자 나눠먹기(1) 생각하기1. 피자조각 7조각.2. 인당 1조각 이상 먹어야 한다.3. 8명이 먹으려면 2판이 필요하다. 7으로 나누었을때 8명이라면 8 / 7 = 1.14... → 올림 해주어야 한다. https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Math/ceil Math.ceil() - JavaScript | MDNMath.ceil() 정적 메서드는 언제나 올림하여 주어진 숫자보다 크거나 같은 가장 작은 정수를 반환합니다.developer.mozilla.org Math.ceil() 메서드는 무조건 정수로 올림해주는 자바스크립트 메서드 이기 때문에 이 문제에서 적합하다고 생각하였다.Math.ceil(-Infinity); // .. 2025. 8. 8. as="link"? 왜 작동 안 하는지 👿문제상황스타일 가이드가 나왔고 , 그에 맞게 텍스트를 공통 컴포넌트로 뺐다. 서비스 소개 그후에 링크태그에 위와 같이 적용을 하고싶었는데바로 오류가 떴다고 한다,,🤔원인추론재사용 가능한 컴포넌트로 사용하기 위해서 Test.tsx에서 as 로 태그 변경을 할수 있게 하였다. 경고 메시지! 그런데 여기서주의할 점은, HTML코드로만 변경이 가능하다는 점이다.단순성: HTML 태그는 표준화된 속성(예: className, id, href)을 가지므로, as로 전달된 태그에 prop을 안전하게 전달하기 쉽다.타입 안정성: 타입스크립트를 사용할 경우, as를 keyof JSX.IntrinsicElements로 제한하면 HTML 태그만 허용되며, 타입 에러를 방지할 수 있다.예측 가능성: React 컴포넌.. 2025. 4. 14. onAuthStateChange 썼는데, 로그인 직후 로그아웃 되는 이유? 👿 문제상황로그인을 하고 onAuthStateChange 의 세션 확인을위해 콘솔창을 열어보니세션값을 잘 받아왔다가, 아무런 이벤트를 발생시키지 않았음에도 불구하고 자동으로 null값으로 바뀌는 현생이 발생 (진짜 아무런 동작을 하지 않았고 한번에 저런 콘솔이 뜬다 ㅠㅠ)const [session, setSession] = useState(null); useEffect(() => { const { data: { subscription } } = supabase.auth.onAuthStateChange((_event, session) => { // if (session) { // setSession(session); // } setSession.. 2025. 4. 6. 쿠키가 존재하면 로그인 상태라고 할수있는가? https://supabase.com/docs/guides/auth/server-side/nextjs?queryGroups=router&router=app Setting up Server-Side Auth for Next.js | Supabase DocsBe careful when protecting pages. The server gets the user session from the cookies, which can be spoofed by anyone. Always use supabase.auth.getUser() to protect pages and user data. Never trust supabase.auth.getSession() inside server code such as middle.. 2025. 4. 5. TanstackQuery-기본사용법 💡주요기능- 데이터 캐싱: 캐싱 ? 서버에게 데이터를 요청했을때, 서버입장에서는 요청받은 데이터를 매번 찾는게 아니라, 자주 찾는 데이터를 메모리에 저장해두고 빠르게 결과물을 클라이언트에게 전달한다. - 자동 리페칭: 리페칭 : 다시 데이터를 가져온다데이터가 변경 되었을때 자동으로 리페칭하여 최신상태를 유지한다. - 쿼리 무효화: 특정 이벤트 발생시 쿼리를 무효화 하고 다시 데이터를 가져올수 있다. 서버상태를 가져오고 관리하는 세가지 과정1. get: useQurey데이터를 가져온다 (READ)2. modify: useMutation데이터를 생성, 업데이트, 삭제 한다 (CREATE, UPDATE, DELETE)3. refresh : invalidateQueries무효화 시킨다. 왜?가져왔던 결과물이.. 2025. 3. 18. App Router VS Pages Router 예전의 전통적인 방식 : Pages Router13버전 이후의 방식 : App Router 리액트와 넥스트에서의 라우팅 구현 방법리액트 : react-router-dom을 이용해서 구현넥스트 : 파일 시스템 베이스 라우팅 (or 폴더구조기반)으로 자동으로 제공해준다.- 페이지라우터: pages 폴더에 원하는 페이지의 파일 이름을 둔다 pages ㄴ about.jsㄴ index.js/about > 으로 자동으로 들어갈수 있다. - 앱라우터 app폴더 밑 폴더명을 기반으로 자동 라우팅이 된다.각 폴더 아래에 page.js 파일이 있고, 이 파일이 /about 에 자동으로 페이지를 그려준다. 그러면 대체 어떤걸 써야할까? 공식문서에 따르면 앱라우터를 추천한다고 한다.그렇지만 어떤 차이점이 있는지 알고, 상황.. 2025. 3. 17. Next.js만 활용해서 CRUD 구현하기 Uncontrolled Components : 폼 요소의 상태를 제어하지 않는 컴포넌트한마디로 정의하자면 과정은 보지 않고 결과만 반영하여준다.(마지막 제출할때만)즉 코드상으로 onChage 등으로 관리할 필요가 없다는것! 장점 : 간단한 구현 - 상태를 따로 관리하지 않기 때문에 간단한 폼 처리에 적합하다낮은 복잡성 - 폼의 상태를 리액트 상태로 동기화할필요가 없음으로 상태를 관리하지 않아도 된다단점 :비제어 컴포넌트이니까 당연하게도 제어되지 않는다 -> 폼의 상태 추적이나 제어가 어려울 수 있다.복잡한 폼 처리 어려움 : 실시간 유효성 검사 불가 : 판단하려면 무조건 제출해야함 FormDatahttps://ko.javascript.info/formdata FormData 객체 ko.javascript.. 2025. 3. 13. 프로그래머스 - 특정한 문자를 대문자로 바꾸기 - JS 문제 로직 생각하기문자열을 배열로 바꾼다.배열을 순회하면서 해당 문자가 있는지 찾는다.있으면 대문자로 변경해준다.다시 문자열로 변경하여 리턴해준다.function solution(my_string, alp) const answer = [...my_string].map(function(list){ if(list == alp){ return list.toUpperCase(); } return list }) return answer.join('')} 다른풀이const solution=(s,a)=>s.replaceAll(a,a.toUpperCase())s 와 a 를 매개변수로 받는다.replaceAll(찾을값, 바꿀값)바꿀값을.대문.. 2025. 3. 12. 이전 1 2 3 4 ··· 8 다음
