React,NodeJS,FaunaDB,Vercel로 구축된 트위터 게시물 스케줄러(제2부분) 배치
소개하다.
우리의 첫 번째 글에서 우리는 React, Node를 사용하여 트위터를 호출했다.그리고이 장에서 우리는 그것을 Vercel에 배치할 것이다.
왜 비셀이야?
Vercel은 구성이 전혀 없는 프런트엔드 애플리케이션을 배포하고 수백만 페이지까지 동적으로 확장할 수 있는 최적의 장소입니다.또한 추가 구성 없이 백엔드를 서버 기능이 없는 것으로 배치할 수 있습니다.서버 없음 함수는 HTTP 요청을 받고 응답하는 백엔드 언어로 작성된 코드 세그먼트입니다.
공구.
시작하기 전에 다음을 확인하십시오.
배치 구조
다음은 Twitter의 고급 배포 아키텍처입니다.
git --push
명령을 사용하여 프로그램을 Github로 전송합니다.Twittler를 Github로 밀어넣기
응용 프로그램을 Github로 전송하려면 먼저 Github 저장소를 만들어야 합니다.그것은 우리 프로젝트의 모든 파일과 모든 파일의 수정 역사를 포함할 것이다.라이브러리를 작성하려면 다음 절차를 따르십시오.
"Create a new repository"페이지로 이동합니다.
cd your_path_to_the_application
,enter키를 누르십시오.git remote add origin [[email protected]](mailto:[email protected]):YOUR_GITHUB_USERNAME/REPO_NAME.git
를 입력하고 Enter 키를 누릅니다.git branch -M main
를 입력하고 Enter 키를 누릅니다.git add .
를 입력하고 Enter 키를 누릅니다.git commit -m "first commit"
를 입력하고 Enter 키를 누릅니다.git push -u origin main
를 입력하고 enter 키를 누릅니다.그것은 우리의 응용 프로그램을 Github로 전송할 것이다.Github에 프로그램이 있는지 확인하려면
https://github.com/YOUR_GITHUB_NAME/twittler
로 돌아가서 로컬 파일을 보았는지 확인하십시오.Vercel에서 어플리케이션 사용 가능
Verceldoesn’t support cron jobs이기 때문에 저희는 Cronhub를 사용하여 트위터 게시 작업을 처리할 것입니다. 이것은
server/index.js
파일에 있습니다.Cronhub을 사용하면 버셀의 서버 기능이 없는 순환 작업을 만들고 트위터에 트윗을 올릴 수 있습니다.기본적으로, 우리는 크론 작업이 분당 호출되는 API 루트를 만들 것이다.
이것이 바로 우리의 응용 프로그램 구조가 이로 인해 바뀔 방식이다.
보낸 사람:
다음을 수행합니다.
우리를 바꾸는 것
server/indiex.js
부터 시작합시다.급행열차로 왔어요.js에서 Vercel까지 서버 기능 없음
서버 기능이 없고 추가 설정이 필요 없는 것을 만들고 배치하려면 프로젝트 루트 디렉터리
/api
디렉터리에 트위터 게시 기능을 포함하는 파일을 설치해야 합니다. 이 파일은 내보내기 함수에 봉인되어 있습니다.이 작업을 수행하려면 다음 절차를 따르십시오.api
파일을 놓으세요.이 코드까지.
const faunadb = require('faunadb')
const {TwitterApi} = require('twitter-api-v2')
const twitterClient = new TwitterApi(process.env.TWITTER_BEARER_TOKEN)
const q = faunadb.query
const faunaClient = new faunadb.Client({
secret: process.env.REACT_APP_FAUNADB_SECRET,
})
module.exports = async (req, res) => {
if (req.method === 'POST') {
try {
const now = new Date()
now.setSeconds(0)
now.setMilliseconds(0)
// get all tweets from Now - 1 minute to Now
const {data} = await faunaClient.query(
q.Map(
q.Paginate(q.Match(q.Index('tweetsByDate'), now.getTime())),
q.Lambda(['date', 'ref'], q.Get(q.Var('ref')))
)
)
// post all tweets from date range on twitter
data.forEach(async ({data: {tweet}}) => {
await twitterClient.v1.tweet(tweet)
})
res.status(200).json({success: true})
} catch (err) {
res.status(500).json({statusCode: 500, message: err.message})
}
} else {
res.setHeader('Allow', 'POST')
res.status(405).end('Method Not Allowed')
}
}
cron.js
디렉터리에 cron.js
파일을 만들면 API 호출https://ourapp.com/api/cron을 제공합니다. 이 호출은 트위터에 트윗을 올립니다.Vercel에 배포
Vercel에 애플리케이션을 배치하기 전에 최신 변경 사항을 Github 저장소로 푸시합니다.terminal을 열고 프로젝트의 루트 폴더로 이동하여 다음을 실행합니다.
git add .
git commit -m “vercel setup”
git push -u origin main
이제 Vercel에 애플리케이션을 배치합니다.저장소를 선택하고 가져오기 버튼을 클릭합니다.
프로젝트 이름과 모든 환경 변수를 프로젝트 루트 폴더의
/api
파일에서 .env.local
탭에 추가하여 다음과 같이 프로젝트를 구성합니다.우리가 해야 할 마지막 일은cron 작업을 만드는 것입니다. 매 분마다 호출됩니다.
Cron 작업을 Cronhub로 이동
cron 작업을 Cronhub로 이동하려면 다음 절차를 따르십시오.
스케줄러 탭으로 이동한 다음 + 새 스케줄러 버튼을 클릭합니다.
cron 작업을 만들려면 다음과 같이 하십시오.
Vercel 도메인 설정에서 대상 HTTP URL을 찾을 수 있습니다.
스케줄러 탭을 사용하여 다음을 확인할 수 있습니다.
이 작업은 분당
Environment Variables
포스터 요청을 하는 것이다.yourdomain.com/api/cron
에 있는handler 함수는Fauna에서 모든 트윗을 가져와 트위터에 올립니다.결론
축하합니다!우리는 트위터 스케줄러 프로그램을 만들고 배치했다.
마지막 예제here를 통해 저장소를 찾을 수 있습니다.
Write with Fauna Program와 관련된 서면 서류.
Reference
이 문제에 관하여(React,NodeJS,FaunaDB,Vercel로 구축된 트위터 게시물 스케줄러(제2부분) 배치), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/nickbulljs/deploying-twitter-post-scheduler-built-with-react-nodejs-faunadb-and-vercel-part-2-3npb텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)