분류 전체보기
-
[프로그래머스 JS] 같은 숫자는 싫어자료구조와 알고리즘 2022. 8. 10. 18:01
문제 설명 배열 arr가 주어집니다. 배열 arr의 각 원소는 숫자 0부터 9까지로 이루어져 있습니다. 이때, 배열 arr에서 연속적으로 나타나는 숫자는 하나만 남기고 전부 제거하려고 합니다. 단, 제거된 후 남은 수들을 반환할 때는 배열 arr의 원소들의 순서를 유지해야 합니다. 예를 들면, arr = [1, 1, 3, 3, 0, 1, 1] 이면 [1, 3, 0, 1] 을 return 합니다.arr = [4, 4, 4, 3, 3] 이면 [4, 3] 을 return 합니다. 배열 arr에서 연속적으로 나타나는 숫자는 제거하고 남은 수들을 return 하는 solution 함수를 완성해 주세요. 제한 사항 배열 arr의 크기 : 1,000,000 이하의 자연수 배열 arr의 원소의 크기 : 0보다 크거나 ..
-
[JS] 연결 리스트자료구조와 알고리즘 2022. 8. 9. 21:43
추가와 삭제가 반복된다면 연결 리스트를 사용하자 연결 리스트란? 각 요소를 포인터로 연결하여 관리하는 선형 자료구조이다. 각 요소는 노드라고 부르며 데이터 영역과 포인터 영역으로 구성된다. 데이터 필드 = 데이터 영역 = 데이터 저장 링크 필드 = 포인터 영역 = 다른 노드의 주소 값을 저장 특징 메모리가 허용하는 한 요소를 제한 없이 추가할 수 있다. 배열과 차이점 1. 메모리 차이 배열은 순차적인 데이터, 즉 메모리 영역이 연속적으로 사용된다. 연결 리스트는 각 데이터가 퍼져있다. 즉, 포인터를 사용하여 각 영역을 참조한다. 2. 요소 삭제 / 추가 배열 배열은 O(n) 시간 소요 연결 리스트 삭제 1. 삭제하려고 하는 요소를 지정 2. 삭제하려고 하는 요소의 전 요소의 포인터를 삭제하려고 하는 요소..
-
티스토리 코드 복사하는 버튼 만들기카테고리 없음 2022. 8. 5. 23:34
티스토리 스킨 편집하다가 검색 기능이랑 더 보기 기능이 눌리지 않아 티스토리 스킨을 복구하면서 기록을 남긴다. 혹시 모르니 이걸 보는 분들이 있다면 더 많은 기능을 추가하기 전에 보관 버튼을 누르도록 하자. 보관 버튼을 누르자. admin > 꾸미기 > 스킨 변경 > 맨위에 보관 이제 보관 버튼을 눌러 무슨 일이 생겼어도 다시 돌아올 대비책이 생겼다. 먼저 우리가 사용할 라이브러리는 clipboard.js라는 라이브러리이다. 내가 한 설정 나는 코드칸에 마우스를 올렸을 때(hover), 글씨로 copy라는 문자가 있는 버튼이 나오는 걸로 설정했고, copy버튼을 클릭했을 때, 아래에 복사 완료라는 문구가 나오는 것으로 설정했다. 먼저 사용할 파일을 다운로드 해보자. https://clipboardjs.c..
-
useEffect, 클래스형 컴포넌트 생명주기 메소드 대체React 2022. 7. 30. 18:54
훅이 나오기 전 리액트의 생명주기는 클래스형 컴포넌트의 생명주기 메소드를 사용하였다. - componentDidMount, componentDidUpdate, componentWillUnmount 하지만 훅이 나오면서 useEffect가 클래스형 컴포넌트의 생명주기 메소드를 대체하여 사용하고 있다. 기존 클래스형 컴포넌트의 생명주기 메서드를 함수형 컴포넌트에서는 어떻게 대체하는지 궁금해서 정리해본다. 클래스형 컴포넌트 mount - componentDidmount 컴포넌트를 처음 렌더링 한 후, 최초로 렌더링 되는 시점에 단 한 번만 실행된다. - useEffect useEffect의 의존성 배열에 빈 배열을 전달하면 최초 렌더링 될 때 한 번만 실행됨 useEffect(()=>{ console.log(..
-
티스토리 - New 최신 마크 만들기 (커스텀)카테고리 없음 2022. 7. 29. 06:52
문득 블로그를 작성하던 중 가장 최신에 작성한 글에 돋보이는 효과를 주고 싶었다. 다른 github에서는 종종 봤었던 것 같은 기억이 나서 직접 만들어본다. 참고로 나는 letter 스킨을 사용하고 있다. 제일깔끔한듯 최신에 작성했던 글들 중에서 가장 최근에 작성했던 글 제목위에 New 라는 문구를 추가하고 싶었다. 1. 커스텀 하고자 하는 요소의 클래스 명 찾기 원하는 요소의 정보를 볼 수 있는 방법은 아래 3가지 정도가 있다. - F12 - option + cmd + i - shift + cmd + c 나는 shift + cmd + c 이 방법을 추천한다. 마우스로 내가 선택하고자 하는 영역을 색으로 구분해주기 때문이다. 대충 내가 추가하고 싶은 영역을 선택했을 때의 모습이다. 여기서 중요한것 최신 ..
-
MUI - 모달로 슬라이더 만들기MUI 2022. 7. 29. 05:00
MUI의 모달을 사용하여 모달 안에서 슬라이드를 구현해보자. import 부분 나는 Marsonry라는 레이아웃을 적용하였다. 똑같이 적용하고 싶다면 @mui/lab을 설치하면 된다. import React, { useState } from 'react'; import styled from '@emotion/styled'; import { Masonry } from '@mui/lab'; import { Box, Modal, IconButton, Typography } from '@mui/material'; import ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos'; import ArrowForwardIosIcon from '@mui/icons-mat..
-
Mui - ProgressbarMUI 2022. 7. 20. 02:41
Mui의 Progressbar를 수정하는 방법을 알아보자. 나는 로딩 상태가 아닌 멈춰있는 상태로 수정해야 했다. 먼저. import! import LinearProgress from '@mui/material/LinearProgress'; 컴포넌트 생성 정적인 상태를 원한다면 variant를 determinate로 선언해주어야 한다. 스타일 컴포넌트 const BorderLinearProgress = styled(LinearProgress)` .MuiLinearProgress-barColorPrimary { background-color: orange; } `; 생각보다 간단하다. 공식 홈페이지에서 찾아보면 더 많은 예시를 찾을 수 있을 것이다. const BorderLinearProgress = st..
-
티스토리 Letter스킨 자동 목차 생성하기카테고리 없음 2022. 7. 18. 16:42
벨로그와 다른 블로그를 사용했을 때, 편리했던 기능 중 하나인 자동 목차 기능을 티스토리에 적용해보자. 나는 티스토리의 Letter 스킨을 사용하고 있다. Tocbot이라는 라이브러리 사용하여 자동 목차를 생성할 것이다. 1. 안에 적용하기 head부분 안에 적용해야 할 것이 2개가 있다. css와 js파일을 연동시켜줘야 한다. 2. 안에서 밑에 추가하기 밑에 위의 구문을 추가하자. 3. 바로 위에 스크립트 추가하기 바디 태그가 끝나는 지점 바로 위에 스크립트 구문을 추가해준다. 4. CSS 추가하기 /*tocbot*/ .toc-absolute { position: absolute; margin-top:165px; } .toc-fixed { position: fixed; top: 165px; } .toc..