개발을 하다 보면 만들어 놓은 프로그램을 데스크앱으로 만드면 좋을 거 같다는 생각이 드는데 이걸 도와주는 프레임워크가 있다. https://www.electronjs.org/ 위의 프레임워크로 굴직한 프로그램들이 많이 제작되었다. 사용법이 관심이 든다면 한 번쯤 https://www.electronjs.org/docs/latest/ 공식 문서를 읽어보면 좋을거 같다(필자도 다 보진 않았다 ㅎㅎ). 여기선 간단하게 여지껏 만든 프로젝트를 데스크앱으로 어떻게 변환하는지 알아보겠다. ● package.json main, author, build 속성을 추가하였다. 그리고
이번글에서는 지금까지 개발한 소스를 github를 이용해서 배포하는 방법을 공유하고자 합니다. https://github.com/ github는 개발자들의 놀이터 같은 느낌을 주는 사이트입니다. 저는 그저 소스 저장소 용도로만 사용했었는데 사실은 더 많은 기능을 제공하고 있습니다. 그중에서 프런트엔드 호스팅 서버로서의 기능과 git action을 통한 ci/cd 방법을 간략하게 다루고자 합니다. 1. git action 위처럼 .github/workflows 폴더 아래에 main.yml파일을 만든다 main.yml name: rock
이제 제목과 같은 게임을 만들어보자. https://www.youtube.com/watch?v=rhZpF8H66RI&list=PLZzSdj89sCN38KeadQVtiha8gZ-KGpTOC 먼저 이번 소스는 위의 영상에서 소개하는 내용을 Vue3/TypeScript 환경에 맞게 컨버팅 한 것이다. 소스의 흐름은 위와 동일하니 한 번쯤 위의 영상을 보고 온다면 더 쉽게 이해가 될 것이다. 개인적으로 뷰 처음 접했을 때 해당 채널의 영상들이 많이 도움이 되어서 초심자들에게 추천하는 채널이다. ● main.vue <script setup lang=”ts”> import {
일반적으로 vue에서 개발 환경을 구성할 때 axios, store, router 등을 필수로 구성을 합니다. 이번 글에서는 이러한 플러그인들을 설치는 방법들을 정리하고자 합니다. 특히 store가 기존에는 Vuex를 사용해서 구성하였는 Vue를 만든 Evan You가 pinia를 더 추천하기에 이 플러그인으로 구성하도록 하겠습니다. 1. 플러그인 설치 위와 같은 명령어로 필요할 플러그인들을 설치합니다. 각 플러그인들을 간단히 소개하자면 아래와 같습니다. axios: Promise 기반
Vue3, TypeScript를 공부하고자 작은 개인 프로젝트를 만들어 나가면서 여기에 기록을 정리하고자 합니다. 환경구성은 Vue3, TypeScript, Vite, Pinia를 사용하여 플젝을 만들고 다 구현이 되면 github에 action을 통해서 자동 배포되도록 할 예정입니다. 끝으로 electron을 통해서 데스크톱 앱으로 만들예정입니다. 이 글에서는 프로젝트의 환경을 구성하는 부분부터 시작하겠습니다. 프로젝트 만들기 npm init vite 프로젝트이름 –template vue-ts 명령어로 Vue3, Typescript, vite가
동료들과 설정을 공유하는 방법을 공유하고자 합니다. 커맨드창에서 regedit /e “%userprofile%\desktop\putty.reg” HKEY_CURRENT_USER\Software\SimonTatham 위의 명령어를 치면 바탕화면에 putty.reg 파일이 생깁니다. 이파일을 공유 하면 됩니다. 사용법은 위의 파일을 더블클릭하면 푸티에 해당 설정이 적용되어있는것을 알수있습니다.
프론트앤드 개발을 하다보면은 현제 작업했던 결과를 로컬에서 구동해서 동료들과 공유를 해야 할때가 있습니다. 동료들과는 내부망이니 바로 구동한 다음 그 아이피를 알려줘서 보여줘도 되겠지만 그렇게 하면 내가 추가로 개발을 하면 내 로컬에 붙어서 확인하는 사람들의 환경이 변경이 되어서 불편함을 경험 했었습니다. 내가 개발하는 환경과 달리 공유용 환경을 만들면 이런 상황을 피할수 있어서 유용하고 실제 서버에 배포하는
