썬이의 IT세상

앱 내에서 스택 관리는 주로 react-navigation 라이브러리로 이루어집니다. 페이지 헤더나 별도의 버튼을 통해 이전 스택으로 돌아가는 "뒤로가기" 동작은 navigation.goBack() 함수를 사용합니다. 다만, goBack() 함수가 실행될 때마다 스택에서 -1이 되므로, 의도치 않은 동작이 발생할 수 있다는 점을 주의해야 합니다.const onBackEvent = () => { navigation.goBack() navigation.goBack() navigation.goBack()}return ( ... ...) 위 예제에서 onBackEvent 함수가 실행되면 3개 이전의 페이지로 되돌아가게 됩니다.실제로 뒤로가기 기능을 이렇게 구현할 개발자는 없겠지만,navigation..

매번 스크립트 파일을 새로 작성할 때, import React from 'react'; 부터 export default 파일이름까지 일일이 작성해줘야하는 번거로움을 덜어주는 VS Code의 기능을 다뤄보도록 하겠다. 🟨 Code Snippet ? - VS Code에서 새로 파일을 만들고 해당 파일에 들어가는 기본적인 코드들, 즉 거의 대부분의 파일에서 공통적으로 사용되는 코드들을 일일이 작성할 때 이를 간단한 명령어 하나로 작성해주는 기능이다. 예를 들어 앞서 적어놓은 부분을 좀 더 자세히 보면 import React from 'react'; import {View, Text} from 'react-native'; const filename = () => { return ( This is new file..

평소처럼 커리어리 피드를 보던 중 팔로우하는 어떤 개발자분께서 VS Code 내에서 Figma 화면을 볼 수 있다는 말씀에 후다닥 VS Code의 확장에 Figma를 검색해보니 Figma for VS Code 플러그인이 있어 간단하게 사용해본 후에 후기 및 사용법을 간단히 포스팅해보겠다. 먼저 앞서 말했듯 VS Code 확장 탭 > Figma 를 검색하면 Figma for VS Code 가 위와 같이 나올텐데, 당연히 install 을 눌러준다. 그러면 위 사진과 같이 좌측 탭에 피그마 로고가 생기면서 클릭해보면 피그마에 로그인해달라는 문구가 뜬다. 버튼을 눌러 로그인해주자. 정상적으로 로그인 되었다면 VSC 상에서 위와 같이 보일텐데, Recents 혹은 Shared Files 토글을 열어 작업 중인 ..

인라인 스타일(Inline-style)? 인라인 스타일은 자바스크립트 객체의 형태로 태그 안에 스타일 코드를 집어넣는 형식인데, 예를 들면 {children} 위와 같은 형식을 인라인 스타일이라 한다. 허나 인라인 스타일은 자바스크립트 엔진 쪽의 스레드에서 UI 스레드 쪽으로 브리지를 경유하므로, 동적 스타일이 아닌 정적 스타일을 사용할 때에는 앱의 디스플레이 속도가 느려지는 치명적인 단점이 있다. (이 때문에 React 공식문서에서도 인라인 스타일을 지양하도록 권고하고 있다.) 이러한 이유 등으로 인해 React Native에서는 StyleSheet.create로 스타일 코드를 정의하여 사용하게 되는데, StyleSheet.create 함수를 통해 만들어진 객체는 UI 스레드쪽으로 생성되기 때문에 컴포..

# 시작하기 앱을 개발하다 보면 리뷰 등의 기능에서 사용자 디바이스의 '카메라 앨범'을 불러와 사진 리스트를 출력해주어야 하는데, 해당 기능을 구현하는 데 사용해본 라이브러리 중 가장 대중적이고 편한 라이브러리인 react-native-camera-roll 라이브러리와 그 사용법, 그리고 flatlist를 통해 페이징 기능까지 구현해보자. # react-native-camera-roll 기본적으로 사용자의 카메라 앨범을 불러오려면 앱의 권한과 AOS/IOS 모두 설정을 해주어야 한다. npm 라이브러리 설치 명령어와 위 권한 관련 설정에 대해서는 도큐먼트를 잘 따라가면 순조롭게 진행된다. https://github.com/react-native-cameraroll/react-native-camerarol..

클라이언트가 서버에게 ' 비디오 파일, 이미지 파일을 줘 ' ' 이 파일을 내 디바이스에 저장해 줘' 라고 요청을 보낸다고 가정해보자. 그렇다면 서버는 요청에 따라 적합한 처리를 하여 클라이언트에게 응답을 줄 것이다. 하지만 당연히 컴퓨터는 컴퓨터의 언어로 요청을 처리해야하기에 이를 구분할 수 있도록 하는 체계가 필요하다. 그 체계를 바로 API (Application Programming Interface) 라고 한다. 정리하자면, API는 클라이언트, 서버와 같은 서로 다른 프로그램에서 요청과 응답을 주고 받을 수 있게 만든 체계이다. 이 API 를 클라이언트의 관점에서 바라봤을 때 클라이언트가 서버에게 보내는 요청은 크게 4가지 요소로 나눌 수 있는데, Create Read Upload Delete..

컴퓨터가 받아들이는 모든 정보는 0 또는 1로 변환되어 메모리에 저장된다. 이 때, 메모리에 있는 이진수(Binary)의 한 자리를 '비트(Bit)' 라고 한다. 앞서 말했듯 컴퓨터의 정보를 비트로만 설정한다면, 0 또는 1의 정보만 구분할 수 있다. 그래서 훨씬 다양한 데이터를 표현하기 위해 여러 비트를 묶어 정보를 나타낼 수 있다. 예를 들어, 1Bit는 0과 1. 2가지를 나타내지만, 2Bit는 00,01,10,11 총 4가지(2의 2제곱)의 표현을 할 수 있으며, 이런 식으로 비트의 수에 따라 2의 n제곱의 정보를 표현할 수 있다. 데이터를 나타내는 최소의 단위를 비트라고 정의한 것처럼, 비트에 따라 정의한 단위가 있다. '바이트(Byte)'는 8개의 비트를 나타낸 것으로, 말 그대로 1바이트에 ..