Deno 및 Vercel이 있는 서버 없는 API

Vercel에서 제로 설정 서버 없는 플랫폼을 만들었습니다.api 폴더에 파일을 추가하면api 포트를 만들 수 있습니다. 서버 프레임워크나 포트 탐지 명령이 필요 없고 기능만 있으면 됩니다.🚀
Deno는 NodeJS 작성자 Ryan Dahl이 제공하는 새로운 typescript/javascript가 실행될 때입니다.실행할 때 새로운 기능이 있어 더욱 안전한 환경을 만들 수 있다.Deno에는 테스트 실행 프로그램,linter, 심지어 typescript 컴파일러 등 몇 가지 인코딩 도구가 내장되어 있습니다.가장 논란이 되는 속성 중 하나는 URL에서 코드를 추출하는 능력이다.Deno는 제2의 클라이언트를 사용하여 제3자 코드를 설치할 필요가 없고 인터넷의 URL 시스템을 이용한다.🦕
Vercel 팀은 Deno의 런타임을 생성합니다.Deno를 사용하여 서버가 없는api를 만들고 Vercel에서 시작합니다.

If you are just kicking the tires and don’t want to install vercel and deno locally, you can use Gitpod. Gitpod is an online code IDE that gives you a sandbox per code repository. Simply, fork this repository https://github.com/hyper63/gitpod-deno-template and launch it in Gitpod with the Gitpod extension https://chrome.google.com/webstore/detail/gitpod-dev-environments-i/dodmmooeoklaejobgleioelladacbeki?hl=en

Deno 설치
Deno는 의존 항목이 없는 실행 파일로 발표되어 설치 과정이 간단명료합니다. 플랫폼에 대한 더 많은 정보는 https://deno.land을 참조하십시오.Mac 컴퓨터에서 다음을 실행할 수 있습니다.
Shell(Mac、Linux)

curl -fsSL https://deno.land/x/install/install.sh | sh

Windows Powershell

iwr https://deno.land/x/install/install.ps1 -useb | iex

추가 옵션 필요: https://github.com/denoland/deno_install

Vercel 설정
Vercel은 정적 생성된 사이트와 서버api 함수에 전념하는 플랫폼 즉 서비스입니다.내장형 기능은 JAM 스택 응용 프로그램, Javascript, API 및 태그를 호스팅하는 데 사용됩니다.
등록하려면 Github, Gitlab, Bitbucket에서 계정을 받아야 합니다. 이 서비스들은 코드 저장소이고 Vercel은 이 서비스에서 연속적인 납품 파이프라인을 만들 수 있습니다.코드 라이브러리 계정이 있으면 Vercel 등록 페이지로 이동하여 계정으로 로그인하십시오.https://vercel.com/signup 다음 절차에 따라 귀하의 무료 개인 계정을 만듭니다.

To use Vercel locally, you will need NodeJS and NPM installed, follow the instructions here to install the CLI — https://vercel.com/download

개시하다
그래서 이제 모든 설정을 마쳤습니다. 어떤 API를 구축할지 결정할 때가 됐나요?은마르코프 모형!COWSAY API를 구축합니다. COWSAY는 일부 텍스트를 입력으로 하고, 기포를 포함하는cow의 ASCII를 되돌려주는 프로그램입니다.

_______
< hello >
 -------
        \ ^__^
         \ (oo)\ _______
            (__)\ )\/\
                ||----w |
                || ||

API에는 다음과 같은 두 개의 끝점이 생성됩니다.

획득/ — 암소

로 환영 메시지 반환

게시물/말하기 — 일부 텍스트 및 동물 유형이 포함된 JSON 본문을 클라이언트에서 보낼 수 있습니다.

재밌을 것 같은데?

항목 설정
자, 시작합시다!
로컬 터미널 또는 콘솔 열기
로컬 컴퓨터에cowsay라는 새 폴더를 만듭니다

mkdir cowsay
cd cowsay

이 디렉터리에서vercel을 만들고 싶습니다.json 파일.이 파일에서 함수에 대해 Deno 런타임을 지정할 수 있습니다.

{
  "functions": {
    "api/**/*.[jt]s": { "runtime": "[email protected]" }
  }
}

At the time of this writing, the current version of the vercel-deno runtime was 0.7.7. You will want to check the repository to confirm the latest version: https://github.com/TooTallNate/vercel-deno

GET/endpoint 생성
현재 우리는 이미 설정을 완성하여 첫 번째 단점을 만들 수 있습니다.
api라는 새 폴더를 만들고, 이 폴더에 index라는 새 파일을 만듭니다.ts.

mkdir api
touch api/index.ts

색인을 엽니다.코드 편집기에서

import { ServerRequest } from 'https://deno.land/[email protected]/http/server.ts'

export default (req: ServerRequest) => req.respond({
  body: 'Hello World'
})

Deno의 http/server 모듈에서 ServerRequest 유형을 가져옵니다.그리고/path를 요청할 때 Vercel에서 ServerRequest 대상을 받는 기본 함수를 내보냅니다.Vercel은 모든 인덱스 파일을api의 루트/경로에 매핑합니다.따라서 이름 파일 인덱스를 통해 클라이언트가 루트/경로를 요청할 때 이 함수를 호출하도록 지정합니다.Deno에서 두 번째 객체는 전달되지 않습니다.ServerRequest 객체에는 Respond라는 메서드가 있습니다. 이 메서드는 Response 객체를 수락합니다.이 대상은 바디 속성을 포함해야 하지만,status와headers 속성도 포함할 수 있습니다.인터페이스 설명을 보실 수 있습니다.

/**
 * Interface of HTTP server response.
 * If body is a Reader, response would be chunked.
 * If body is a string, it would be UTF-8 encoded by default.
 */
