eon.js로 간단한 API 만들기

최근에 저는 새로운 웹 프레임워크인 Eon.js에 대해 게시했습니다. 실용적인 예를 제공하는 것이 좋겠다고 생각했고, 그것이 어떤 모습일지 몇 가지 생각을 한 후 오늘이 무슨 요일인지 보여주는 shields용 API를 만들기로 결정했습니다.

API를 사용하여 다음과 같은 배지를 만들 수 있습니다.


참고: 캐싱으로 인해 이 게시물은 이전 이미지를 표시할 수 있습니다. 확실하지 않지만 GitHub에서도 이런 일이 발생할 수 있다고 생각합니다.

API 만들기 📅

먼저 즐겨 사용하는 IDE로 이동하여 새 프로젝트를 만듭니다. 모든 노드 프로젝트와 마찬가지로 이동하여 실행하십시오.

npm init -y

package.json 파일을 생성합니다.

이제 최신stable 버전의 eon.js를 설치합니다.

npm install eonjs@latest

index.js에서 간단한 Eon.js 서버를 만듭니다.

//! important ! If you're deploying to somewhere like Heroku, leave the port blank.
// During local dev, eon will default to port 8080
// When deployed, eon will default to process.env.PORT 
const eon = require('eonjs')();

eon.
    get('/weekdays-api').json(() => {
        // API code goes here
    })
    .listen(p => {
        console.log(`Listening on http://localhost:${p}`);
    });

가져오기eon 직후(리스너 외부!) 다른 요일을 유지하기 위한 상수를 만듭니다.

const days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];

...매일 색상을 저장하는 항목:

const colors = ['yellowgreen', 'brightgreen', 'yellow', 'orange', 'blue', 'blueviolet', 'ff69b4'];

이제 리스너 내에서 현재 요일, 요일 이름 및 색상을 검색합니다.

var day = new Date().getDay();
var dayName = days[day];
var color = colors[day];

마지막으로 응답을 생성합니다.

return {
    schemaVersion: 1,
    label: 'today is',
    message: dayName,
    color: color
}

요약하자면 이제 코드는 다음과 같습니다.

const eon = require('eonjs')(8080);

// Constants
const days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
const colors = ['yellowgreen', 'brightgreen', 'yellow', 'orange', 'blue', 'blueviolet', 'ff69b4'];

eon.
    get('/weekdays-api').json(() => {
        // API code goes here
        var day = new Date().getDay();
        var dayName = days[day];
        var color = colors[day];

        return {
            schemaVersion: 1,
            label: 'today is',
            message: dayName,
            color: color
        }
    })
    .listen(p => {
        console.log(`Listening on http://localhost:${p}`);
    });

API 배포 💻

이제 우리는 API를 작성했지만 실제로 사용할 수 없다면 좋지 않습니다. 따라서 shields.io이 액세스할 수 있도록 API를 Heroku에 배포해 보겠습니다. 먼저 heroku.com으로 이동하여 아직 계정이 없다면 무료 계정을 만드십시오. 이제 대시보드로 이동하여 새 앱을 만듭니다.



나는 "eonjs-api"라고 부를 것이다.


이제 Heroku가 볼 수 있도록 API의 소스 코드를 GitHub에 게시해야 합니다.

저장소 설정

프로젝트에서 다음 줄이 포함된 파일을 만듭니다.

# Don't upload node_modules to GitHub
node_modules

이것은 git이 node_modules를 서버에 업로드하지 않도록 하기 위한 것입니다. 다음으로 GitHub 리포지토리를 만듭니다. gitignore, 라이선스 또는 README 파일을 추가하지 않도록 하십시오. 그렇지 않으면 코드를 업로드할 수 없습니다. 이제 프로젝트에서 다음 명령을 실행합니다.

git init
git add .
git commit -m "initial commit".
# Make sure to replace "user-name" and "repo-name" with your GitHub username and repository name
git remote add origin https://github.com/user-name/repo-name
git push -u origin master

저장소 연결

Heroku의 배포 패널에서 "GitHub"탭을 선택합니다.



계정을 연결한 다음 리포지토리를 선택합니다. 페이지에서 조금 더 아래에 있는 "자동 배포"를 활성화해야 합니다.

Heroku가 앱을 배포하도록 하려면 프로젝트로 이동하여 다음을 실행합니다.

git commit -m "trigger heroku" --allow-empty
git push

몇 분(또는 몇 초!) 후에 Heroku는 앱을 your-app.herokuapp.com에 배포하고(예를 들어 내 앱은 eonjs-api.herokuapp.com/weekdays-api) 엔드포인트를 your-app.herokuapp.com/weekdays-api에서 사용할 수 있습니다.

마침내 힘들게 얻은 배지를 얻습니다.

이제 작은 API에서 많은 작업을 수행했으며 보상을 원합니다. 이를 검색하려면 페이지에 이 마크다운을 삽입하기만 하면 됩니다.

![Weekday Badge](https://img.shields.io/endpoint?style=flat&url=https://your-app.herokuapp.com/weekdays-api)

"your-app"을 앱 이름으로 바꾸십시오.

내 것이 여기 있습니다:

참고: 캐싱으로 인해 이 게시물은 이전 이미지를 표시할 수 있습니다. 확실하지 않지만 GitHub에서도 이런 일이 발생할 수 있다고 생각합니다.

결론

eon.js와 Heroku를 사용하여 자신만의 API를 만드는 방법에 대한 좋은 개요를 제공했으면 합니다. 의견에 의견을 보내주십시오. 또한 이러한 자습서를 더 원하는지 여부를 알려주시면 감사하겠습니다.

읽어 주셔서 감사합니다!