전체 글 (501) 썸네일형 리스트형 [리트코드] 118. Pascal's Triangle - js 1. 문제 https://leetcode.com/problems/pascals-triangle/ Pascal's Triangle - LeetCode Can you solve this real interview question? Pascal's Triangle - Given an integer numRows, return the first numRows of Pascal's triangle. In Pascal's triangle, each number is the sum of the two numbers directly above it as shown: [https://upload.wikimedia.o leetcode.com 2. 코드 /** * @param {number} numRows * @return.. [Warning] React does not recognize the x prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `x` instead. If you accidentally passed it from a parent component, remove it from the DOM el.. 햄버거 메뉴를 만들다가 저런 warning을 발견했다. custom component에 props를 전달해주니 뜨는 오류였다. DOM 요소에 있는 내가 만든 prop(isMenuOpen)을 리액트가 이해하지 못해 뜨는 warning 인 것 같다. 스택 오버플로우에 검색하여 해결책을 찾았다. 위의 글을 참고하여 다음과 같이 수정했더니 더 이상 warning이 뜨지 않는다. 참고한 글) https://stackoverflow.com/questions/54468535/how-to-solve-warning-react-does-not-recognize-the-x-prop-on-a-dom-element How to solve Warning: React does not recognize the X prop on a .. [React] 텍스트가 넘칠 때 "..." 출력하기 메인 페이지 캐러셀 컴포넌트에서 게시글의 제목 / 내용 / 게시 날짜 및 시간을 보여준다. 만약 게시글 내용을 가공(?) 없이 그대로 출력되게 둔다면 다른 아이템의 자리까지 침범하게 된다. 그러므로 게시글의 내용을 미리 보기 할 수 있도록 한 줄 정도만 출력되도록 하고 추가적인 내용이 있다는 의미인 '...'을 붙여줘 보자. 먼저 미리 보기 텍스트를 한 줄 정도 길이로 출력하기 위해 줄 바꿈을 없애준다. const mergedContent = content.replace(/\n/g, ''); 게시글 내용의 html 태그를 없애준 후, 새롭게 만든 div 태그의 값으로 가공한 텍스트를 집어넣는다. const stripHTMLTags = (html) => { const tmp = document.create.. [React] Link를 통해 props 전달하기 React router v6 버전에서는 다음과 같이 Link를 통해 props를 전달한다. navigate를 통해 props를 전달하는 모습과 사뭇 비슷하다. [리트코드] 48. Rotate Image - js 1. 문제 https://leetcode.com/problems/rotate-image/description/ Rotate Image - LeetCode Can you solve this real interview question? Rotate Image - You are given an n x n 2D matrix representing an image, rotate the image by 90 degrees (clockwise). You have to rotate the image in-place [https://en.wikipedia.org/wiki/In-place_algorithm], which m leetcode.com 2. 코드 이 문제는 다른 문제들과 달리 새로운 matrix를 선언하여 re.. [리트코드] 22. Generate Parentheses - js 1. 문제 https://leetcode.com/problems/generate-parentheses/description/ Generate Parentheses - LeetCode Can you solve this real interview question? Generate Parentheses - Given n pairs of parentheses, write a function to generate all combinations of well-formed parentheses. Example 1: Input: n = 3 Output: ["((()))","(()())","(())()","()(())","()()()"] Exa leetcode.com 2. 코드 이 문제는 백트래킹을 활용하는 문제다. 백.. [React&Firestore] 캐러셀 컴포넌트 데이터 가져오기 오늘은 캐러셀 컴포넌트에 보일 태그 별 게시글 리스트 데이터 가져오기를 진행했다. 에러 5 종류 이상은 만나 겨우 성공했다. 진짜 온갖 진을 다 뺀 것 같다. 그래도 해결하고 나니 후련하다. 코드를 살펴보기 전에 내가 만들어준 db 구조를 먼저 보자. 데이터 평면화를 위해 다음과 같이 구조를 짰다. 사용자가 선택한 태그 목록 중 현재 캐러셀 컴포넌트에서 보여주고 있는 태그의 인덱스가 키포인트다. 이 값을 useState를 통해 관리해준다. 태그 별 게시글 리스트 저장을 위해 carouselData 라는 이름의 객체 또한 useState를 통해 관리해준다. posts 컬렉션에 있는 문서들 중 tags 필드의 값인 배열에 해당 tag를 포함하는 문서를 찾아 배열에 넣고, 그 배열을 carouselData 객.. [리트코드] 206. Reverse Linked List - js 1. 문제 https://leetcode.com/problems/reverse-linked-list/ Reverse Linked List - LeetCode Can you solve this real interview question? Reverse Linked List - Given the head of a singly linked list, reverse the list, and return the reversed list. Example 1: [https://assets.leetcode.com/uploads/2021/02/19/rev1ex1.jpg] Input: head = [1,2,3,4,5] O leetcode.com 2. 코드 /** * Definition for singly-linked li.. 이전 1 ··· 6 7 8 9 10 11 12 ··· 63 다음
