본문 바로가기

전체 글

 (215)
트위터 클론코딩: 2파일첨부하고 썸네일 나타내기 1.파일첨부해서 썸네일 나타내기 firebase > storage getStarted! bucket-> 파일을 넣는 곳 Img File만 받는 Input 태그 생성, 이벤트로 파일 확인 const onFileChange = (event)=>{ const {target:{files}}=event; const theFile = files[0]; 한개만 사용할꺼임 cosnole.log(theFile); } File API 이용! file을 읽어서 url로 바꿔주기 [FileReader API] https://developer.mozilla.org/ko/docs/Web/API/FileReader https://developer.mozilla.org/en-US/docs/Web/API/FileReader/onloa..
react-router-dom v6 route에 prop속성 프로젝트 중 app->Router -> home 각각 컴포넌트에서 console.log 함 app -> router까지 ok , home에 오류발생 원인이 router안에 있음을 확인하고 공식문서에서 prop받는 것을 확인하여 수정했다 -->
Next js getServerSideProps undefined 해결 getserversideporps 내에서 console.log()하면 값이 나오는데 client에서는 계속 undefined만 나오는 오류발생. 삼일간 긴 시간을 삽질했으나 철자오류로 페이지 프롭이 컴포넌트로 전달이 안됐고 클라이언트에서 result를 받아올 수 없었다. _app.jsx export default function App({ Component, PageProps }) { ---> export default function App({ Component, pageProps }) { PageProps -> pageProps로 해결완료!
트위터 클론코딩 :1 (firebase,react) amplify ,firebase용도 실제 큰 프로젝트를 할 때 사용하기는 적합하지않다. 구글에서 빌려온 사용자와,인증,데이터로 실제로 소유하고있는거없음. 가능한 나의 아이디어를 빠르게 테스트 해보려고 할 때 서버,데이터베이스만드느데 시간을 투자하고싶지않을 때 비즈니스용도 x 아이디어구상중 경쟁중 firebase firebase.js https://firebase.google.com/docs/web/setup?authuser=0&hl=ko JavaScript 프로젝트에 Firebase 추가 Google은 흑인 공동체를 위한 인종적 평등을 추구하기 위해 노력하고 있습니다. 자세히 알아보기 이 페이지는 Cloud Translation API를 통해 번역되었습니다. Switch to English 의견 보내기 ..
Search알고리즘 (binary Search Linear Seach) 1. 데이터구조와 알고리즘 2가지가 묶여서 성능을 좌우함 (책꽂이 정리에 시간이 걸리지만, 잘 정리해두면 쉽게 찾을 수 있듯이) 2. 따라서, 주목적이 무엇인지 (쌓아두는 것이 목적인지, 나중에 빨리 찾는 것이 목적인지)에 따라서 구조와 알고리즘 조합을 선택해야 알고리즘:레시피 Search 알고리즘(binary Search Linear Seach) Linear Search 배열이 커질수록 복잡해짐 binary Search 정렬된 배열에서만 사용가능 추가 소요시간 : sorted array > unsorted array (그냥 맨끝에 추가 ) 정렬된 배열에선 아이템을 하나하나 비교하고 옆에 있는것을 옮겨야하기때문에 이진검색 : 반으로 쪼개는것 중간에서부터 시작 중간에서 타겟보다 큰지 작은지 비교후 나머지무..
aggregate aggregate 합계, 총액 종합한, 종합하다 in (the) |aggregate 전체적으로, 모두 합쳐 A title element received an array with more than 1 element as children. In browsers title Elements can only have Text Nodes as children. If the children being rendered output more than a single text node in aggregate the browser will display markup and comments as text in the title and hydration will likely fail and fall back to client ..
Array 배열 1. 배열은 연결된 메모리 공간을 사용함. 2. 따라서, 배열은 빈칸이 없도록 데이터를 유지해야 . 3. 따라서, 연결된 순서값인 index를 가지고 특정위치값을 읽는 'Read'는 쉽지만, 무엇이 들었는지 모르는 중에서 찾아야 하는 'Search'와 공간을 옮겨야 하는 'Add', 'Delete'는 시간이 많이 걸림. 4.add와 delete 할게 있다면 마지막 위치에서 할 수 있도록
Next.JS 2 많은 사람들이 Next.JS 이용 할 때 따르는 아주 흔한 패턴: custom app component 사용할 때 쓰는 Layout component _app.js 에는 global.css, 구글 어널리스틱, 스크립트 분석등 큰 일들을 처리하고 구조에대한 것은 layout component에 만든다. Layouts React 모델을 사용하면 페이지를 일련의 컴포넌트로 분해할 수 있습니다. 이러한 컴포넌트 중 많은 부분이 페이지 간에 재사용되는 경우가 많습니다. 예를 들어 모든 페이지에 동일한 navigation과 footer가 있을 수 있습니다. https://nextjs.org/docs/basic-features/layouts Head (next/head) 페이지 head에 엘리먼트를 추가하기 위한 내..

티스토리툴바