유튜브로 시간 낭비 안하는 방법

✨ 다운로드 하러가기 (클릭)

유튜브는 참 유용한 플랫폼이다. 하지만 한 번쯤 경험해봤을 거다.

그냥 음악 플레이리스트나 검색하려고 유튜브에 들어갔는데, 정신 차려보니 알고리즘이 던져준 영상들을 한참이나 보고 있었다는 걸.

"이거 하나만 더 보고 끌 거야!"라고 다짐하지만, 결국 새벽 2시... 익숙하지?

나도 똑같았다. 집중해서 일하려고 유튜브를 켰다가, 갑자기 길거리 싸움 영상이 뜨고, 다음엔 미친 듯이 웃긴 강아지 영상이 나오고, 어느새 나는 10년 전 레전드 예능 클립을 보고 있었다.

🤔 이놈의 유튜브 알고리즘만 뜨지 않는다면 의도한 대로 검색만 하고 나올텐데...

이렇게 메인화면 피드가 뜨지 않고,

영상을 시청 중일 때 우측에 나를 유혹하는 추천 영상이 뜨지 않는다면??

이게 구현된다면 일주일에 적어도 7시간은 나의 시간을 아낄 것 같았다 ㅋㅋ

그래서 직접 크롬 익스텐션을 만들기로 했다. 유튜브의 유혹을 차단하는 도구!

개발 과정

아래와 같이 코드를 작성했고, 전체 코드는 깃허브에서 확인해보면 된다.

const getRandomQuote = () => QUOTES[Math.floor(Math.random() * QUOTES.length)];

const insertQuote = (limit) => {
  if (limit < 1) {
    return;
  }

  const browseElement = document.querySelector("ytd-browse");

  if (browseElement) {
    browseElement.innerHTML = `<h1 id='indie-hacker-quote'>${getRandomQuote()}</h1>`;
  } else {
    setTimeout(() => {
      insertQuote(--limit);
    }, 500);
  }
};

const callback = async (URL) => {
  const rootElement = document.documentElement;

  if (URL === "https://www.youtube.com/") {
    rootElement.setAttribute("data-yt-page", "home");

    insertQuote(3);
  } else if (URL.includes("youtube.com/watch")) {
    rootElement.setAttribute("data-yt-page", "watch");
  } else {
    rootElement.setAttribute("data-yt-page", "other");
  }
};

chrome.runtime.onMessage.addListener((request) => {
  callback(request.url);
});

callback(window.location.href);

와 몇 일동안 사용해봤는데 적응되니 제 시간을 매우매우매우 아껴줬습니다.

배포

하지만 자랑하고 끝낼 수는 없겠죠?

제 시간도 이렇게 아꼈는데 여러분들에게도 좋은 영향을 줬으면 좋겠습니다.

그래서 Chrome Web Store에 배포하기로 했습니다.

개발자 계정 등록하려니 5$가 들더라고요?

하지만 1명의 시간이라도 아낄 수 있다면 5$ 이상의 가치가 있다고 생각합니다.

✨ 다운로드 하러가기 (클릭)