내 Qiita 기사를 증분 검색하는 Alfred Workflow를 만들어 보았습니다.

소방관 시대부터 Qiita 게시물을 계속했으며 누계 게시물 수는 140개 기사를 초과했습니다.
투고 기사가 늘어나면 「어라?이전 Qiita에 썼던 생각이 들지만 어쩐지..?」라고 해도, 자신의 과거 투고를 찾는 것이 일고생입니다.
그런 수고를 해소하기 위해 Qiita API와 Alfred를 사용하여 자신의 Qiita 기사를 증분 검색하는 Aflred Workflow를 만들어 보았습니다.

상당히 편리하기 때문에, Qiita 헤비 유저 분들에게 사용해 주시면 기쁩니다.

alfred-my-qiita



이 GIF 이미지와 같이 자신의 게시물 기사를 증분 검색할 수 있습니다.
처음에는 API 요청이 실행되기 때문에 조금 시간이 걸리지만, 그 후에는 캐시가 효과가 있기 때문에 어느 정도 고속으로 동작합니다.



설치 및 환경 변수 설정



다음 명령을 사용하여 npm에서 설치할 수 있습니다 (아래에서 설명하는 Alfy에서 실현).
npm 설치하면 Alfred가 Workflow를 인식하고 즉시 사용할 수 있습니다.
$ npm i -g alfred-my-qiita

GitHub 출시에서 직접 alfred-my-qiita.workflow 파일을 다운로드하여 Alfred로 가져올 수도 있습니다.



설치가 완료되면 Alfred의 Workflow 설정 화면에서 alfred-my-qiita를 선택하여 환경 변수를 설정하십시오.



설정할 환경 변수는 다음 두 가지입니다.


이름



API_TOKEN
Qiita API의 API 토큰. 여기 의 안내에 따라 취득·설정해 주십시오.

USER_NAME
Qiita 사용자 이름(@ 제외)을 설정합니다.




이것으로 준비가 완료됩니다.
Alfred 열기 .qiita


구현



이번에도 이전 이 기사 에서 소개한 Alfy 이라는 Node.js 베이스로 Alfred Workflow를 만들 수 있는 프레임워크를 사용하고 있습니다.

Alfy를 사용하는 이점은 다음과 같습니다.
  • Node.js에서 Workflow를 만들 수 있습니다
  • npm 모듈을 사용할 수 있습니다
  • npm에 게시하여 쉽게 설치할 수 있습니다.

    무엇보다 Bash 스크립트를 작성하지 않아도된다는 것이 가장 편리합니다.

    이번 workflow는 다음 두 개의 파일로 구성되어 있습니다.

    하나는 Qiita API에서 게시물 기사를 얻는 과정입니다.
    먼저 자신의 총 게시물 수를 얻은 다음 Promise.all 및 map을 사용하여 모든 게시물 데이터를 검색합니다.

    lib/fetchAllPosts.js
    import alfy from "alfy"
    
    export const fetchAllPosts = async (username, token) => {
      const options = {
        headers: {
          Authorization: `Bearer ${token}`,
        },
        json: true,
        maxAge: 60000
      };
    
      const user = await alfy.fetch(
        `https://qiita.com/api/v2/users/${username}`,
        options
      );
    
      const maxPage = Math.ceil(user.items_count / 100);
    
      let posts = [];
      await Promise.all(
        [...Array(maxPage)].map(async (_, i) => {
          const res = await alfy.fetch(
            `https://qiita.com/api/v2/authenticated_user/items?page=${
              i + 1
            }&per_page=100`,
            options
          );
          posts = [...posts, ...res];
        })
      );
    
      return posts
    };
    

    그리고 index.js가 주요 처리입니다. Alfy의 inputMatches API를 사용하여 게시물 기사를 필터링하여 출력합니다.

    index.js
    import alfy from "alfy";
    import { fetchAllPosts } from "./lib/fetchAllPosts";
    
    const token = process.env.apiToken;
    const username = process.env.username;
    
    const createResponse = (title, subtitle, url) => {
      return {
        title,
        subtitle,
        arg: url,
        icon: {
          type: "png",
          path: "icon.png",
        }
      };
    }
    
    (async () => {
      const posts = await fetchAllPosts(username, token);
    
      if(alfy.input.length > 1) {
        const items = alfy.inputMatches(posts, "title").map(
            (p) => createResponse(p.title, p.body, p.url));
    
        if (!items.length) {
          alfy.output(
              [createResponse("The requested post was not found. ⚠️", "", "")]);
          return;
        }
        alfy.output(items);
      } else {
        alfy.output([createResponse("Loading...", "", "")])
      }
    })()
    

    끝에



    이상 「자신의 Qiita 기사를 인크리멘탈 검색하는 Alfred Workflow를 만들어 보았다」였습니다.
    완전 자신용의 툴로서 만들어 본 것입니다만, Qiita 투고수가 많은 분에게는 무언가와 편리하다고 생각합니다. 사용해 주시면 기쁩니다.
    (만약 움직이지 않는다면 트위터 인가 GitHub Issue
  • 좋은 웹페이지 즐겨찾기