본문 바로가기

전체 글

(237)
[백준] 11724. 연결 요소의 개수 - 파이썬 풀이. 그래프의 연결 요소끼리 각 그래프의 위치에 추가하고 깊이 우선 탐색을 실시한다. visited배열을 이용하여서 현재 위치를 방문했는지 체크를 해주고 방문하지 않은 위치라면 dfs를 실시하고 +1을 한다. 소스코드.
Webpack이란 무엇인가 Webpack 이란? 웹팩은 오픈 소스 JavaScript 모듈 번들러로 여러개로 나누어져 있는 파일들을 하나의 JavaScript 코드로 압축하고 최적화 하는 라이브러리이다. . Webpack의 사용 이유 컴파일 속도를 빠르게 해준다. 하나의 js 파일로 만들어서 웹페이즈 성능을 최적화 한다. 로더를 사용할 수 있다. 모듈 단위로 개발이 가능하며, 가독성과 유지보수가 쉬워진다. 최신 JavaScript 문법을 지원하지 않는 브라우저에서 사용할 수 있게 코드로 쉽게 변환 시켜준다.
[JavaScript] 파도 효과 구현하기 파도 효과 구현하기 우선 visual studio를 사용한다면 live server 익스텐션을 추가해서 live server 환경에서 실행을 해야합니다. 프로젝트 구조 다음과 같이 구성되어 있습니다. HTML html 같은 경우에는 js, css 파일을 로드하고 다른 요소를 만들지는 않았습니다. CSS css 역시도 설명할게 없습니다. JS Point.js Point.js는 좌표들을 생성합니다. 좌표를 생성하는 이유는 Wave.js에서 Point에서 생성해낸 좌표를 기준으로 라인을 이어야하기 떄문에 좌표를 생성하고 각각의 좌표가 움직이는 speed등을 정합니다. Wave.js Wave.js에서는 Point에서 생성한 각각의 좌표들을 이어 라인을 이어지게하는 역할을 합니다. 반복문을 통해 이전 좌표 값과 ..
[백준] 17435. 합성함수와 쿼리 풀이. sparse table이라는 자료구조를 이용해야한다. sparse table은 정적 구간 질의를 처리할 수 있는 자료구조인데 대부분의 구간 질의를 O(log n)시간에 처리하지만 특정한 연산에 대해서는 O(1)의 시간 복잡도를 가지는 특징을 가지고 있다. sparse table로 구간 질의를 처리하기 위해서는 배열이 정적이어야한다. 해당 문제를 살펴보면 f2(1) = f(f(1)), f4(1) = f2(f2(1))과 같은 구조로 되어있다. 즉 sparse table에는 2의 제곱으로 늘어나는 값들을 저장해서 풀면된다. 아직 확실히 이해가 되지 않아서 다시 풀어보아야 할 것 같다. 소스코드.
[백준] 2170. 선 긋기 - 파이썬 풀이. 우선 좌표를 입력받아 배열에 저장을하고 정렬을 해준다 그리고 좌표의 최솟값이 -1000000000 이기때문에 now 값은 음수float('inf')값으로 설정을 하고 그래프를 반복문으로 돌면서 now 값이 start 값 보다 적다면 now 값을 start 값으로 설정하고 now 값이 end 값 보다 적다면 end - now 값을 결과 값에 저장한다 사실상 end - start의 길이를 구한다고 생각하면 되는데 여러번 선이 그인곳은 한번만 계산해야하기 때문에 now 값을 저장하는 것이다. 소스코드.
[백준] 18352. 특정 거리의 도시 찾기 - 파이썬 풀이. bfs를 이용해서 풀었다. 양방향 그래프이지만 최단거리를 구하는 문제이기때문에 왕복을 한다면 최단거리가 아니다. 따라서 bfs를 이용하여서 해당 도시를 방문했는지 확인을 하고 거리를 구한다. 소스코드.
[React] withRouter를 이용한 링크 이동시 메뉴변경 링크 이동으로 메뉴 변경 react를 이용하여 특정 링크로 이동하여 상단 메뉴 콘텐츠 내용을 변경하는 작업을 해보겠습니다. 우선 리액트 앱을 만들어줍니다. yarn create react-app withrouter-ex 그리고 scss와 react-router-dom을 사용할 예정이니 라이브러리들을 설치해줍니다. yarn add react-router dom node-sass@5.0.0 다 완료가 되었다면 src 폴더 안에 containers와 components폴더를 만들어줍니다. containers 폴더에는 Default.js, Home.js, Menu.js, Profile.js 를 생성해줍니다. Home.js Menu.js Profile.js Default.js는 나중에 작업을 하도록 하겠습니다. ..
[JavaScript] 무한 스크롤 구현하기 오늘은 무한 스크롤 구현에 관하여 기록해보겠습니다. 스크롤이 제일 아래로 내려가면 js를 이용하여 새로운 콘텐츠를 생성 및 추가되는 방식으로 구현을 했습니다. HTML section 태그에 class="box"인 div가 있습니다. 현재는 4개의 div가 있지만 스크롤을 내리면 계속 추가되게 할 예정입니다. css css는 간단하게 h1 태그는 position: fixed를 사용하여 스크롤을 내려도 고정된 위치에서 보이게 하였고 html을 실행하게 되면 기본적으로 보이게되는 스타일은 다음과 같습니다, js 윈도우의 높이와 현재 스크롤 위치의 값을 더한 뒤 문서의 높이와 비교하여 같거나 크다면 콘텐츠를 추가하는 방식입니다. 위의 코드들을 실행하여 작성하고 실행해보면 정상적으로 무한스크롤 기능이 작동하는 것..