스크린 이동 후 뒤로가기를 수행할 때 또는 Drawer와 Dialog등이 클릭 후 자동으로 숨겨지기 원할 때 pop을 사용한다. 이 때 Navigator.of(context).pop()과 Navigator.pop(context)를 사용하는 두 가지 방식이 있어 차이를 짚고 넘어가려 한다. 사실 두 함수 기능에 큰 차이는 없으며 Navigator.pop(context)이 내부적으로 Navigator.of(context).pop()을 호출하는 구조이다. Navigator.of(context).pop()을 사용하면 가장 타이트하게 떨어져있는 context를 불러올 수 있다. 그러므로 특정 예외상황을 제외하고는 범용적으로 사용될 수 있는 Navigator.pop(context)를 쓰는 것이 낫다. 이 예외 상황..
Flutter 앱 개발할 때 padding 또는 width, height 등을 고정으로 잡아놓으면 결국 다른 해상도의 디바이스에서 실행할 때 화면이 다 깨져버린다. 프로토타입 만들 때는 고정으로 해도 되지만 실제로 배포하기 전에 각기 다른 해상도에서도 문제가 생기지 않도록 비율로 지정해놓는 것이 정신건강에 이롭다. MaterialApp 내부에서 해당 screen의 높이와 너비는 MediaQuery를 이용해 알아낼 수 있다. double width = MediaQuery.of(context).size.width double height = MediaQuery.of(context).size.height import 'package:flutter/material.dart'; void main() { runAp..
react-native를 하며 라이브러리에서 특정 메소드 또는 함수를 import 할 때 {}(중괄호) 안에 적어줄 때도 있고 그냥 메소드명만 표기할 때가 있는데, 예를 들어 아래와 같은 경우가 있다. import React, { useState, useEffect } from 'react'; React는 중괄호 없이 적었고, 상태 관리를 위한 Hook인 useState와 컴포넌트 랜더링 시 원하는 작업을 실행시키도록 도와주는 Hook인 useEffect는 중괄호 안에 메소드를 적었다. 이는 'react'라는 패키지 내부에서 어떻게 해당 메소드를 export 하는지에 따라 import시 표기하는 방법이 달라진다. 만약 아래와 같은 contextAPI가 있다고 가정한다. import React, { cre..
개발 중이던 앱은 푸시 알림을 받아 웹뷰를 보여주는 기능을 수행한다. 이때 푸시 알림은 가장 상위단에서 수신하고 url 정보 갱신한 후 하위 Home까지 props로 전달하고, 최종적으로 Home.js에서 useState를 이용해 url 변수를 갱신하여 rerender하는 구조를 계획하였다. 하지만 useState의 남용에 의해 아래 에러가 발생하였다. "Too many re-renders. React limits the number of renders to prevent an infinite loop." 해당 에러가 발생한 구조는 아래와 같다. // App.js import React, { useEffect, useState } from 'react'; import * as Notifications f..
30만 개 정도의 데이터를 Dataframe을 이용해 append 연산을 하는 작업을 수행하다 비정상적으로 느리게 동작하는 것을 발견했다. 아무리 느린 파이썬이라 해도 이 정도로 삽입 연산이 느린 것은 잘 와닿지 않아 실험을 해보았다. 아래와 같이 7가지 테스트를 진행하였다. pandas append pandas concat pandas loc dict in list dict list comprehension list append list comprehension 1, 2, 3 번은 각각 Dataframe 첫 행 생성 후 append, concat, loc를 이용하여 데이터를 삽입한다. 4번은 dictionary를 list에 append하며 생성하고 Dataframe으로 변환시켰고, 5번은 diction..
1. 삼항 연산자(Ternary Operator) if-else 문으로 처리할 수 있지만 삼항 연산자를 사용하면 가독성은 떨어질 수 있지만 간결하게 표현이 가능하다. 브런치(Branch)문의 원래 기능처럼 런타임에 변수나 상태 등을 변경할 때 사용할 수 있다. const actions = ["Work", "Eat", "Leave"]; console.log(actions.includes("Eat") ? "Hamburger" : "Coding"); // "Hamburger" 2. 선택적 체인(Optional Chaining) 존재하지 않는 속성(property)을 호출하면 오류를 반환한다. 이때 오류가 아닌 undefined를 반환하도록 하는 선택적 체인(Optional Chaining) 방법이 있다. An..