프로그래밍/Javascript
React Native에 Apollo Client, GraphQL 부착하기
우선 리액트 네이티브를 사용하려면 리액트 네이티브를 설치하여야한다. 그리고 안드로이드 스튜디오도 설치해야하고... ios용으로 빌드하기 위해선 xcode도 설치해야하고... watchman도...cocoapod도...create-react-native-app도... 그치만 그것은 생략맨 리액트 네이티브에 그래프큐엘을 부착해보려고 한다. 목표 1. expo를 사용하지 않고 React Native 프로젝트를 생성 2. Apollo Client를 사용하여 GraphQL 부착하기 1. expo를 사용하지 않고 React Native 프로젝트를 생성 먼저 프로젝트를 만들어보자. 리액트 네이티브 프로젝트를 만드는데 가장 널리쓰이는 방법은 2가지가 있다. 1) Expo를 사용 2) React-native CLI를 사..
노션 페이지를 React로 웹에 띄워보자 (react-notion)
코로나로 인해 언택트 바람이 부는 이 시기... 의도치않게 여러 기업들이 최신기술을 도입하는 경우가 생기고 있다. 화상회의 도구 Zoom을 포함해 여러 회사의 협업도구들이 사용되고 있다. 사실 노션 그 자체는 협업을 위한 도구라고 한정짓기보다는 그들이 소개하고 있는대로 '올인원 워크스페이스'라고 설명할 수 있는데... 기업이나 개인이나 자신들의 정보를 다양하게 정리할 수 있는 좋은 수단으로 각광받고 있다. 아무튼, 오늘 포스팅해볼 내용은 이러한 노션들을 웹 상에 공개하는 방법에 대한 이야기이다. + 다 쓰고 나니까 글이 길어졌는데 사실 사진이 많아서 긴거지 내용은 별로 없다. 아 쉽다쉬워 첫번째 방법 노션을 웹으로 가져오는 첫번째 방법은 '노션 공개페이지 사용' 이다. 노션에서 글을 하나 작성하고 오른쪽..
구조분해 할당(비구조화 할당) (Destructuring assignment)
ES6에서 도입된 문법 중 구조분해 할당(비구조화 할당, 구조 분해)를 이용하면 여러모로 간결하게 코드를 작성할 수 있다. 배열 const arr = ['가', '나', '다', '라']; const ga = arr[0]; const na = arr[1]; const da = arr[2]; const ra = arr[3]; 우리가 배열을 하나 선언하고, 해당 값들을 하나하나 꺼내어 변수로 선언하고, 사용해야한다면 이런 식으로 사용해야한다. ga, na, da, ra를 콘솔에 찍어보면 아래와 같은 결과가 출력될 것이다. 가 나 다 라 우리는 위와 같은 코드를 구조분해 할당 문법을 통해서 조금 더 간단하고 간결하게 개별 변수로 선언이 가능하다. const [ ga, na, da, ra ] = ['가', '나..
React에서 화면을 만드는 흐름 (index.js, index.html, app.js)
2020/06/02 - [프로그래밍/기타] - VS Code로 React + SpringBoot 개발환경 세팅 (2/2) VS Code로 React + SpringBoot 개발환경 세팅 (2/2) 2020/06/02 - [프로그래밍/기타] - VS Code로 React + SpringBoot 개발환경 세팅 (1/2) VS Code로 React + SpringBoot 개발환경 세팅 (1/2) 스프링부트 환경 먼저 구성하고 시작. 앞글 참고... 2020/05/28 - [프로.. 1nnovator.tistory.com 지난번 VS Code로 리액트와 스프링부트 개발환경을 세팅해보고 간단한 코드를 적어보았다. https://lemontia.tistory.com/912 [react, springboot] rea..
VS Code로 React + SpringBoot 개발환경 세팅 (2/2)
2020/06/02 - [프로그래밍/기타] - VS Code로 React + SpringBoot 개발환경 세팅 (1/2) VS Code로 React + SpringBoot 개발환경 세팅 (1/2) 스프링부트 환경 먼저 구성하고 시작. 앞글 참고... 2020/05/28 - [프로그래밍/기타] - VS Code로 Java, SpringBoot 개발환경 세팅 (1/2 - Java) VS Code로 Java, SpringBoot 개발환경 세팅 (1/2 - Java) [JDK + V.. 1nnovator.tistory.com 지난 글에서 리액트 프로젝트를 생성해보았다. 이번에는 직접 코드를 적어볼 것인데... https://lemontia.tistory.com/912 [react, springboot] reac..