저장소

https://city-kim.tistory.com/18 Vue3, unit test, e2e, chromatic github ci구성(1) - 프로젝트 구성 Vue3와 Vite, Vitest unit test, cypress e2e test, storybook과 chromatic의 시각화 테스트를 구현하고 github ci로 자동화를 해보도록 한다 Vite를 활용해서 Vue3 프로젝트를 생성하고 테스트를 구성해보자 패키지매 city-kim.tistory.com 프로젝트 구성이 끝났다면 이제 workflows를 추가하여 github actions에 자동화를 구성해보도록 하자 root 디렉토리에 .github/workflows/jobs.yml를 생성하고 unit_test를 실행하도록 설정한다 https:/..

Vue & Nuxt 2023. 10. 19. 14:59

Vue3와 Vite, Vitest unit test, cypress e2e test, storybook과 chromatic의 시각화 테스트를 구현하고 github ci로 자동화를 해보도록 한다 Vite를 활용해서 Vue3 프로젝트를 생성하고 테스트를 구성해보자 패키지매니저는 pnpm을 사용한다 https://ko.vitejs.dev/guide/ Vite Vite, 차세대 프런트엔드 개발 툴 ko.vitejs.dev Vite 프로젝트는 다음과 같이 생성하였다 프로젝트명은 ci_tutorial으로 하였고 framework는 Vue를, variant는 create-vue를 사용하여 custom으로 환경을 구성하였다 기본적으로 Typescript를 사용하였으며 추후 확장을 위해 JSX support, route..

Vue & Nuxt 2023. 10. 18. 17:55

이번 포스팅에는 Nuxt.js에 인증을 구현해보도록 하자 setup 우선 nuxt를 설치한다 npx nuxi@latest init 인증은 nuxt/auth 모듈도 있지만 현 포스팅 기준으로는 nuxt의 공식 커뮤니티의 roadmap의 우선순위가 높지않으므로 약간 패키지가 불안정한 모습을 보이고 있기 때문에 이번에는 sidebase의 next-auth를 사용할 예정이다 https://nuxt.com/docs/community/roadmap Roadmap · Nuxt Nuxt is constantly evolving, with new features and modules being added all the time. See our blog for the latest framework and ecosystem..

Vue & Nuxt 2023. 6. 15. 21:57

이번포스팅에는 대화를 저장하여 이전내용을 기억하도록 해보자 mysql DB를 활용할 수 있지만 이번 포스팅에는 node.js의 fs로 json파일을 생성하고 대화내용을 저장해보도록 하자 https://nodejs.org/api/fs.html File system | Node.js v19.8.1 Documentation nodejs.org node.js fs 우선 파일시스템에서 파일생성 및 읽고 쓰기를 만들어보자 fs는 node.js에 기본으로 내장되어 있으므로 별도의 패키지를 설치할 필요는 없다 server/lib 디렉토리에 다음과같이 파일을 추가해주자 그리고 json파일을 저장하기위해 root에 data 디렉토리를 생성하고 slack과 browser 디렉토리도 생성한다 openai.ts 우선 inter..

Vue & Nuxt 2023. 3. 30. 18:30

이번 포스팅에는 slack bot을 생성하고 앞서만든 openai api와 채팅을 하도록 추가해보자 slack GPT앱은 현재는 정식 출시되진 않았고 베타로 이용신청을 할 수 있다 https://slack.com/intl/ko-kr/blog/news/how-i-built-the-chatgpt-app-for-slack How I built the ChatGPT app for Slack A conversation with Simón Posada Fishman, the OpenAI solutions engineer who developed the breakthrough app slack.com 정식 출시되면 연동 및 작업은 크게 의미가 없어지지만 그 전까지 사용할 수 있도록 작업해보도록 하자 Slack bot..

Vue & Nuxt 2023. 3. 26. 18:14

이번 포스팅에는 GPT를 연동하고 브라우저에서 질문 및 답변까지 하도록 구성해보도록 한다 server 💻 추후 slack을 연동할 것이기 때문에 서버의 디렉토리 구성은 다음과같이 한다 순수하게 gpt와 통신은 openai_completion.ts에서 담당하고 클라이언트에서 api 호출은 browser.post.ts에서 한다 Nuxt3에서는 서버도 디렉토리로 라우팅을 하고 그 안에서 [name].[method].ts로 구분하면 http method와 매칭까지 시켜준다 https://nuxt.com/docs/guide/directory-structure/server#matching-http-method server/ · Nuxt Directory Structure Nuxt automatically scans..

Vue & Nuxt 2023. 3. 26. 14:59

Nuxt.js로 서버를 구성하고 openai api를 연동하여 브라우저에서 GPT와 채팅을 하는 기능을 만들어보자 추가적으로 slack과 연동하여 슬랙 내부에서도 채팅을 가능하도록 만들어보자 이번 포스팅에서는 기본적인 환경구성을 하도록한다 KEY api를 호출하려면 apiKey 가 필요한데 secret key를 이곳에서 발급받을 수 있다 chat으로만 구현할 것이기 때문에 organization은 필요없다 OPENAI_SECRET_KEY=sk-... .env에 위와같이 저장해둔다 Nuxt💡 이후 Nuxt 환경을 구성하자 프로젝트명은 nuxt-gpt로 만든다 이 포스팅에서는 Nuxt3를 사용한다 🤔npm 까지는 설명하지 않겠습니다... npx nuxi@latest init nuxt-gpt cd nuxt-g..

Vue & Nuxt 2023. 3. 26. 13:19