export interface Response {
  status?: number;
  headers?: Headers;
  body?: Uint8Array | Deno.Reader | string;
  trailers?: () => Promise<Headers> | Headers;
}

Deno - A secure runtime for JavaScript and TypeScript
이제 새 끝점을 정의하고 파일을 저장하고 로컬 Vercel dev 서버를 시작합니다.먼저 Vercel CLI가 설치되어 있는지 확인합니다.

npm i -g vercel

그런 다음 CLI를 사용하여 계정에 로그인합니다.

vercel login

e-메일 주소를 입력하고 e-메일 클라이언트로 이동한 후 인증을 클릭하면 해당 클라이언트가 Vercel 계정에 연결됩니다.
마지막으로 다음 명령을 입력하여 dev 환경을 시작할 수 있습니다.

vercel dev

Enter 키를 누르면 다음과 같은 몇 가지 질문이 표시됩니다.

Vercel CLI 21.3.3 dev (beta) — https://vercel.com/feedback
? Set up and develop “/workspace/cowsay”? [Y/n] y
? Which scope should contain your project? tom-personal
? Link to existing project? [y/N] n
? What’s your project’s name? cowsay
? In which directory is your code located? ./
No framework detected. Default Project Settings:
- Build Command: `npm run vercel-build` or `npm run build`

enter를 누르면 모든 기본 설정을 받아들일 수 있습니다.
마지막으로 다음을 확인해야 합니다.

Vercel CLI 21.3.3 dev (beta) — https://vercel.com/feedback
> Ready! Available at [http://localhost:3000](http://localhost:3000)

✨ 예!✨ Deno를 사용하여 서버 없는 환경을 로컬에서 실행해야 합니다.
이 URLhttps://localhost:3000/api을 가리키는 브라우저를 열면'Hello World'를 볼 수 있는지 확인해 봅시다.

카우보이가 뭐라고요?
현재 저희 서버가 작업을 시작했습니다. JSON 문서를 받아들이고cow로 돌아가는 새로운 노드를 만듭니다.
우리는 이curl 명령을 사용하여 우리의 새로운 단점을 테스트할 것이다.

curl -X POST localhost:3000/api/say -d '{"text": "Cows Rock!" }' -H 'Content-Type: application/json'

api 폴더에say라는 새 파일을 만듭니다.ts

import { ServerRequest } from '../deps.ts'

export default (req: ServerRequest) => {

}

URL을 입력하지 않고도 종속 파일을 만듭니다.프로젝트 루트 디렉터리에 이 파일을 만들고 deps로 이름을 붙입니다.ts

export { ServerRequest } from 'https://deno.land/[email protected]/http/server.ts'

요청된 바디 해결
우리가 세이 단점에 대해 해야 할 첫 번째 일은 요청의 주체를 해석하는 것이다.Deno readAll 방법을 사용하고 Text Decoder를 사용하여 요청체를 문자열로 디코딩할 수 있습니다.
say 파일에 다음 코드 행을 추가합니다.

import { ServerRequest } from '../deps.ts'

export default async (req: ServerRequest) => {
  const body = new TextDecoder().decode(await Deno.readAll(req.body))
  console.log(body)
  req.respond({ body })
}

함수를 비동기 함수로 변경하고 Deno에서 반환된 약속을 await 명령으로 처리하는 것을 알 수 있습니다.readAll, 그리고 데이터를 텍스트로 디코딩합니다.우리는 텍스트를 취소하고 메아리 서버처럼 응답합니다.

젖소를 만들다
이제 텍스트가 생겼습니다. COWSAY 모듈을 사용하여cow를 만들어야 합니다.
COWSAY 모듈은 deno에 있는 타사 모듈입니다.토지.응용 프로그램에 모듈을 가져와야 합니다.deps를 엽니다.ts 파일에서 다음을 추가합니다.

export { say } from 'https://deno.land/x/[email protected]/mod.ts'

api/say에서ts 파일에서 다음 코드를 추가할 수 있습니다.

import { ServerRequest, say } from '../deps.ts'

export default async (req: ServerRequest) => {
  const body = new TextDecoder().decode(await Deno.readAll(req.body))
  console.log(say({ text: "hello" }))
  req.respond({ body })
}

deps에서say 명령을 가져옵니다.ts
say 명령이 유효한지 확인하기 위해log 명령을 추가했습니다.

본문 텍스트를 JS 객체로 변환
이제 JSON 구문 분석 방법을 사용하여 본문 텍스트를 JS 객체로 변환해야 합니다.

import { ServerRequest, say } from '../deps.ts'

export default async (req: ServerRequest) => {
  try {
    const body = new TextDecoder().decode(await Deno.readAll(req.body))
    const cow = say(JSON.parse(body))
    req.respond({ body: cow })
  } catch (e) {
    req.respond({ status: 500, body: 'could not parse body' })
  }
}

try-catch를 사용하여 JSON 구문 분석 중에 발생한 모든 오류를 처리합니다.

curl 명령 실행

curl -X POST localhost:3000/api/say -d '{"text": "Cows Rock!" }' -H 'Content-Type: application/json'

____________
< Cows Rock! >
 ------------
   \ ^__^
    \ (oo)\ _______
       (__)\ )\/\
           ||----w |
           || ||

너는 너의 소를 가져가야 해!

배치하다
당신의api를 배치하기 위해서 터미널에vercel을 입력하면 당신의api는vercel 플랫폼에서 구축하고 배치합니다!

요약
본고에서 우리는 Vercel과 Deno를 연구했는데 이 두 가지 기술은 우리가 사용자에게 가치를 제공하는 방식을 바꾸고 있다.온라인으로 최종 제품을 확인하려는 경우: https://cowsay.vercel.app/api
다음은 코드 라이브러리: https://github.com/twilson63/cowsay