Thumbnail
개발 · 프로그래밍 프론트엔드

React + GPT API로 AI회고록 서비스 개발 (원데이 클래스) 대시보드

(4.9)
14개의 수강평 ∙  1,133명의 수강생

무료

지식공유자: 도도(코딩루팡)
총 12개 수업 (59분)
수강기한: 
무제한
수료증: 미발급
난이도: 
입문
-
초급
-
중급이상
지식공유자 답변: 미제공
폴더에 추가 공유

초급자를 위해 준비한
[AI · ChatGPT 활용] 강의입니다.

1시간안에 끝내는 React기반의 GPT AI서비스 강의 수강 후 나만의 AI GPT SASS 솔루션을 만들어 보세요.

✍️
이런 걸
배워요!
ChatGPT Prompt
웹개발 (기초)
React ( Vite, Styled-component, Antd )
GPT API 연동

GPT API를 이용하여 만드는
React 기반 AI 서비스 💻

요즘 프론트는 React가 대세라던데, 1시간만에 쓸만한 서비스를 만들어 볼 수는 없을까요? 

GPT API 를 이용해서 React 기반의 AI 서비스 - 심리 상담사 GPT, AI 회고록을 만들어봅니다.
단 한 시간만에, 무료로 최신 기술을 활용합니다!


이런 분들께
추천합니다.

웹 기반의
GPT 서비스를
만들고 싶은 사람

웹 개발을
흥미롭게
시작하고 싶은 사람

리액트 개발을
맛보고
싶은 사람

 

이 강의를 통해 배울 수 있는 것

  • React 기반의 웹 어플리케이션을 제작
  • Chat GPT의 프롬프트를 개발 서비스와 연동
  • React 개발 전반의 과정을 학습. ( 이벤트, 입력처리, 스타일링, API 연동 ) 

강의 특징 ✨

  • 실습 위주로 코드를 작성합니다. 
  • 긴 설명없이 바로 서비스를 제작하는데 필요한 개념만 학습합니다. 
  • 간단한 서비스 기획과 GPT Prompt을 이용해서 Backend API를 제작합니다.
  • 리액트를 몰라도 간단한 웹지식을 기반으로 서비스를 제작할 수 있습니다. 

학습 내용 📚

만들어볼 서비스! 미리보기

  • 1. 사용자가 오늘 있던 일을 적습니다.
  • 2. 심리상담사 GPT가, 글을 완성해 줍니다.
  • 3. 심리분석과 조언까지 해드려요. 

 


예상 질문 Q&A 💬

Q. GPT API 호출은 유료 인가요?
A. 처음 회원가입하면 무료로 사용할 수 있는 크레딧을 줍니다. 그 기간이 끝나면 결제가 필요해요.

Q. 코드를 놓쳤어요.
A. 깃허브에 공개된 소스코드를 가져다 쓰시면 됩니다.!

github : https://github.com/dodokyo/gpt-diary-service 

 


수강 전 참고 사항 📢

실습 환경

  • M1 Mac Book Air 환경에서 실습을 진행합니다. 

선수 지식 및 유의사항

  • 약간의 HTML/CSS/JS 지식을 바탕으로 강의 제작.
  • 눈치가 좋은 사람은 없어도 수강 가능! 

지식공유자 소개 ✒️

IT 서비스 대기업에 웹개발자로 재직중 입니다.!
코딩 루팡이라는 Youtube 채널을 운영하고 있어요.

  • 주제 : 취업 / 웹개발 강의 

이런 분들께 추천드려요!

🎓
학습 대상은
누구일까요?
처음 리액트를 재밌게 배우고 싶은 사람
GPT기반의 나만의 웹서비스를 만들고 싶은 사람
📚
선수 지식,
필요할까요?
약간의 HTML/CSS/JS 기본

안녕하세요
도도(코딩루팡) 입니다.
도도(코딩루팡)의 썸네일
  • 프론트 개발자로 네카라쿠배 중 하나의 IT서비스 기업에 재직하고 있습니다. 😀

  • 🚀 SW마에스트로 Expert 취업 멘토링

  • 🚀 Naver Boostcamp BE 멘토 경험

  • 🚀 FE 7Code 로드맵 강의 제작

커리큘럼 총 12 개 ˙ 59분의 수업
이 강의는 영상, 수업 노트가 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. 소개영상
섹션 1. GPT Prompt 개발 및 서비스 정의
GPT Prompt 사용법 1 미리보기 04:34
GPT Prompt 사용법 2 04:58
GPT AI 회고록 서비스 기획 03:53
섹션 2. React 기초 - 설치, Counter
리액트 개발환경 및 설치 미리보기 02:55
리액트 프로젝트 구조 02:39
리액트 Counter 예제 05:36
섹션 3. React 개발 - GPT API 연동, AI회고록 서비스 완성
GPT API Key발급, React Env설정 04:41
GPT API 호출, 프롬프트 연동 07:51
React - 사용자 입력 처리 04:32
React - 스타일링 08:24
React - 파이널 테스트 07:08
강의 게시일 : 2023년 09월 26일 (마지막 업데이트일 : 2023년 09월 26일)
수강평 총 14개
수강생분들이 직접 작성하신 수강평입니다.
4.9
14개의 수강평
5점
4점
3점
2점
1점
VIEW 추천 순 최신 순 높은 평점 순 낮은 평점 순 평점 순 높은 평점 순 낮은 평점 순
김남규 thumbnail
3
개발환경 구성에 대한 좀 더 자세한 강의 요청 드립니다.
2024-04-22
지식공유자 도도(코딩루팡)
👍
2024-04-23
Huthuthut thumbnail
5
쉽게 이해할 수 있습니다
2024-04-06
김수철 thumbnail
5
무료로 강의를 제공해주어서 감사합니다.
2024-03-21
JU HOON Kim thumbnail
5
예제를 통해 설명해주셔서 도움이 되었어요.
2024-03-18
eroica thumbnail
5
유익한 강의였습니다.
2024-03-08