<div id="readability-page-1" class="page"><div><div><a rel="noopener" href="/?source=post_page-----92e8950112b0--------------------------------"><div><p><img alt="Jeong Woo Ahn" src="https://miro.medium.com/fit/c/56/56/2*5-DkBQYvxo0TLldXjX88Og.png" width="28" height="28"></p></div></a></div><p id="5a99">2년 전 쯤인가 <a href="https://github.com/guruahn/vue-google-oauth2" rel="noopener nofollow">vue-google-oauth2</a>라는 오픈소스를 만든적이 있었다.(<a rel="noopener" href="/vue-js-구글로그인-플러그인-vue-google-oauth2-184c2859c78a">자세한 설명은 여기</a>) 원래는 회사에서 혹은 개인적으로 진행하는 프로젝트에 필요해서 만들었는데, 생각보다 많은 분들이 사용을 해주고 있어서 npm 패키지로도 제공하고 실제로 구현한 샘플 프로젝트까지 만들어 관리하고 있다.</p><figure><p><img alt="" src="https://miro.medium.com/max/1280/1*BT1CEzGVX6Y3439JQS2q7A.jpeg" width="640" height="427" role="presentation"></p></figure><p id="1651">그리고,</p><p id="65f3">Vue3가 나왔다. 그래서 <a href="https://github.com/guruahn/vue3-google-oauth2" rel="noopener nofollow">vue3-google-oauth2</a>를 만들었다. <a href="https://github.com/guruahn/vue3-google-oauth2" rel="noopener nofollow">깃헙 링크</a> 가보면 자세한 설명이 나와있으므로 여기서는 생략하고, 기존 vue-google-oauth2와의 차이점만 간단히 설명하고자 한다.</p><h2 id="fca8">구글api init 상태 및 로그인 상태 자동 감지(Reactivity) 기능 추가</h2><p id="c3ea">이것이 전 버전과 거의 유일한 차이점이다. 원래는 기존 프로젝트에 기능을 추가해서 Vue의 어떤 버전이던지 호환되도록 하려고 했으나, 코딩을 하다보니 유지보수 차원에서 분리하는게 낫겠다싶어 분리해버렸다. 특히 Vue2를 위해서 자동감지(Reactivity) 기능을 넣는 것은 좀 까다로운 문제가 있다. Vue3는 간단하게 플러그인에서 Reactivity한 상태를 제공할 수 있다.</p><p id="b58c">+추가로<span id="rmm"><span id="rmm"> </span></span>Vue3로 직접 플러그인의 동작 프로세스를 구현한 샘플코드를 만들었는데 새로운 SPA프로젝트가 있다면 반드시 Vue3로 할것 같다는 느낌을 받았다. Composition API만 이해해도 어렵지 않게 접근할 수 있다.</p><h2 id="2231">그동안의 오픈소스 운영 회고</h2><p id="560b">긴 회고는 아니더라도 그동안의 오픈소스를 운영하면서 느낀점을 공유해보고 싶었다.</p><ul><li id="d406">세계 각국의 개발자와 원격으로 개발하는 느낌? : 전혀 모르는 사람들이 내 플러그인을 사용하고 사용법을 문의하고 버그 리포트를 달고 풀리퀘스트를 보냈을때 기분이란 이런 것이다. 처음하는 경험이라 그런지 새삼스럽게 느끼게 되었다. 언어가 다르고 지구 반대편에 있는 사람과도 일할 수 있구나.</li><li id="e62c">영어를 공부하자: 아주 작은 기능이라도 전 세계의 많은 Vue 초보들에게 도움을 줄 수 있다. 그런데 영어로 소통할 수 있어야 한다. 읽는것은 좀 하겠는데 작문이 정말 힘들더라. 말하는거 이전에 읽고 쓰는걸 좀 잘하고 싶게 되었다. 그래서 내년 1월부터 온라인 스터디를 시작하기로 했다.</li><li id="7429">개방적 운영에 대한 고민: 내가 답변하기 힘든 이슈도 있다. 이 플러그인을 사용하는 다른 개발자들도 같이 답변을 달아주면 좋을것 같은데 운영을 좀더 <a href="https://opensource.guide/ko/" rel="noopener nofollow">개방적으로 하는 방법</a>을 고민 해야할 것 같다.</li></ul></div></div>

Stories by Jeong Woo Ahn on Medium

Jeongwoo Ahn

2년 전 쯤인가 vue-google-oauth2라는 오픈소스를 만든적이 있었다.(자세한 설명은 여기) 원래는 회사에서 혹은 개인적으로 진행하는 프로젝트에 필요해서 만들었는데, 생각보다 많은 분들이 사용을 해주고 있어서 npm 패키지로도 제공하고 실제로 구현한 샘플 프로젝트까지 만들어 관리하고 있다.
그리고,
Vue3가 나왔다. 그래서 vue3-google-oauth2를 만들었다. 깃헙 링크 가보면 자세한 설명이 나와있으므로 여기서는 생략하고, 기존 vue-google-oauth2와의 차이점만 간단히 설명하고자 한다.
구글api init 상태 및 로그인 상태 자동 감지(Reactivity) 기능 추가
이것이 전 버전과 거의 유일한 차이점이다. 원래는 기존 프로젝트에 기능을 추가해서 Vue의 어떤 버전이던지 호환되도록 하려고 했으나, 코딩을 하다보니 유지보수 차원에서 분리하는게 낫겠다싶어 분리해버렸다. 특히 Vue2를 위해서 자동감지(Reactivity) 기능을 넣는 것은 좀 까다로운 문제가 있다. Vue3는 간단하게 플러그인에서 Reactivity한 상태를 제공할 수 있다.
+추가로 Vue3로 직접 플러그인의 동작 프로세스를 구현한 샘플코드를 만들었는데 새로운 SPA프로젝트가 있다면 반드시 Vue3로 할것 같다는 느낌을 받았다. Composition API만 이해해도 어렵지 않게 접근할 수 있다.
그동안의 오픈소스 운영 회고
긴 회고는 아니더라도 그동안의 오픈소스를 운영하면서 느낀점을 공유해보고 싶었다.
세계 각국의 개발자와 원격으로 개발하는 느낌? : 전혀 모르는 사람들이 내 플러그인을 사용하고 사용법을 문의하고 버그 리포트를 달고 풀리퀘스트를 보냈을때 기분이란 이런 것이다. 처음하는 경험이라 그런지 새삼스럽게 느끼게 되었다. 언어가 다르고 지구 반대편에 있는 사람과도 일할 수 있구나.
영어를 공부하자: 아주 작은 기능이라도 전 세계의 많은 Vue 초보들에게 도움을 줄 수 있다. 그런데 영어로 소통할 수 있어야 한다. 읽는것은 좀 하겠는데 작문이 정말 힘들더라. 말하는거 이전에 읽고 쓰는걸 좀 잘하고 싶게 되었다. 그래서 내년 1월부터 온라인 스터디를 시작하기로 했다.
개방적 운영에 대한 고민: 내가 답변하기 힘든 이슈도 있다. 이 플러그인을 사용하는 다른 개발자들도 같이 답변을 달아주면 좋을것 같은데 운영을 좀더 개방적으로 하는 방법을 고민 해야할 것 같다.
이 글이 마음에 드셨다면 👏🏽👏🏽, 커피한잔 후원하기 (카카오페이), 이메일 구독하기

Vue3 를 위한 구글 로그인 오픈소스 vue3-google-oauth2 및 오픈소스 운영 회고

댓글