본문 바로가기
DOM 리액트를 공부해보기 전에 DOM이라는 구조를 전부터 이해해보고 싶었고 찍어보기 시작하면서 리액트에서는 Virtual DOM이라는 걸 사용해 변화에 맞게 바꾸어주는 것을 알게 되었다.  DOM이 그래서 뭔데?브라우저가 HTML 문서를 이해할 수 있도록 만든 거라고 생각하면 된다. 이런 태그로 웹 페이지가 만들어지면 브라우저는 이를 DOM이라는 트리 구조로 변환하게 된다. 트리라는 것은 이미 어떤 것인지 따로 알고 있긴하지만 간략하게 요약하면 다음과 같다. 가장 최상위에 존재하는 루트가 있고 그에 대한 자식 노드들로 이어져 있으며 이 때 자식 노드와 연결된 노드는 부모 노드라고도 부른다. 가장 최하위 단의 노드의 경우에는 자식 노드가 없을 것이고 이는 리프 노드라고도 한다. 즉, 흔히 알고 있는 태그들이 .. 2024. 11. 27.
11727번 Python 2xn 타일링 문제의 두번째 변형 문제이다. 이번에는 1x2, 2x1, 2x2 타일이 존재한다. 마찬가지로 직접 그림을 그려가보면서 점화식을 구해보는 것을 목표로 한다. 마찬가지로 총 2x4 직사각형까지의 타일을 모두 조합해보았고 다음과 같은 결과를 알 수 있었다. 이번에는 어떤 규칙이 보이는지, 그 규칙이 어떻게 그렇게 되는지 알아보겠다. n의 경우에 n-1 타일을 1번씩 모두 사용했고 n-2 타일은 2번씩 사용한 것을 확인할 수 있다. dp[n] = 2 * dp[n-2] + dp[n-1]따라서 이것이 해당 문제의 점화식이라고 볼 수 있게 되는 것이다. import sysn = int(sys.stdin.readline())dp = [0] * 1001dp[1] = 1dp[2] = 3for i in ran.. 2024. 11. 26.
11726번 Python 이 문제는 어렴풋이 기억나긴 했지만 다시 정리하겠다. 아마 실제로 그려보면 조금 더 빨리 풀 수 있는 것으로 알고 있다. 문제의 의도는 1x2, 2x1 블록으로 2xn의 직사각형을 채울 수 있는 최적의 해를 구하는 문제이다. 실제로 그려보면서 유추되는 식을 찾아보는 것이 메인 포인트이다. 2x1 직사각형의 경우에는 1가지, 2x2의 경우에는 2가지의 형태를 알 수 있다. 2x3의 형태까지만 그려보자. 이렇게 그렸을 경우에도 고려해보자. 무언가 특징이 하나 존재하는데 여기서도 보이지 않는다면 정말 마지막으로 2x4 직사각형까지 그려보자. 개수를 잘 세어보면 피보나치 수열의 형태와 유사한 것을 알 수 있다. 하지만 단순히 시각적으로 보이는 걸 토대로 개수를 세어가는 것보다는 뭔가 더 정확하게 그려지는 형태를.. 2024. 11. 26.
1463번 Python 단순히 문제 해결보다는 문제에서 의도하고자 하는 것이 무엇인지 알아가면서 정리하려고 한다. 어렴풋이 어떻게 풀었는지 기억은 나지만 내가 왜 이렇게 했는지 잊어버렸다. 그렇기에 더욱 더 문제에 대한 정리가 필요한 시점이라고 생각했고 DP의 기초 문제부터 천천히 접근하겠다. 1463번 문제의 경우에는 1로 만들 수 있는 최적의 해를 구하는 것을 목표로 둔다. 10 -> 5 -> 4 -> 2 -> 110 -> 9 -> 3 -> 1문제에도 적혀있는 부분이긴 하지만 10의 경우에는 4번이 아닌 3번만으로도 1을 만들 수 있기에 이것을 어떻게 구현해 나가야 하는지를 생각해보아야겠다. 여기서 dp를 사용하는 것이다. 각 숫자별로 가장 최적의 해를 구할 수 있는 값을 기억해둔다면 그 값을 꺼내 사용하면 될 것이다. 이.. 2024. 11. 26.
그냥 재미삼아 만든 메이플식 복권 움직이기 귀찮은데 자꾸 부르는 친구를 위한 메이플식 복권 function getRandomItemWithProbability(obj) { const entries = Object.entries(obj); const items = entries.map(entry => entry[0]); const probabilities = entries.map(entry => entry[1]); const totalProbability = probabilities.reduce((sum, prob) => sum + prob, 0); // 랜덤 수 let random = Math.random() * totalProbability; for (let i = 0; i 플래티넘 애.. 2024. 10. 4.
마이그레이션 관리 예전에 장고를 배웠을 때는 마이그레이션 로그들이 자동으로 생성되었던 기억이 있는데 스프링부트와 express.js를 사용해본 이 기점에서 마이그레이션 관리는 따로 해주지 않고 있는 것으로 보였다. 스프링부트는 개인 프로젝트에서 Flyway라고 하는 의존성을 설치해 사용해봤고 이번 회사에서는 knex ORM을 활용해서 마이그레이션 관리 라이브러리를 사용해보았다. 마이그레이션 관리를 왜 해야되지?실제로 신입 개발자 때 팀 프로젝트를 진행했던 적이 있었는데 당시 깃을 관리하던 팀원이 마이그레이션 소스를 깃 이그노어 처리했었다. 한 회사의 면접에서 왜 이그노어 처리했냐고 물었을 때 우물쭈물 대답했던 기억이 났다. 물론 그건 정답도 아니었고. 돌이켜 생각해보면 어차피 오픈소스로 공개하지 않는 이상 코드는 외부로 .. 2024. 9. 24.

티스토리툴바