분류 전체보기31 SPA(Vue.js, Angular, React) 소셜로그인 흐름도 Single Page Application + Restful API + 소셜 로그인 (구글, 페이스북, 트위터, 인스타그램 등등) 을 모두 사용하는 웹서비스를 제작중인데,찾아보다가 결과적으로 아래와 같은 인증 흐름을 적용하게 되었습니다. 사진이 안보이면 사진을 클릭해서 확인하시면 됩니다.Vue.js 나 Angular.js, React 에 라이브러리가 없다면 Vuex, Redux와 같은 상태 저장소를 적절히 섞어서 직접 구현하면 됩니다. 중간중간에 REST API (백엔드)서버에서 access_token과 refresh_token을 데이터베이스에 저장하거나, jwt토큰을 어디다 저장하는지 등의 정보는 나중에 포스팅 하도록 하겠습니다.질문있으면 댓글로 남겨주세요. 2018. 11. 6. 처음으로 오픈소스에 기여하다. 본 게시물은 이전 블로그에서 이전한 게시물입니다.최초 작성일은 2018년 6월 7일입니다. Vue 컴포넌트를 짜다가... 자꾸 뭔가가 안되는것이었다. Vue.js 에서 컴포넌트 내 method에서 data에 접근할 수 없는 문제 발생 그래서 찾아보니 공식 Vue.js 한글 문서에는 해당 문제에 대한 경고문구가 존재하지 않았다.비록 한글로 작성이 되어 있진 않았지만, 개발 집단지성의 끝판왕 StackOverflow 를 뒤져보니 해결법이 나와있었다. StackOverflow의 답변에서는 Vue.js의 공식 Document을 참조하고 있길래 링크를 타고 공식 문서를 열어보니 위의 Arrow function 부분이 한글문서에서는 아래와같이 존재하지 않았다. 그래서 이건 생애 처음으로 오픈소스 커뮤니티에 기여해볼.. 2018. 11. 6. Vue.js 에서 컴포넌트 내 method에서 data에 접근할 수 없는 문제 발생 Vue.js 컴포넌트를 정의하던 중, 컴포넌트 내에 method에서 컴포넌트의 다른 메소드와 data의 값을 참조하려니 다음과 같은 오류가 떴다. Uncaught TypeError: Cannot read property of undefined 위의 문제는 여러 문제가 있을 수 있겠으나, 대부분은 ES6의 Arrow function을 써서 생기는 문제이다. 나의 경우 querySearch라는 method를 아래와 같은 방법으로 써서 생긴 문제였다. methods: { querySearch: (queryString, cb) => { .... } } 위 코드를 methods: { querySearch: function(queryString, cb) { .... } } Arrow function을 자바스크립트 .. 2018. 11. 6. 개발자 기술 면접 준비시 간과할 수 있는 실수들 이 게시물은 내가 면접을 준비하면서 읽고 도움이 됐던 책의 내용을 조금 인용하여 정리하는 글이다. 1.손코딩 연습 안하고 IDE띄워놓고 연습하기 면접때 어떤 환경에서 코딩을 하게 될 지 모른다. 평소 Visual Studio Community 버전이라던지, Eclipse를 띄워놓고 연습해왔다면 앞으로는 손으로 코드의 초안을 적어보고, IDE에 옮긴 후 컴파일을 시도해보자. 실제로 삼성 코딩 면접이나, 카카오 코딩 면접 등등 대부분의 회사는 회사가 지정해둔 시험환경에서 치르게 되므로 VisualStudio 나 Eclipse를 고수해왔다면 손코딩을 먼저 하는 방식으로 바꾸어 본다면 많은 도움이 될 것이다. 2.머릿속으로만 생각하며 문제풀기 기술 면접중 코딩문제가 주어졌을때, 면대면으로 진행하는 경우에 해당된.. 2018. 11. 6. 1 ··· 4 5 6 7 8
