FrontEnd

    [JS] 주사위의 개수

    가로,세로,높이를 각각 주사위의 길이로 나눈 몫을 구한 후 이를 곱해주면 주사위의 총 개수를 구할 수 있다. function solution(box, n) { var answer = box.reduce((acc,cur) => acc * parseInt(cur/n),1); return answer; }

    [JS] 배열 회전시키기

    각 회전시키는 방향에 따라서 배열을 잘라서 붙여주었다. function solution(numbers, direction) { var answer = direction==="left" ? [...numbers.slice(1) , numbers[0]] : [numbers[numbers.length-1],...numbers.slice(0,numbers.length-1)]; return answer; }

    [React] 토스트 알람창으로 alert 대체하기

    개발을 하다보면 alert를 활용하여 알람을 띄어주는 경우가 생긴다. 이를 아래와 같이 조금 더 예쁘게 꾸며보자. react-toastify 라이브러리를 활용하면 위와같은 토스트를 쉽게 만들 수 있다. 사용방법도 매우 간단하다. import React from 'react'; import 'react-toastify/dist/ReactToastify.css'; import { toast } from 'react-toastify'; import { ToastContainer } from 'react-toastify'; function App() { const notify = () => toast.warning('Wow so easy!'); return ( Notify! ); } export default ..

    [JS] 공던지기

    k * 2 값을 구하면 해당 인덱스를 구할 수 있다. 실제로 인덱스는 배열의 길이까지밖에 없기 때문에 이를 배열길이로 나눠준 후, 나머지값이 k번째 사람이 던져 받는사람이 된다. 문제는 k번째 던진공을 받는 사람이 아닌, 던지는 사람이므로 이를 조정해주면 된다. function solution(numbers, k) { var answer = numbers[(k*2-2) % numbers.length]; return answer; }

    [React] 스크롤 이벤트 활용하기

    이번에 프로젝트를 진행하다가 스크롤 이벤트를 활용할 상황이 생겨서 공부하게 되었다. 원래 스크롤이벤트를 활용하기 위해서는 window.addEventListener 함수를 활용하여 이벤트를 등록할 수 있다. 이를 훅으로 만들어 두면 보다 편하게 사용할 수 있다. import { useEffect } from 'react'; // 스크롤이벤트 등록해주는 훅 export const useWindowScrollEvent = ( listener: (this: Window, ev: Event) => any, ) => { useEffect(() => { window.addEventListener('scroll', listener); return () => { window.removeEventListener('scr..

    [JS] 2차원으로 만들기

    배열의 전체 개수가 n의 배수이므로 for문 2개를 활용해서 분리해주면 된다. [ 1, 2 , 3 , 4 , 5 ,6 ] 이고 n이 2라면 1 2 3 4 5 6 다음과 같은 작은 배열을 만들어주고 만들어 질때마다 합쳐주면 된다. function solution(num_list, n) { var answer = []; const len = num_list.length for( let i=0 ; i< len/n ; i++ ){ const tmp = [] for (let j=0 ; j