마우스만으로 지금 Qiita의 최신 기사를 고양이에게 말하고 싶다면



고양이라고 해도 외모 미워… (죄송합니다 누군가 온 것 같다…)

소개



Scratch3.0에서 확장 블록을 만들고 싶어서 WebAPI를 이용하는 블록을 만들어 보았습니다!

또한 이 문서는 Qiita夏祭り2020_パソナテック 항목 기사입니다.
테마 페이지는 여기

언어로서는 JavaScript로 확장 블록을 추가해 갑니다!

Scratch로 확장 블록 만들기



참고 기사
* htps : // 코 m/히로유키_오사키/있어 ms/아 46에 1c881d3 아에 d4661f7
* h tp // w w. 모온미. 네 t/bぉg/아 r ゔぇs/10331

매우 도움이되었습니다.
역시 많은 정보가 있네요.
그러나 vm과 gui의 폴더를 오가는 것은 확실히 어렵습니다 ...

소스 코드



이번에는 axios를 사용하여 Qiita API를 사용합니다.
그래서 우선 axios 의 인스톨입니다.
npm i axios

이 후 브라우저를 다시로드하는 것만으로는 안됩니다. 로컬에서 시작한 Scratch를 삭제합니다.
yarn start

에서 다시 시작이 필요했습니다.

아래는 scratch-vm/src/extensions/scratch3_newblocks/index.js의 일부입니다.
const axios = require("axios");
()
         {
                    opcode: "tagBody",
                    blockType: BlockType.REPORTER,
                    text: "tag: [TEXT] の最新記事の内容",
                    arguments: {
                        TEXT: {
                            type: ArgumentType.STRING,
                            defaultValue: "Qiita",
                        },
                    },
                },
()
    tagBody(args) {
        const tag = Cast.toString(args.TEXT);
        return axios
            .get("https://qiita.com/api/v2/items?per_page=1&query=tag:" + tag)
            .then((response) => {
                console.log(response.data);
                return response.data[0].body;
            })
            .catch((err) => {
                console.log("err:", err);
                return err;
            });
()

약어가 많네요. 만지는 파일도 많으면 날아다니면서 쓰지 않으면...

사용해보기



시험에 스크래치 캣에 말해 보았습니다.



지능형 고양이가 되었어요 ...
귀여워 ぃぃeeeee! !

결론



확장 블록을 만드는 것은 한 번 알면 쉽게 할 수 있을 것 같습니다만, 역시 다양한 파일이나 개소도 날아다니는 장소를 만지지 않으면이기 때문에 무섭네요.

하지만 블록을 만드는 것은 재미 있습니다!

좋은 웹페이지 즐겨찾기