AI를 통한 웹 페이지 만들기 (make real tldraw)

처음 웹 페이지를 만들어보고 싶어서 이것저것찾아보다가 GPT를 이용하여 웹 페이지를 코딩해주는 방법이 있다고 해서 찾아봤다.
아래 레퍼런스 리스트중에 실제 사용 영상을 보면 어떠한 페이지 html 코드를 그림으로 그린 후에 Make Real을 클릭하면 직접 페이지를 보여주고
이 코드를 직접 사용할 수가 있다.

 

실제 사용 영상

실제 사용 영상

주의사항

하지만 사용전에 알아둬야 할 것이 있다.
이 서비스를 사용하는데는 비용이 발생한다.
또한 처음 카드를 연결하려면 최소 5$(달러)를 충전해야 사용이 가능하다.
그리고 계정을 풀고 api code만 받아서 연결해볼까? 라는 짱구굴리자말자.
다시연결하려면 또 5달러 결제해야된다....

 

비용

해당 서비스의 이용료

사용방법

1. https://makereal.tldraw.com/ 을 접속
2. 하단부에 Your OpenAI API Key(risky but cool 이라고 적혀있는데 여기서 도움말을 클릭하면 나오는 URL로 접속한다.
   • https://platform.openai.com/docs/overview
3. 계정을 생성한다.
4. 왼쪽 리스트에서 Settings → Billing 을 들어가서 카드를 연결해서 최소 5$(달러)를 결제한다
5. 왼쪽 리스트에 API Key 를 들어간다.
6. New Key(새 비밀키)를 클릭하여 키를 생성하고 이 키값을 아까 처음에 API Key 넣으라고 한곳에 넣어준 후 처음 1번에있는 URL로 접속한다.
7. 내가 원하는 내용을 작성하고 오른쪽 상단에 Make Real 을 누르면 생성된다.

 

개인적인 의견

사용해보는것도 좋을 것 같다.
혼자 무언가 개발할 때 사실 간단한 HTML은 작성하지만 스크립트 등 모르는 기술들도 있기 때문에 이때 여기서 도움을 받는게
제일 좋아보인다.
사실 비용은 아직까지 엄청 비싸다 정도는 모르겠지만 나름 알아가기에는 좋아보인다.

 

Reference

• https://youtu.be/0P3MEzztgVE?list=LL (실제 사용 영상)
• https://github.com/tldraw/make-real (Github)
• https://platform.openai.com/docs/overview (AI)