목록 Development (97)
글쓰는 개발자
1. 문자열 데이터 타입문자열은 변수, 상수, 표현식, 함수 호출을 조합하여 구성할 수 있다.var userName = "Kim"var count = 25var message = "\(userName) has \(count) apples."print(message) 결과Kim has 25 apples. 여러 줄의 문자는 삼중 따옴표 안에 넣어서 선언할 수 있다.var multiline = """ 안녕하세요 "김철수" 라고 합니다. 반갑습니다. """ print(multiline) 2. 상수와 변수변수는 var 키워드를 사용하여 선언하며, 상수는 let을 사용해서 선언한다.var userName = "Jim"let maxCount = 20 3. 튜플튜플은 여러 값을 하나의 항목으로 그루핑하는 ..
VS 코드에서 하나의 윈도우를 사용할때 comman + click 혹은 control + click으로 해당 라인이 정의된 파일을 열어주는 기능을 사용할수 있다. 해당 기능을 사용해 정의된 파일로 이동할때 이미 해당 파일이 열려있으면 내가 열어둔 파일창으로 이동한다. 하지만 만약 분할창(split window)를 사용하고 있다면 분할창에 열려있는 파일을 무시하고 내 현재 창에 새로운 창이 열린다. 왼쪽에는 react 컴포넌트창, 오른쪽에는 스타일창을 열어두고 작업하는 입장에서 불편하지 않을 수 없다. 그럴때 VS code에서 File - Properties - Settings에 들어가서 아래 옵션을 true로 바꾸어주면 split 윈도우에 열린 창까지 검사해서 이미 해당 파일이 열려있으면 해당 파일로 ..
리액트에서 useState 함수를 사용하면 value와 set 함수 두개를 얻을 수 있다. const [value, setValue] = useState('초기화값'); 이때 setValue를 통해 값을 변경하면 value값은 리렌더링 되어 UI에 표시된다. 근데 이 value에 들어간 값이 int나 string 같은 값이 아니라 오브젝트 혹은 array일 경우에는 그 값을 변경하고 set함수를 호출해도 UI에 값이 변경되지 않는다. const [array, setArray] = useState(['a', 'b']);array.push('c');setArray(array); // 여전히 화면에는 a와 b밖에 보이지 않는다. React는 useState로 만들어진 변수들을 계속 감시를 하고 변경을 감지하면..
[앱스토어 배포] 앱 심사 정보 손쉽게 입력하기 - 1. iOS 미리보기 및 스크린샷앱 심사를 위해서는 디스플레이별 스크린샷과 프로모션 텍스트, 설명, 지원 URL 등이 필요하다. 1. iOS 미리보기 및 스크린샷iPhone의 경우 6.7 디스플레이, 6.5 디스플레이, 5.5 디스플레이별 이미지gran007.tistory.com 앱스토어 배포를 위해서는 지원 URL 즉 앱 홍보를 위한 홈페이지가 필요하다. 보통 개인은 블로그에 앱 홍보 페이지를 올려두고 URL 연동을 시키기도 하지만 개인 블로그가 지저분해 지기 때문에 따로 관리할 방법이 있으면 좋다. 필자는 노션에 홍보페이지를 언어별로 작성한 뒤에 공유를 통해 각각 외부 홈페이지를 만들어서 연결시켰다. 아래처럼 영문, 한국어, 일어 각각 페이지를 만든..
기존 react 단일사용을 할 때는 react-localization을 사용해서 영문 국문 프로파일을 나누고 이를 불러서 사용하면 브라우저 언어를 인지해서 영문 국문을 자동으로 구분해서 출력해주었다. nextjs에서 해당 방법을 사용하면 충돌이 발생해서 next js에 맞는 방식의 다국어 지원방법을 찾아야 한다. nextjs에는 App Router를 사용한 다국어 지원 방식을 제공하는데 도메인 뒤에 kr 이나 en을 붙이면 해당 언어로된 홈페이지가 보여지는 방식이다. 사용방식은 매번 업데이트 되기 때문에 만약 아래 글을 따라했는데 동작을 하지 않는다면 해당 링크를 참고해보자.https://next-intl-docs.vercel.app/docs/getting-started Next.js internatio..
https://gran007.tistory.com/entry/Reactreact-native-Redux-%EC%89%BD%EA%B2%8C-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0-23 [React/react-native] Redux 쉽게 사용하기 (2/3)https://gran007.tistory.com/entry/Reactreact-native-Redux-%EC%89%BD%EA%B2%8C-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0-12 [React/react-native] Redux 쉽게 사용하기 (1/2)React의 상태관리는 useState를 사용해 이루어 진다.import { useState } frgran007.tistory.com 리듀서 자동화 ..
https://gran007.tistory.com/entry/Reactreact-native-Redux-%EC%89%BD%EA%B2%8C-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0-12 [React/react-native] Redux 쉽게 사용하기 (1/2)React의 상태관리는 useState를 사용해 이루어 진다.import { useState } from 'react';function Home() { const [text, setText] = useState('hello'); return ({text})}하지만 useState를 사용한 상태값의 경우 해당 페이지를 상속하gran007.tistory.com 이전 포스팅에서 이야기 했듯이 redux에 상태값을 추가하고 사용하는 ..
React의 상태관리는 useState를 사용해 이루어 진다.import { useState } from 'react';function Home() { const [text, setText] = useState('hello'); return ({text})}하지만 useState를 사용한 상태값의 경우 해당 페이지를 상속하는 페이지까지만 해당 변수를 공유할수 있으며 모든걸 컴포넌트화 시켜서 관리하는 React의 특성상 이러한 변수를 여러개 만들어 아래로 계속해서 변수를 넘기게 되면 개발 복잡도가 기하급수적으로 늘어날 수 밖에 없다. 따라서 페이지 최상단에 몇개의 변수를 등록해 두고 이를 사용하는 곳에서 값이 변경될 때마다 페이지를 리로딩 할수 있도록 redux등의 상태 관리 방식을 개발했다. 유일한 상태..