목록전체 글 (160)
영원히 흘러가는 강
정상적으로 작동하던 admin이 갑자기 로그인이 안되어서 애좀 먹었다.... 최근 명령어 history 다 찾아보고... 내가 뭐를 잘못했지 생각하다가 우연히 보게된 유튭 매우매우 간단하게 setting.py에 있는 세션 관련 코드를 다 주석시켜보라네? 성공...ㅎ 😅🔨
HTTP 요청과 응답은 비상태성과 비연결성의 특징을 가지고 있다 그리하여 우리는 데이터를 주고받으며 기록하고 싶은 사항이 있다면 쿠키 , 세션 , 웹스토리지 등에 저장하여 사용한다. 아래는 JWT에 대해 알아보기에 앞서 쿠키 , 세션 , 웹 스토리지에 대해 알아보고 싶다면 확인해보자 https://ryugaram.tistory.com/159 쿠키 (Cookie) , 세션 (Session) , 웹 스토리지(Local storage,Session storage) 차이 우선 각각의 차이와 장단점을 알아보기전에 우리는 왜 이걸 사용해야하는걸까? HTTP 요청과 응답은 흔히들 비연결성과 비상태성을 가졌다고한다. - 응답을 주고받으면 바로 연결을 끊고 , 새로운 ryugaram.tistory.com JWT ? JW..
우선 각각의 차이와 장단점을 알아보기전에 우리는 왜 이걸 사용해야하는걸까? HTTP 요청과 응답은 흔히들 비연결성과 비상태성을 가졌다고한다. - 응답을 주고받으면 바로 연결을 끊고 , 새로운 요청시에 재연결을 한다해서 비연결성 - 요청과 응답의 상태를 저장하지 않거니와 이전 기록을 기억하지 못한다해서 비상태성 하지만 우리는 상태를 유지하고싶은 상황이 있다 이런 비연결성과 비상태성을 보완하기 위해 우리는 쿠키 , 세션 , 웹 스토리지라는 애들을 사용한다. 순차적으로 각각의 장점과 단점만 간략하게 작성해보려 한다. (set , get , remove는 담지 않으려한다.) 쿠키 (Cookie) 브라우저(클라이언트)에 key-value 형태로 저장하는 데이터 파일 유효기간을 명시할 수 있으며 유효기간이 지나지 ..
삽질 엄청 많이 했다 ^^ 사실 규격에 딱딱 맞춰서 하게 된다면 문제가 없지만,,,, 개인프로젝트로 피그마도 구현하면서 작성하려니,, 하하.. 각설하고 본론으로 돌아가자면 이 방법을 썼다 ... {children} .. 헤더와 푸터를 둘다 이용하여 나는 children에 헤더 푸터의 높이를 뺀값을 전달해주고 싶었다 나도 계속 삽질을 했고....ㅎ 당연하게도 계속 calc() 함수 적용이 왜 안되는지 검색만 했었다 공식 문서로도 확인했지만 여러 블로그 등을 전전했고 결국 확인해본 결과 공식문서가 참으로도 이해가 어려웠지만 finally!!!!!! 추가로 global.css에다가 아래의 코드도 추가하였다 @tailwind base; @tailwind components; @tailwind utilities;..
안녕하세요. 이전 회사에서는 직접 id/pw를 입력받아 사용했었지만 소셜 로그인의 필요성이 대두됨에 따라 공부해보자 글을 작성해본다 구현목표! nextjs14 와 nextAuth 를 활용하여 소셜 로그인 구현 프로젝트 설정 next 설치 npx create-next-app@latest nextAuth 설치 npm install next-auth 파일 구조 파일구조때문에 살짝 애먹긴 했다... next13 부터 app 구조로 변경되어 API 활용하려면 route.ts와 같이 사용 app / api / auth / [...nextauth] / route.ts import NextAuth from "next-auth"; const handler = NextAuth({ ... }); export { handle..
next 14에서 발표한 next learn 확인 중 using the clsx library to toggle class names 이와 같은 글을 확인하였고, clsx가 무엇인지 찾아보게 되었다 위에서 소개한 예시는 아래와 같다 import clsx from 'clsx'; export default function InvoiceStatus({ status }: { status: string }) { return ( // ... )} status 조건에 따른 변경이 가능하다는점이다. 추가로 깃헙 페이지 확인시 아래와 같은 문자 합치기도 가능하다 // Strings (variadic) clsx('foo', true && 'bar', 'baz'); //=> 'foo bar baz' // Objects cl..
진짜 너무 늦었다14버전이 나왔다는데 13 버전도 제대로 확인 못한 1인...부랴부랴 node 버전을 확인해보니 Lts 가 20.9.0이네..? (너 언제 그렇게 높아졌니..?)우선 node 버전을 NEXT.js 14 minimum 버전인 18이상으로 끌어올리기!! (물론 저처럼 게으르지 않은 개발자분이시라면 확인만 하시죠..)이상 글쓴이의 푸념은 각설하고 진짜 늦었으니 당장 시작해보자!우선 Next에서 큰 꼭지로 4가지를 잡았다. (공식문서 링크 첨부)🚀 Turbopack💻 Server Actions (stable)🪬 partial Prerendering (Preview)📑 Next.js Learn 🚀 Turbopack최근 Next 문서를 확인해보셨던분이라면 알겠지만 핵심 키는 최적화와 ..
두개의 문자열을 받아 대소문자 비교까지 완벽히 일치하는지 판별 function solution(str1, str2) { let answer = "Yes"; let hash = new Map(); for (let x of str1) { if (hash.has(x)) hash.set(x, hash.get(x) + 1); else hash.set(x, 1); } for (let y of str2) { if (!hash.has(y) || hash.get(y) === 0) return "NO"; hash.set(y, hash.get(y) - 1); } return answer; } let str1 = "AabbcC"; let str2 = "cbCaab"; console.log(solution(str1, str2));
문제는 위반 될수 있으니 패스! 가장많은 수를 차지한 문자를 선택하는 방법! 자바스크립트 맵 객체를 활용한 문제 function solution(s) { let anwser = ""; let max = Number.MIN_SAFE_INTEGER; let hash = new Map(); for (let x of s) { if (hash.has(x)) { hash.set(x, hash.get(x) + 1); } else { hash.set(x, 1); } } for (let [key, value] of hash) { if (value > max) { max = value; anwser = key; } } return anwser; } let string = "BACBACCACCBDEDE"; console.l..
문제는 위반 될수 있으니 패스! 배열 주어지고 3개의 값을 더했을때 최댓값을 구하기 ex) arr= [10,7,3,5,4] answer =20 슬라이딩 윈도우 문제라고 한다 function solution(k, arr) { let anwser = 0, sum = 0; for (let i = 0; i < k; i++) sum += arr[i]; anwser = sum; for (let j = k; j < arr.length; j++) { sum += arr[j] - arr[j - k]; anwser = Math.max(anwser, sum); } return anwser; } let a = [12, 15, 11, 20, 25, 10, 20, 19, 13, 15]; console.log(solution(3,..