cu TIL (4) 썸네일형 리스트형 Authentication There is no anchor tag in React Native, so we can't write , instead we have to use Linking.openURL. 현재 우리 프로젝트의 개발 사양은 프론트 : 리액트 네이티브 , 백엔드 : 자바 스프링 으로 구성되어 있다. 구글 , 네이버 등 소셜 로그인을 Oauth 를 통해 구현하는 중에 생긴 어려움에 대해 해결한 과정을 쓰고자 한다! 크게 로그인의 로직은 다음과 같았다. 1. 앱에서 서버의 특정 url 로 웹을 연다. 2. 웹을 열게 되면 구글 로그인 화면이 나오게 된다. 3. 로그인이 정상적으로 완료되면 서버에서 JWT을 가지는 주소를 redirect 시켜준다. 4. 해당 url 에서 jwt 토큰을 가지고와 서버와 인증을 진행한다. 위.. Array - funtion of Array 1. Array.from - array-like object 를 array로 만들어준다. - getElementsByClassName 으로 만들어진 buttons 는 얼핏 array 와 비슷하게 생겼지만 array-like object인 HTMLCollection 이다. 이러한 객체들을 array로 바꿔주는 함수가 Array.from이다. string 해당 글에서는 es6 에서 달라진 HTML fragment 에 대해서 알아보고 그 활용법에 대해 포스팅 하고자 한다. 아래가 훨신 직관적으로 보임을 알수있다. 바뀐 fragment 의 사용법은 여기서 끝이 아니다! 바뀐 string의 사용법은 html의 수정이 일어났때 매우 유용하다. 위는 똑같은 동작을 하는 코드이다. es6 이전에는 줄바꿈을 지원하지 않았기 때문에 저렇게 html 형식으로 추가시킬수 없었다. 하지만 이제는 자바스크립트에서 html처럼 코드를 작성한뒤 넣는것이 가능하게 되었다. 뿐만 아니라 이제는 function (arg) 으로 함수를 부르는것이 아닌 function`arg` 로 호출하는 것이 가능하게 되었다. 이 방식은 react 에서 사용하는 방식이기 때문에 알아둘 필요가 있다. Arrow Function - ES6 에서 권장하는 함수 작성 방법 - 기본적으로 익명함수 이기 때문에 생성자로서 사용할 수 없다. - 특징 1. 파라미터가 하나일 경우 () 생략가능 2. {} 를 생략하면 return 을 적지 않아도 가능 3. this 의 범의가 기존 함수와 다르다. es6 이전의 함수 호출에서는 this의 범위가 함수가 어떻게 호출되었는지에 따라서 동적으로 할당되었다. 하지만 es6에서 arrow function 은 정적으로 상위 scope 의 this를 정적으로 가르킨다. 이전 1 다음
